Learning by Redesigning: Improving the Mobile Experience of my School’s LMS

Sebastian Mendo
UX Station
Published in
6 min readDec 7, 2018

--

Canvas LMS is course management system used by multiple higher educational institutions with the purpose of building a place where professors can share their class notes and information with students. In the University of British Columbia, Canvas has now been the leading platform for managing course content for almost two years, and is used by practically every professor out there. The Canvas platform offers both a desktop web-app, and a mobile app, used for checking and reviewing class content, staying up to date with pending assignments, and receiving messages from your professors.

Official Canvas Logo.

The Objective:

Although the services Canvas offers for the desktop have been, from my own personal experience, quite outstanding, I have seen many students dissatisfied with the Canvas Mobile App. The company and the school advertise almost exclusively the desktop application and as a result, few people are even aware that there even exists a Canvas app for their phone. My objective with this study was to explore the user habits of UBC students with Canvas, what may cause these habits, and to suggest future improvements to the app’s User Experience.

Canvas: Desktop vs. Mobile

User Research:

In order to test my hypothesis, I conducted a survey targeted towards UBC students in all year levels through the official UBC Facebook Page. This survey had the objective to test what are the behavioral patterns of people using Canvas, what are the core features that they use the most in the app, and what would they say would be a feature they would like to see implemented.

The following results came from 124 survey participants:

100% of people who filled the survey were using Canvas on Desktop, with 83% of them having used it on Mobile. However, 40% of these Mobile users don’t use the app more than once a week. This suggest that there is a reason to why students do not utilize the Canvas App.

Why does happening? Probably for a number of reasons: low engagement with the application, a lack of advertising, or simply because students do their classwork in their computer instead of their app.

All of these explanations suggest a common problem: the app is too complicated for quick and convenient use, and therefore students will have trouble using it due to the paradox of choice. So, in order to improve the Canvas App experience, it needs to be made much simpler and easy to use.

Out of the seven main features that the Canvas App offers, the research participants said that these were the most important features in the app:

  1. Assignment Deadlines,
  2. Reviewing Lecture Slides
  3. Finding a professor’s information.

This was derived after retrieving survey data and performing an importance-feasibility matrix.

Results from the survey data. Graphed using Google Sheets.

In addition to this, I included an extra tab at the bottom of the survey for participants to add any other features that participants recommended. I coded this data by using the following qualitative method: sorting them into four categories based on what kind of suggestions are being made.

Based on the findings, my goal is to focus on reducing the number of features to the ones that are important to the user and make the new UI more intuitive. By applying the Pareto Principle, not only will the site be more usable, but it will also make it far more convenient for a quick habitual use.

Information Architecture/Structure:

From this information, it is clear that there needs to be an improvement in how students access common core course information. In order to help make this information more accessible, the next step would be to map out the current user journey and the steps that it takes to reach these three features.

Canvas User Journey (as of 12/5/2018).

As you can see, the floor menu has five options along with a hamburger menu at the top. This tends to increase cognitive load and therefore making it much harder to use. However, sorting out each class directly from the dashboard page is very effective, as those tabs contain the key information that users are searching for.

Our improved information architecture utilizes a similar layout to the dashboard page but simplifies the options given to the users in the lower menu. This is done in order to focus the user’s attention onto the information that actually matters to them and to prevent distractions that may interfere with their journey.

Simplified from five (5) to three (3) options.

This would then make it more likely that users would first click on any of the course tabs, and so automatically check in their information.

Prototype Design:

With all of the research and information provided above, I utilized it to create a prototype design using Sketch.

New Canvas Mobile App Prototype (Sketch).

The stylistic choices used seek to find a pattern for users to click into the large colored boxes (making them seem like buttons) while giving them room to paying closer attention to textual information such as the to-do list or assignment notifications.

The background is kept at a consistent white in order to make the Canvas color scheme be far more prominent and draw more attention towards the button clicking process.

Because the current mobile app does not support downloading PDF’s, and the desktop experience is disorganized and confusing (from personal experience), by laying out the lecture slides one by one it helps students be far more effective at finding what they need without having to search for it in the desktop app. This also allows for an easier access to the class content along with staying consistent with the overall design aesthetic.

Conclusions:

Designing these changes to an app I use almost daily seemed at first very weird, but as soon as I began to delve into them, there was no going back. Although this was my first time ever using Sketch, my experience using Adobe products really helped me to know what the basic components of designing using a vector-based software. Although more research can be implemented through direct qualitative user testing, the data obtained is proportionate to the resources utilized in this study.

I’ve learned that although people can have their own assumptions in how a design should look and feel, doing the research is extremely important for being able to viably justify each design decision and into knowing that they really are the best changes you can make to a product. I hope to continue doing these projects and to continue practicing using design research methods and user experience.

If you find this article helpful, please 👏👏👏 so others can find it as well.

--

--

Sebastian Mendo
UX Station

Mixing Psychology with Design (left with right), in life and in business. User Experience Designer.