Canvas

Re-imagining a learning management tool for the tablet

Project Brief
Canvas is a tool used by teachers and students to post and manage course materials. Despite being one of the most widely used learning managements systems, Canvas is not especially user friendly. Determined to create a more intuitive and engaging design, I set out to rethink the exisiting interface for tablet. My redesign features improved visual aesthetic, streamlined navigation, and some helpful new functionality.
Details
Date: Spring 2015
Role: Individual Project
Existing Design
Below are screens from the current Canvas design. Beyond lackluster visual appeal, space is used very inefficiently throughout the current design, and important information is burried. Students want easy access to the information they care most about.
Information Architecture
The most frequently accessed information is burried in the existing Canvas site. Students want to be able to quicly reach relevant information and complete important tasks like submitting assignments.
Design Process
My main goals in redesigning Canvas were to enable students to access the information they care most about quickly and easily, and to present information in ways that helps students better understand their academic performance.

My design process started with sketches, and progressed through wireframes, mockups, and interactive prototypes. My initial sketches reimagined a home "dashboard" (shown right), which would allow students to customize what information they see first after logging in to Canvas. I also wanted to help students manage their coursework more effectively by providing a built in to-do list. Students could drag an assignment into a weekly calendar to prioritize and organize upcoming assignments.
Wireframes
Creating simple wireframes before building high-fidelity mockups allowed me to quickly experiment with potential layouts. This stage of the process is an important opportunity to ensure that information is organized in an intuitive way. I incorporated interactive elements to my wireframes using axure in order to conduct simple user tests with students.
New screen: Workload
No student enjoys being blind-sided by the simultaneous collision of major assignments from multiple classes. In addition to my focus on the home and grades screens, I designed a new functionality called workload. For each assignment that a teacher posts, they will attach an estimate of how long they predict it will take the average student to complete. My Canvas design will use this information to provide students with a helpful way prepare for upcoming spikes in their workload.
Style Matrix
Creating a style matrix helped me to hone in on a visual language. Through an exploration of existing tools, I decided to target a balance of simplicity and flexibility in my design. These values stemmed from a strong desire to make navigation to important information easy.
Initial Mockups
My initial mockups were an effort to translate rough page layouts into a more refined design. This was my first effort to establish a consistent color palette and to work towards an aesthetic that matched my target design principles. In order to refine my design further, I put my work in front of students to get high level feedback.
Final Design
My final design emphasizes a simple and clean aesthetic. I use space and color carefully to help visually categorize dense information. The ultimate goal of my design is to improve navigation to information that is accessed most frequently, and to provide functionality that helps students to manage their coursework more effectively. This design is made especially for tablets, but could be used effectively on desktop or mobile devices.
Interactive Prototype

back to projects