Langara College
Dashboard Redesign

Project Overview

In this post, I would like to introduce the student portal used at Langara College. By logging in with a student ID and password, users can access a variety of essential features, such as course registration. For students, this portal is an indispensable part of daily life, serving as a hub for course schedules and academic information. While the current system technically fulfills its role by consolidating information into one place, there is significant room for improvement in terms of usability. As you can see in the image below, the current interface leaves much to be desired.

Identifying the Problem

The current Langara College student dashboard features a left sidebar filled with small text. To me, this layout feels cold, sterile, and frankly, boring. Furthermore, because the font is so small, it is easy to misread or click the wrong link.

Langara also offers "Continuing Studies" courses, which attract students in their 50s and 60s. It isn’t hard to imagine how difficult this interface must be for those dealing with age-related vision changes (presbyopia). The goal of this project was to create a design that is easy for everyone to see and navigate.

The Design Solution

My first priority was to move away from a "mechanical" feel and toward a more sophisticated, stylish UI. However, I didn’t want to focus solely on aesthetics; I wanted to ensure that information was organized so that users could navigate intuitively.

From Text Links to Buttons

I replaced the tiny text links in the sidebar with clearly defined buttons. This makes the navigation more visual and much easier to click, ensuring a seamless experience for all users.

Intuitive Course Registration

Course registration involves a vast amount of data—searching for classes, viewing timetables, and processing tuition payments. When faced with too many text-only options, users often hesitate before deciding where to click. By pairing text with recognizable icons, I reduced the "cognitive load," allowing users to instantly identify their next step.

Visualizing Course Data

For the course information page, I utilized a table format to display the instructor, schedule, and location at a glance. I also added a mail icon next to each instructor’s name. This allows students to contact their professors directly without the hassle of looking up or memorizing email addresses—a small detail that makes a big difference for the user.

"Even if I am accustomed to using a system, it is a mistake to take it for granted in my portfolio. Just because I have grown used to it doesn't mean it’s right for everyone else."

Reflection: Empathy in Design

I had been using this dashboard casually in my daily routine. Although I initially found the text small and the design sterile and boring, I eventually got used to it—to the point where it simply felt like the norm.

However, I realized that when it comes to UX and UI, the most important thing is to design a system that is easy for everyone to use—a process that requires carefully considering the people who will actually be using it. To illustrate this with the current example: many of the international students—myself included—are in their twenties or thirties, with the oldest being in their forties. Because we become accustomed to this environment, it is easy to fall into the trap of assuming that the user base consists solely of people in those age groups.

Yet, if we look at the "Continuing Studies" courses, we see Canadians in their sixties and seventies also pursuing their studies. What we take for granted is not always the norm. This experience taught me that when creating a design, it is crucial to look beyond my own perspective and ensure the system is accessible and easy to use for everyone—including clients, customers, and end-users.