Case Studies > Mobile Learning – SFU Course Companion Case Study

Overview

Simon Fraser University is one of Canada's top three comprehensive universities, as rated by national surveys for almost 20 years. The School of Computing Science has approximately 1000 undergraduate and 200 graduate students, and Paul has had the privilege of serving for over ten semesters as a sessional instructor for CMPT 363, a third-year user interface design course.

Goal

To augment student learning and potential performance in CMPT 363 by providing a resource-rich course companion for both mobile devices and desktops.

Paul's Role

As an instructor, Paul wanted to provide his students with easy access to an extensive set of learning resources that were tightly coupled with his face-to-face classes. As a professional user experience design consultant, Paul's goal was to provide a seamless multi-platform presentation of online companion content to enable students to access resources when and where needed. Careful consideration was given to making sure that all the materials were consistent and easy to use across desktop and mobile devices. Tailoring both the user interface design and the instructional design to suit the delivery, the result was a popular course asset and a single source of materials allowing students a wide range of access and consistency of content.

Challenges

• Providing a great user experience while accessing a range of learning resources, regardless of viewing with a mobile device or on the desktop.
• Selecting and organizing learning resources to maximize student benefit.
• Identifying a CMS (Content Management System) which was able to handle customization of both the desktop and mobile viewing experience.
• For optimal viewing of some content, such as embedded class slides, a landscape view was required on smaller screen mobile devices.

Approach

• Pursued a "Mobile First" strategy, creating initial designs for viewing on mobile devices but with same content base and tools as when viewed on a desktop browser.
• With the chosen CMS being WordPress, a WordPress Framework (Headway) was used to help streamline the design and development of the website when being viewed on the desktop. The WordPress Plugin WPtouch Pro along with a custom child theme and CSS/PHP customizations was used to support mobile viewing of the course website content.
• The initial page displayed (homepage) immediately makes available time-indexed "weekly summaries", which provide key information/links for students.
• Provided a range of additional learning resources for each class, using a variety of media types (e.g. podcasts, videos, readings, etc.).
• Minimizing non-essential information elements when viewing website on a mobile device.
• In addition to resources grouped by class, a learner-centered resource collection was created based on a series of questions in the format of "How can I...".
• Conducted in-class user surveys to help drive a series of major user interface design updates.

Results

An in-class survey revealed that over 50% of CMPT 363 students were accessing the course website using mobile devices within the first four weeks of the course. Through continual student feedback, a range of user experience enhancements were made to further improve the efficiency and effectiveness of the website on mobile devices, while maintaining consistency of content on all platforms.

CMPT 363 User Interface Design mobile presentation

CMPT 363 User Interface Design iPad presentation

CMPT 363 User Interface Design desktop presentation