MyHumber Dashboard

Redesign MyHumber website for efficient course registration
MyHumber Dashboard redesign
Skills
Research
Prototype
Usability Test
Responsive Design
Roles
UX UI designer
Tools
Figma
Timeframe
1 month
(Nov - Dec 2023)

Problem Statement

It is time-consuming and confusing for users to register for courses on the current MyHumber website, primarily due to the lack of intuitive navigation and the complexity of the search function.

To identify issues with the current MyHumber website, we conducted a UX audit, focusing on the registration flow. We found problems related to usability, interface, responsiveness, content quality, and organization. Below, we will concentrate on usability, content quality, and organization .

There are 3 main problems that cause difficulty and frustration for both freshmen and existing students when registering for courses:

Probelm #1
Inconvenient Registration Flow
Poor navigation menu and a long path to registration page create inconvenience to the students to register course.
Inconvenient registration flow for MyHumber page
Probelm #2
Searching for courses is time-consuming
Users must enter course information, such as subject name or course code, one by one to search for the program.
Inconvenient Search
Probelm #3
Poor readability of the registration dashboard
The registration dashboard is overwhelming, with densely packed content across multiple split screens.
Poor readability

Goal Statement

How might we redesign the MyHumber website to make the course registration process more efficient, enhancing the user experience and satisfaction for both freshmen and returning students?

Persona

To understand our diverse user base, we developed two personas: Liam, an 18-year-old freshman, and Chetana, a 25-year-old returning student. They highlight key challenges:

  • New students struggle to navigate the homepage effectively
  • Returning students have trouble quickly locating frequently used functions
  • Both groups find searching for individual courses cumbersome and time-consuming
Persona for freshman Persona for current students

User Flow Diagram

Based on the findings from our research, we redesigned the user flow, streamlining the process by removing unnecessary steps. This comprehensive redesign aims to make the process more efficient and thus enhance the overall user experience and satisfaction.

User Flow Diagram

Design &Prototype

After completing the flow diagram, we developed a clickable mid fidelity prototype with Figma for the usability test.

Mid-Fidelity Prototype

We drafted the test plan in advance to ensure that all necessary tasks were included for testing.

Usability Test Plan

We interviewed 5 classmates and observed their behavior while navigating the website. Overall, our peers were satisfied with the main registration flow, finding it user-friendly and more efficient compared to the current website. We made some minor changes based on their feedback to make it more visually appealing.

Style Guide

Style Guide

Responsive Design

Responsive design for Humber College Dashboard

Final Product

The course registration process is streamlined with features like easily accessible registration, default course search, and a horizontal split screen for improved navigation and efficiency. Click the prototype below to try it out 👇

SOLUTION #1

Easily Accessible Registration

The dashboard layout, with a streamlined navigation menu, allows students to easily access key functions such as course registration, while also integrating vital information based on user feedback.

Figma prototype for registration dashboard
solution #2

Default Course Search

A default course search feature has been implemented, encompassing all mandatory courses. This saves valuable time and simplifies the process of locating required courses without navigating through multiple tabs.

Figma prototype for course search page
solution #3

Horizontal Split View

Introducing a horizontal split view enables students to effortlessly view both course results and timetables on a single page, enhancing usability.

Figma prototype for search result page with timetable