Year
2025
Client
Personal
Category
Education
Role
UX/UI Design
Overview
This project started when I wanted to practice my Figma skills in my free time. I noticed that all of my friends hated the fact that as students, we had to go through three or more tabs to enroll in a class. So, I decided to find and design a possible solution for this problem and create a new version of the University of Utah Degree Audit where students only need one tab to know what classes they need to take and to enroll in those classes.
Testing & Survey
For my survey, I chose to use Instagram Story Polls as the primary method of data collection. While this may seem unconventional, it allowed me to target a specific audience—my followers who are students at the University of Utah. I ensured that only data from University students was collected. This approach proved effective, as it was easy for participants to engage with, resulting in a high response rate and reliable outcomes.
I opted against using platforms like Google Forms because many individuals I know tend to avoid official surveys that require personal information, such as university IDs. By using Instagram's simple, tap-based format, I was able to gather meaningful data in a more accessible and efficient manner.
University of Utah Students participated in this survey.
of students agree that the class enrollment process should use fewer tabs.
of students indicated that they are not concerned with class offerings beyond three semesters from the current term.
of students primarily focus on the classes offered for the upcoming semester.
of students feel confused by the Degree Audit due to the cluttered presentation of information.
of students feel that the red color in the progress bar gives the impression that they are far from graduating, especially during their first year.
Example of Survey Questions
Main Design Goals
Students can track their college progress and easily enroll in classes required for graduation.
The website should consolidate all important information from the previous three pages into a single page.
The website should be visually appealing and use design aspects to reduce large blocks of text.
First Problem & Solution
Problem:
Huge amount of tab requirements:
Students typically need to juggle at least three tabs just to enroll in a class:
Degree Audit – to track academic progress and required courses
Course Information – to check class availability for the current semester
Enrollment – where they manually enter course numbers from the Course Info tab to register
Solution:
The solution is simple: just decrease the number of tabs! However, there's more to it than that. I need to find a way to include all the important information from the three tabs into one. I've decided to use Degree Audit as the main tab and collapse the other two into this one because I feel that without this tab, the student cannot proceed to any other tab.
The next step is to redesign the Degree Audit, allowing users to interact with the courses beyond just text.
Complete
When students interact with the complete class, they can view the date of course completion, academic performance, and course information.
Enrolled
When students interact with the enrolled class, they can view the course information, such as location, days & times, instructor, and more, and they can choose to drop the class.
Needed
When students interact with the Needed class, they have the option to choose before they can enroll in the course, such as choosing instructors, course type, or selecting their preferred time, which will automatically fill up the information above for them. Students can view when this course is available for them to enroll, which will show up to only three semesters.
With this new design, students can now access all the main functions of the three tabs in just one tab! The last step is to click 'Schedule Builder' at the top right of the page, students can easily finalize their schedule.
Second Problem & Solution
Problem:
Complexity of degree audit:
The degree audit interface is overly complex. Most of the complexity comes from having only a big chunk of text.
Solution:
I replaced dense text with visual elements to simplify complex information. This made the site cleaner, more engaging, and easier for students to navigate, while still communicating the same content effectively.
Before
After
Third Problem & Solution
Problem:
Psychological impact of progress bar:
Students’ progress bar displays a large amount of red (especially when they are in their first year), which makes the student feel distant from achieving their graduation goals.
Solution:
To avoid discouraging students, I removed red from the progress bar, which could make graduation feel out of reach. The new design uses two colors: one to show category progress and yellow to highlight enrolled classes, keeping the experience both informative and encouraging.
Before
Home Categories and Sub Categories looks the same
After
Home Categories
Sub Categories
Fourth Problem & Solution
Problem:
Unnecessary information:
Displaying course availability for up to 10 semesters in advance is unnecessary, as most students focus on the current or upcoming semester.
Solution:
Survey results showed that 100% of students only care about classes offered within the next three semesters, with most focusing on just the upcoming one. Based on this, I removed long-term listings and kept the display limited to the next three semesters.
Before
After
