cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Community Member

Template for Canvas Homepage?

Now that the Canvas Announcements feature shows announcements on the home page (which we love by the way!), we're starting to rethink our old home page template that we use in every course.  I was wondering if anyone had any new designs they are using that they'd be willing to share?  I've attached a demo of what we currently do.  We're looking to have the instructor's contact info somewhere on the page as well, but we'd like to keep the course navigation box.  stefaniesanders your blog post (https://community.canvaslms.com/groups/designers/blog/2015/04/16/creating-an-inviting-course-home-pa... ) helped us immensely coming up with ideas for the home page in the past.  Are you using Announcements feature at all now? Does anyone have anything that they are using with success?  current homepage template

74 Replies
Highlighted

My degree is in graphic design, so when I first started at instructional design I had the same starting point, it sounds like. I would go all out making banners and buttons and this and that. The mental shift that happened for me was from trying to make a course that was aesthetic or cool to a course that was, before anything else, effective at its primary task - connecting students to content. Besides, there are lots of ways to make a visually appealing course that doesn't make it more inefficient for students to navigate. We can still make cool images that go on the assignments themselves or in announcements. Any Page can become a visually rich experience. And Canvas supports a decent amount of HTML if someone wants to go there.

Speaking from the other side, I'm currently a grad student finishing up a MS in instructional systems design. One of my instructors has this 3 x 3 grid of photos and illustrations, each of them a button to a different module. As a student, I ignore it. I'm not going to waste any time finding the correct button to click when I know I can always go to Modules, which will always be in the same place in the sidebar, and go directly to the thing I need to do.

Highlighted

As a graphic designer I want to have a nice looking informational homepage. 

But the reality of Canvas is, many of my students have NEVER seen my home page.  If they use the ToDo list, they bypass the home page AND modules, the same goes for the new list view for the dashboard.

Canvas gives us tools as instructors to make all this "cool" stuff, and organize our classes in meaningful ways, then gives students the tools to bypass ALL of it.  

At this point I am not spending any more time working on my hope page for my class and am tempted to go to modules only as well.

Highlighted

Hey Mike,

I do have a CodePen with the Art 1010 homepage code. You can check it out here.

It's a flexbox element with a defined width so I don't have to worry too much about media queries.

Hope this helps!

Mike

Highlighted

Thank you Veronica! I don't have them on Commons but I do have a CodePen with all of the CSS and placeholder HTML if that's helpful. You can find it here.

Highlighted

Thanks Heather!  That makes sense to link to a seperate page.  I think we might add a button that leads to the Instructor's Bio, but show their contact info on the home page.  Trying to figure out how to bring in the image too, which we might have to run a script to do this.

Highlighted

Mike,

Any chance I could get you to share the responsive HTML for the Art1010 homepage?  Making our templates responsive is on my list of things to do...and you will help me look like a master panda!

v/r

 MJH

Highlighted

Nicely done. This template looks fantastic. I’m a Canvas ‘Newb’ but would love to test something similiar. Where do you put announcements? 

Highlighted

Hi mmitchell@weber.edu, I really like the templates you created - are they available through the Commons?

Thank you!

Veronica

Highlighted
Community Advocate
Community Advocate

This is the homepage of the Arc intro course I created for my district.

290119_pastedImage_1.png

Highlighted

What is on the course navigation menu in this course? Just curious.

0 Kudos