Problem
"HMW make it easier for students to efficiently find courses they need and seamlessly add it to schedule for registration?"
The existing course planning website, CDCS, hasn't been updated for 14 year. The UI is outdated and the information presentation is text-heavy.
PROCESS
Creating a website End-to-End
PHASE 1
The Prep (Discover)
Research
Conducted interviews and contextual inquiries with 15 students to understand user pain points using current tools.
We began by recruiting 15 students from diverse academic backgrounds and years to ensure varied perspectives.
User insights from both methods were consolidated into sticky notes and organized collaboratively in a Figjam affinity diagram. This approach helped identify patterns and connections, facilitating the discovery of more general problems and guiding the design process effectively, following a bottom-up approach.
🗣️
Interviews
What we want to get:
directly inquire to gather users' needs
users' explicit opinions about the current tools
How we did it:
Open-ended questions
e.g. "What tools do you use? How do you feel while using it?"
👁️
Contextual inquiries
What we want to get:
how users interacted with the existing tools
users' implicit needs and pain points
How we did it:
Tasks related to our desired info
e.g. Search for a specific course, find the prerequisite of a course
PHASE 2
The Simmer (Ideate)
Problem #1
Complex navigation
User insight
Users encountered navigation challenges on Workday for course searching and scheduling. Multiple students expressed this difficulty.
Josh
Junior student
It’s so annoying to create schedules...
I have to jump back and forth between all these pages, and it takes me years to find the right lab session that can fit into my schedule.
Through the user insight, we found out the current navigation on Workday is overly complex, requires 10+ steps to add a single class to a schedule.
Current user flow for adding a single class to a schedule
Problem #2
Unorganized information presentation
User insight
Users struggled in certain tasks related to finding certain information, about half of the users found it hard or unable to find the prerequisite of a course.
Nancy
Freshman student
What's the relationship between these two sections?
How do I know if there's any sub-courses required for a course?
The CDCS user interface has remained unchanged for 14 years, resulting in a dense and unclear information presentation. During the user research phase, about half of the users found it hard or unable to find the prerequisite of a course. The lack of visual hierarchy makes scanning difficult, As a result, finding necessary information becomes a challenge.
Converge
"How Might We streamline the course search-to-schedule process and enhance visual hierarchy for clearer course requirement searching?"
PHASE 3
The Seasoning (Design)
Contraints
A working prototype in 1 month? We were ambitious.
🔥
Time Constraint
Since our student club was relatively new and lacked experience in managing project timelines, we were tasked with delivering a mid-fidelity prototype in one month.
✂️
Technical Challenge
As our engineering team consisted of mainly undergrad students, we faced limitations in implementing complex features we brainstormed, such as AI-powered course recommendations.
My solution
↓
Prioritized features with product manager and maximized efficiency by assigning tasks to team member based on their skill set
Communicate with developers and led workshops to to gather feedbacks on feature, ensuring integration of design and engineering efforts
ideation
Brainstormed features based on the problem, and grouped them into information architecture (IA)
Based on the problems, we started by information architecture, allowing engineers to estimate the amount of work.
Prototyping
Visualized solutions into low-fi prototypes, collected in-team feedback, and updated them into high-fi prototype
For the next step, we prototyped over 100 screens to visualize each solution. At the same time, we created user flows for each scenarios to guide our design.
Iteration
Added a feature to increase the ease of scanning based on user feedbacks
After the website is launch, we continued to collect feedback from user. Based on one of the main concern, we made each subcourses section expandable, making it easier for scanning.
There’s 10+ subcourses for some lectures
Redesigned course card with toggles
PHASE 4
The Taste Test (Testing)
Design Solutions
We collaborated closely with engineers to ensure the implementation of the prototype design. Subsequently, we conducted user testing, gathered valuable feedback, and iterated on our design to enhance user experience.
solution #1
Streamlined Userflow from course searching to scheduling
By redesigning the user flow, we integrated course searching and scheduling, cutting redundant steps to significantly save users time and boost overall efficiency.
Before
After
solution #2
Course card redesign
Revamping the course card design involved a clearer visual hierarchy that significantly enhances the ease of scanning. This thoughtful approach empowers users to retrieve information more efficiently
Before
After
PHASE 5
The Serving (Handoff)
Impact
Launched in November 2023, revolutionizing course planning for 10,000 University of Rochester students.
By revamping the existing website into Melcourses.com, we offered students a streamlined and innovative course planning experience, simplifying course searching and scheduling while improving the visual layout for clearer course requirements
Our redesigned website, Melcourses.com
Next Steps
Our next move is focused on refining the platform through ongoing user feedback. More specifically, after communicated with PM, here are the things we are planning for.
New features
Based on user feedback, we identified desired features like personalized course suggestions and a customizable four-year plan that weren't implemented for the launch. To address user needs and enhance functionality, I'll be incorporating these features as our next goal of design.
Iterative Refinement
For the currently live features, ongoing refinement will be driven by continuous user feedback, ensuring a responsive and user-centric design.
Lessons Learned
Involve developers in the loop
A key lesson learned was the early involvement of developers in the design process. To address this, we ensured weekly check-ins with the developers. This not only streamlined development but also led to a more cohesive and successful final product.