Avery Colyer · Follow
Published in · 8 min read · Nov 6, 2020
--
When it’s that time of the semester, every college student knows the feeling: the overwhelm of how many classes you need to take, how you’re going to make the schedule work, and having to switch between notoriously confusing course registration websites. This is the case at the University of Virginia, anyway.
Due to the difficult navigation of UVA’s own course registration interface, the Student Information System (SIS), most students at UVA use a course information website called Lou’s List to explore classes, plan their schedule on Coursicle, then go back to SIS to add the chosen courses to their shopping cart in order to enroll when it’s time to.
According to survey findings, the majority of UVA students love using Lou’s List over SIS, but felt it lacked many features that require them to use other sites in addition to Lou’s List. Therefore, Jane Chan, Melissa Zhu and I decided to redesign and improve Lou’s List further and make the course registration process as stress-free as possible.
Before redesigning, my team and I surveyed and interviewed various UVA students on their course registration experiences.
Survey Data
100% of respondents indicated that they use Lou’s List over SIS, and over 70% said that they wish they didn’t have to use other websites in addition to Lou’s List during course registration. In particular, students indicated that Lou’s List lacked the schedule building functionality of Coursicle, was difficult to use to search for specific classes, and was not very useful for finding course requirements.
Interview Data
Through a series of direct and indirect interviews with students, we gathered that almost all students were familiar with Lou’s List, but found the class search page overwhelming, and were uncomfortable using Lou’s List for anything but browsing various classes.
The class search page is overwhelming
The current class search page has an excess of search criteria that, according to the interviews, students rarely use with the exception of “Course Mnemonic”, “Course Number”, and “Days/Time”.
The landing page is cluttered and catered towards College of Arts & Sciences students
The first page that Lou’s List opens to is the College of Arts & Sciences department list expanded to cover the majority of the page. If a student is not in the College of Arts & Sciences at UVA, this cluttered page makes their own departments difficult to find.
The style is outdated
The Lou’s List website is stylistically outdated in its layout and color scheme, making it feel unprofessional and less trustworthy.
Before we developed our design solutions, we used methods such as user personas, journey mapping, use case analysis, competitor analysis, paper wireframing, and flow charts to ensure the final design was effective. You can read more in depth about our creative process in the full version of this article on my blog here.
Paper Wireframes
In hopes of making Lou’s List’s design more compelling, we planned to design each section of the website to resemble a Manila folder, which we hoped would make it more fun to navigate. In all sections, the goal was to achieve simplicity, cleanliness, and convenience.
Color Palette and Typography
The chosen color palette is an ode to UVA’s official colors, navy blue and orange, in order to make the site feel more related to UVA and familiar to the user. It also includes two accent colors for both design assistance, and in the case of the soft orange on the far right, to serve as a nod to the tabs resembling Manila folder tabs.
Rubik and Sarabun were chosen because they are sans-serif and have soft corners, which make them more pleasing to the eye. However, despite their rounded nature, the fonts remain professional with their resemblance to widely accepted fonts, like Arial and Calibri, which is important in an academic website like Lou’s List.
View the full design in action above, then read on for the full breakdown of each page’s design choices.
Find departments faster, even if they’re not in the College of Arts & Sciences
To preserve the familiarity of Lou’s List for students, this redesign would keep the College of Arts & Sciences department list open on the landing page, but it would preserve space on the page for the user to clearly see they can expand other schools’ department lists.
Search quicker only viewing results that fit schedule
We got rid of all the unnecessary search criteria, such as “Room Number” and “Class Description”, and kept the criteria students use the most based on our survey data. When was the last time a student searched for a class in a specific room? It happens, but rarely. This is why we moved all search criteria used infrequently into “Advanced Filters”, shown as an expandable section above. This way, the average student simply trying to find classes in their major that fit in their schedule won’t be bogged down by the extra fields.
A student can type in the department mnemonic with or without the number indicating level, depending on their needs. Also, the Coursicle-inspired “Starts After” and “Ends Before” method of searching for class times makes it easy to find courses in a certain time window, ensuring students only look at courses offered during the time they want or are able take them.
For extra convenience, we would add a feature in the future that allows students to indicate that they only want to view search results that do not conflict with their currently built schedule in Lou’s List, rather than manually entering desired times.
See program requirements in seconds
No longer would students have to switch between SIS or UVA’s website to check their requirements while enrolling. By adding easy access to these requirements separated by curriculum, students can quickly check what their school’s requirements are and in seconds find courses that fulfill them using the search tab and filtering by requirement.
In the future, we would expand this to include major requirements in addition to general education requirements, and map out a way to open a list of courses that satisfy a given requirement directly from a school’s requirement list.
Add courses to a schedule planner without switching sites
From the search results, quickly add a desired course to a built in scheduling tool, so no switching sites is required. Simply select the desired section, click add, and the course would be marked as added and show up in the student’s Lou’s List schedule. Many students find courses they want on Lou’s List, and then switch between many other sites, such as Coursicle and SIS, and attempt to locate them there in order to ensure they fit. This way, checking a course’s feasibility is only a click away.
The search results formatting was kept largely the same with respect to the order of columns with a few irrelevant items taken out in order to reduce cognitive load, but ensure a student used to Lou’s List would still find it easy to locate the information they needed in a complicated page like search results.
When clicking to open a course, Lou’s List already provides students with extra information about that course, such as requirement designations and course descriptions. To take it a step further, we would design a way to include more details, such as Rate My Professors ratings, Course Forum grade breakdowns, and more that students look for using other sites.
Make a schedule that’s practical and easily modifiable
With the ability to view courses on a schedule as soon as they are added, students can more easily figure out which days and times work for combinations of courses. The calendar would update with the total number of credits on the schedule, and allow the user to view the course number and mnemonic, exact time, and the location. The location is especially useful to view on this calendar, as it helps the student get a sense for the distance they would have to travel between classes to make sure it is desirable, and easily delete it if it’s not.
There are many horror stories from students having to somehow run 30 minutes across Grounds in a 15 minute gap, which causes stress, tardiness, and sometimes lost time for meals between classes.
Also, the student would be able to conveniently save the built schedule so that they can refer back to it, or have the ability to make a new schedule in the event that they want to create multiple scenarios depending on class seat availability at the time of enrollment. Lastly, the student can print the schedule to hang up or keep on hand.
The hope for this redesign is to present a solution to the immense stress students feel at course enrollment time by showing how design changes on one website could save students loads of time and fatigue.
Students already struggle to make sense of how they will satisfy their general education and major requirements (sometimes double majors and/or minors) in a given semester, as well as having to plan something new on the fly in the common event that courses fill up at enrollment time. This process takes a lot of time and effort when students are using several different websites for the same task, all while balancing current coursework and jobs on top of it all. It’s a tough time of the season, why not make it as easy as possible?
Thank you for reading, if you want to take a look at my other design projects, such as making Spotify accessible to the hard-of-hearing, and redesigning Hulu browsing, check out my Medium page or connect with me here. This project was completed as part of Forge’s Wireframe UX Design Course.
