Standard Catalog is a redesign of the college registration experience.
Issue #1: Providing Context
In the current system used by my university, class information is separated from the registration page. This adds friction to the registration flow if users want to see information about a class.
Students also tend to go to outside sources, such as Rate My Professors, to get a better sense of their instructor. In some cases, this data can be misleading or inaccurate; however, no better data source exists for the student.
Initial sketches indicated some of the page requirements, such as the ability to view credits, class description, and prerequisites. Also indicated is the ability to view registration information from the same page, such as time, location and instructor.
On this page, users can preview the class before they register, as well as view the completion status of prerequisites. This provides better context to the user and makes them do less work to find this information.
After registering for a class, section-specific information like location, time, and instructor are displayed on the same page as before.
Users can view more information about a professor, including a short biography, contact information links, and a consensus of other students’ feedback on the professor.
To generate overall professor consensus, a feedback form like this is presented to each user after each term. This ensures that only those who took a professor’s class can rate the professor, and reduces potential bias by limiting the amount of information collected and displayed.
Issue #2: Planning the Long Term
The current system presents too much information at once, and doesn’t clearly distinguish between different types of information. The single point size of the text, and the added spacing between related elements, makes it difficult for a student to understand important information.
There are an excessive number of sections, including similarly named ones that can cause confusion for the user. For example, the last two sections both contain requirements related to Computer Science, so how am I supposed to know which requirements are under which section?
In my design, I aimed to limit the information presented to the user, and improved the spacing so related elements are closer to each other. I also cut down on the number of sections, so the user is guaranteed to find the information they need.
In my initial sketches, graduation requirements were integrated with the class bookmarks page. I soon moved the content to its own page because of the amount of content displayed.
With my design, I improved the grouping of related information, and used visual elements like the progress bar to better visualize information. I also removed the toggling of information, so no information is hidden from the user.
Issue #3: Schedule Viewing
After class registration, there’s an opportunity for the app to become a hub of information students can refer to. The app can be used to check class times and locations, find their professor’s contact information, or look up graduation requirements.
Keeping this in mind, I designed a schedule page, to accommodate the user’s need to see class times for all of their classes.
Issue #4: Existing Technology Stack
To better accommodate existing systems, I designed the sign-in flow around a school’s single-sign-on (SSO) platform. This eliminates the need to design traditional account management flows, such as a sign-up form.
For this project, I created a custom icon set designed to match the final prototype.
All digital sketches were created using Excalidraw. The final prototype was designed using Figma, and the typeface used is Greycliff CF. All icons were designed using Figma.
Image credits, in order presented: