Moodle™ course design in snap

In Moodle™, site administrators set a theme to change the look and feel of the site. Moodle™ 2.7 has two themes (Clean and More) both of which are responsive. also has a responsive theme called Snap. This theme is available to customers and not only changes the look and feel of the site but the overall experience.

In previous posts I’ve discussed the benefits of responsive themes to support multiple devices and how to design courses for mobile access but today I’m going to focus on Snap specifically. The reason being that Snap is that different!

Snap provides a new course experience for students because it changes the way content is presented to students when interacting with modules organizes the content without the usage of the traditional column and block presentation and groups key information (deadlines recent activity alerts) for each student in a dashboard view.

Since Snap changes the way content is displayed and has altered functionality for the display of modules there are overall design choices that you might want to consider for a Snap course versus one using a different theme.

You can add an image to display behind the Table of Contents on the front page of the course by uploading a graphic into Course administration > Course settings > Course summary. Avoid having text near the top of this graphic since the course title overlays it. Lastly make sure you are uploading a higher quality image since it is spanning the entire width of the page potentially if being viewed from a desktop device.

I’d also like to note that when building with Snap all content is on one page. Use the Table of Contents to jump to a topic quickly rather than scrolling through all of the course content each time you add a module.

It is best to use the Topics course format with the Snap theme. By choosing this format Snap will only show content related to one topic at a time. Be sure to provide each topic with a name in the Topic Summary settings. Try to keep the topic titles meaningful yet short.

In Moodle™ you can choose to show the activity description on the front page of the course. In general this feature is minimally in order to keep a clean course front page and avoid overwhelming the students. However in Snap you might want to use this feature more. When using the Snap theme these descriptions instead are enclosed within the confines of the module on the front page.

In the following example the Page description is displayed (optionally) on the left and the image on the right is being pulled in automatically from the resource’s content onto the course front page. If you do not want to add a description you could use this feature in other creative ways (such as a way to inform users of the expected time requirement for completing a given module).

If you do add a description keep it short and to the point and avoid redundancy between descriptions and module content.

The icons that display in Snap are much different than the Moodle™ ones. The following is an example of a File resource with a description and a SCORM activity without one. Not only are the icons different but the display of these modules on the course page are also different. For example some modules will display side-by-side.

Hopefully these few tips will get you started in using Snap in a snap. You can try the theme out for yourself by enrolling in our free “What’s New in 2: Open Resources” online course using the enrollment key “joule2freecourse”. If you are a site administrator and need to learn more about configuring your site for Snap read the blog post “Using a Responsive Theme.”

Thanks for reading!

~Rebecca DeSantis, Senior Instructional Designer



Discover our solutions