MHCI+D Graduate Program Website Redesign
Role
Solo designer & researcher
Duration
Aug 2024
(1 month)
Skills
User interviews
Wireframing
Tools
Figma
Overview
Summary
On top of my responsibilities as the program's website coordinator, I led the effort to conduct user research and mock up wireframes as preparation for a major website redesign effort beginning fall 2024.
Task
Using research insights, redesign the graduate program's website so that it reflects its values, goals, and overall industry trends.
Outcome
A comprehensive audit, site map, design system and design recommendations were passed onto the team.
My Contributions
User research
Conducted 6 interviews with incoming students, 1 design audit, and competitive analysis with similar programs' websites.
Wireframes & Design System
Designed key screens, provided updated design system and recommendations
Background
The University of Washington’s Master of Human-Computer Interaction and Design website is a major touchpoint for prospective students. According to the 2023 UW Continuum College Annual Marketing Report, from July 1st 2022 to January 31st 2023, 36,363 users visited the MHCI+D website, demonstrating its wide reach and importance.
This website's theme and style have not been updated since it was created back in 2013. As a result, many of its components are outdated and not scalable.
Current program website homepage
Research
Research questions
I wanted to interview users who recently went on the website in order to answer the following research questions:
What information do visitors look for on the program website?
How easy was it to navigate through the website to find this information?
What information was not found on the website?
What information from the website did visitors find valuable?
Did the website affect their perception of the program?
I decided to interview incoming students, as they recently used the website and could provide unbiased feedback compared to prospective or current students.
Methodology
I conducted:
6 interviews
Conducted with already admitted students to avoid bias
Competitive analysis
Examined MHCI+D’s top competitors in the United States
Content/Design audits
Assessed website from both a content and design perspective
Site map
There was also no clear documentation of how the website was originally planned. In order to view the website holistically, I first created a site map. I was curious to see the types of content and paths that currently existed.
Analysis
Upon first glance
On the homepage, I noticed a few areas of improvement:
The "Important dates" section does not help prospective students.
Inaccessible font weight and color
Carousel action isn't obvious
Inconsistent fonts and styles
Inconsistent fonts and styles
Varying sidebars
I also discovered about 14 different variations of the sidebar.
Interview analysis
From here, I analyzed and affinity mapped my interview notes, which included calculating the website's System Usability Score (SUS) score with each participant,
Affinity mapping of interview notes
The website excelled in the area of usability, receiving a score of 87.5, showing that while the style may be outdated, its navigation and content were clear and concise.
Design
Design recommendations
From here, I compiled my design recommendations into another FigJam board.
Design principles
Content scalability
Keep maintenance in mind
Standardization
Standardize sidebars and overall theme/navigation
Updated visual theme
Keep content in mind, clean and updated visual identity.
Low-fidelity wireframes
Final Design
Next steps
Evaluative testing
If I were to continue with this project, I would conduct another round of research specifically asking to see what impression this leaves users and compare it to the answers I had originally received during the generative research phase.