At the beginning of making this project, I had absolutely no idea what User Experience Design even was. I knew nothing about design thinking, about user empathy, I didn’t even have any experience related to graphic design. But, being a first year student who was desperate for any kind of experience that could help me land an internship over the summer, I decided to sign up for Hack Cville’s UX Design course. And so, after an entire semester working on this project on top of my 17 credits and weekend parliamentary debate tournaments, I finally created a redesign of the University of Virginia’s unofficial class search platform. While there are many flaws with Lou’s List redesign, I have worked a long time on it, and I am very proud of it.
My Design Process
User Research
First, I began my process with sending out various google forms to students at UVA, asking them about what sites they use to look up classes, what they like and dislike about those sites, and which features add the most in terms of functionality. Based off of in-person interviews and the surveys we sent out, we found the following commonalities:
Pros:
- People like the column layout of classes
- People like how up-to-date that Lou’s List’s classes are
Common Cons:
- Outdated UI
- Irrelevant info at the first page
- Relevant info is obscured
- Difficulty locating filter and non-College of Arts and Sciences-related classes
On top of these findings, we also discovered which sites people use as an alternative to Lous List, such as Coursicle and UVA SIS, which were useful for doing the competitive analysis.
User Personas
To start off, I created a provisional persona of a potential Lou’s List user based on online research and my understanding of people who I knew that used Lou’s List. This persona was created with assumptions and not fully research-based but it was something that I came back to throughout my project to guide my design decisions and priorities.
Competitor Analysis
UVA SIS
Pros:
- Information is very visible
- Course list takes up entire screen
- Big edit button
- Large, even spacing between lines and between information within the lines
- Color contrast is pleasing
Cons:
- Difficult to navigate
- Need to have multiple tabs open to get all needed information (professor rankings, course requirements)
- Class search function has too many features for most people
Coursicle
Pros:
- Search bar function makes finding class easy
- Calendar makes organizing classes easy for visually oriented users
- Each box in the calendar provides more info on the class
- Clean UI
Cons
- Cannot see all of the classes at once
- Class search is the only function, need multiple tabs open to find all needed info
- Impersonal, no one to contact if one needs help
Virginia Tech’s Class Search Website
Pros:
- Time table is organized in intuitive row pattern
- Nice layout and spacing of search criteria within the search box
- Visible search results section
Cons:
- Outdated UI
- Many buttons on one screen, hard to determine function
- Less important info on front page
Wireframe
Mockup/Prototype
Usability Testing
Positive Feedback:
- Large fonts make pages easy to read
- Overall UI visually appealing
- Calendar, Profile, Searchbars, and Block Format were liked
Negative Feedback:
- Social Media portion does not address user needs
- Should be more school/class-oriented
- Adding classes to calendar does not fully function
- UI for end of calendar cluttered, class requirements left unclear
- Not all pages of site have been designed
Conclusion
In hindsight, where we went wring in the final mockup of the website was figuring out an exact problem to fix. In spending so much time going through the motions of research, we failed to fully empathize with the users, causing us to implement functions that were not necessary. Overall, it was a fun learning experience to design this site, and I have learned a lot from my mistakes in the process. I’m proud of my final result, and I’ll be sure to learn from this project for future designs.
