Berkeleytime Scheduler has shipped! View the live version here↗.

Reducing friction during the course enrollment process for 26,000+ UC Berkeley students.

OVERVIEW

As a product designer at Berkeleytime, I worked in a cross-functional team to pitch, design, and ship Berkeleytime Scheduler. I also validated feature functionality and design system expansions with the front-end engineering team. Features I focused on primarily were editing schedule drafts, as well as course addition user flow.

Team

5 Designers
9 Engineers
1 Lead Product Manager

Process

Internal UX Audit, Cross-Functional Pitch, High-Fidelity Prototyping, Usability Testing, Iteration

Duration

9 months

My Role

Product Designer

IMPACT

I shipped the first live version of Berkeleytime Scheduler to be used by 26,000+ students.

User testers for the second iteration of Berkeleytime Scheduler said that overall, they preferred Scheduler’s user flow over CalCentral’s.

BACKGROUND

Berkeleytime is a course info platform that students use when planning next semester’s schedule.

It allows students to look up courses from previous semesters, view current enrollment trends, and examine past grade distributions.

PROBLEM

CalCentral, Berkeley’s official scheduler, is difficult to use due to its convoluted information architecture and navigation.

79%

of students use CalCentral as their main semester schedule planning tool

93%

of Cal students found CalCentral frustrating to use (scored 5 or below on a 10-point scale, with 1 being extremely inconvenient)

2.1

was the average score for convenience students gave to CalCentral

OPPORTUNITY

How might we utilize Berkeleytime’s database to reduce friction in students’ course scheduling experiences?

APPROACH

Addressed pain points gathered from user research and internal audit to minimize the amount of work required to plan schedules.

We carried out an internal audit of the first iteration of Berkeleytime Scheduler to identify areas for improvement. Designers split off into smaller teams to work on certain features in pairs, then reconvened at the end of each session to check-in and plan next steps.

I prototyped all iterations in high-fidelity, to adhere to the existing design system. We also met regularly with engineers to clarify and guide them through design updates and facilitate handoff.

SOLUTION

Berkeleytime Scheduler allows students to view information and make schedule modifications all within a single page, reducing the cognitive load when enrolling in classes.

Classes can get added to schedule immediately after view.

View and pick from all possible sections for a class, using either the dropdown class lists on the left or the calendar blocks on the right.

Hovering over a specific discussion timeslot will change it from semi-opaque to fully opaque.

For courses with multiple class sections scheduled simultaneously, a dropdown arrow enables picking from different class locations.

Saving classes will bookmark interesting courses for the future.

Bookmark potential classes to quickly refer to them later.

Students can later view saved classes in their Berkeleytime profile, and then add these classes to schedule drafts.

Immediately modify schedule drafts all within a single page.

Schedule overlapping classes, temporarily or permanently, without irritating error messages.

To delete a timeslot, click on the calendar block to access the delete option, or unselect it in the list view.

USER PAIN POINTS

User research and an internal UX audit revealed that scheduling classes on CalCentral is a convoluted process.

Class shopping cart is text-heavy without additional visual aids.

Students need to keep track of enrolled courses AND possible schedule combinations AND classes in the Shopping Cart. At this stage, students are still “shopping around” for different courses, but EVERY class in the Shopping Cart is selected by default.

Must keep track of multiple pages to compare different timetables.

Schedules are displayed on a separate page from class selection, requiring constant toggling between the two pages. Multiple possible schedules are generated, but they are not easily distinguishable from one another.

Course conflicts are difficult to resolve.

If students have to rearrange their schedules, it’s difficult for them to identify the classes that are conflicting. Occasionally, overlapping classes are sometimes allowed. However, Calcentral won’t let the default error be overridden.

FROM SCHEDULER 1.0 TO SCHEDULER 2.0

Addressed key pain points gathered from user research and audit of CalCentral and Scheduler 1.0 to build the second iteration of Scheduler.

Grouped all required sections for a class and changed radio selection to checkboxes for convenient editing.

Previously a lecture section and a discussion section might be shown separately on the left-hand side, even if they were both required for a given course. We grouped them together so users would know to enroll in all required sections for a class, which could include a lecture, discussion, and lab section.

Additionally, once classes were selected, they could not be deselected again. Checkboxes enabled for a much more convenient schedule editing process.

Made it possible to add and delete courses within a schedule draft, without creating a new schedule.

Previously, students had to start from scratch if they wished to delete courses entirely from schedule draft pages, which made the process almost as frustrating as CalCentral’s.

USER TESTING AND SCHEDULER 3.0

We conducted user testing with 4 participants, then made the following updates to Scheduler 3.0:

Stacked lecture cards were confusing, so we displayed them in a single column layout.

They got especially messy when a class offered multiple lecture times because the stack became harder to sort through. Viewing lectures and associated discussions in a simple expandable list format made it easier for students to parse through and toggle information.

The raised class conflict error was obtrusive; a simple colored highlight was enough to draw attention to overlapping classes.

Students found the popup on the calendar view to be especially annoying when it obscured other classes. Highlighting overlapping classes in blue still made schedule conflicts visible, and also felt less intrusive for students who deliberately scheduled overlapping courses.

REFLECTIONS AND TAKEAWAYS

I learned how to articulate my design decisions to my teammates, especially to non-designers.

As a designer, I knew all the new changes to wireframes and features like the back of my hand—so it was easy to forget that the engineers weren’t going to start on the same page as me. Patiently answering their questions and walking them step-by-step through user flows helped the engineers co-design Scheduler, kept me up-to-date with what would be feasible, and helped me re-examine and polish past design decisions.

I realized that I didn’t need to always follow design processes I was taught during class.

I’d taken a lot of design classes, so I was familiar with the standard design cycle processes. However, I sometimes deviated from what I had been taught as I took on this project. In time, I began to realize that real-life design projects are messy and non-linear, and that critical reasoning conquers formula when it comes to solving real-life problems.