The Information School, iSchool, at the University of Washington has been providing templates for our Canvas courses since about late 2012. We started using Canvas in fall of 2011. Our templates have evolved with the available technological advances and we have spent the last few months designing for the next iteration. One of my colleagues, Putri Hiendarto, has spent a great deal of time working on this new generation of templates.
The question that we always struggle with is whether to optimize our templates for responsiveness or make them work best in the app. There are pros and cons either way but we are currently leaning more to the responsive design that works in the mobile browsers. For what our students do on mobile, based on a survey from a year ago, I think our focus on responsive is better at this point. What are your thoughts about developing for the apps, mobile web or both?
So, let's take a look at our "compact" template on both the Desktop and Mobile:
The image above show the desktop version of the template on the left and the mobile version on the right. The desktop version is shown in the Chrome browser and the mobile version is from Chrome on an Android device running Android 5.1 Nearly identical other than the purple menu wrapping and the course stream link loading at the bottom on mobile.
The next image shows "Week 1" expanded on both platforms, desktop on the left and mobile on the right:
You can see that the 3 column layout on the desktop collapses really well to a single column on the mobile side.
The next image show the comparison between the two platforms showing the menu on the syllabus page:
The last thing I will share is a two minute screencast of this template being used on my phone. It works really well.
I hope people find this post useful :-)