I facilitated redesigning the MS Information website to enhance the user experience for students and staff. The new design includes more straightforward navigation and improves the overall efficiency of accessing and reading information on the site.
Role: UX Designer, UX Researcher
Team: 4 UX Researchers and Designers
Duration: 9 months (October 2021 - July 2022)
Background
University of Wisconsin-Madison MS Information website is a newly founded program in 2021. As students pursuing the degree, we all experienced many frustrations, from browsing the information to applying. It increases their frustrations and leads to users leaving the website immediately, decreasing the number of new applicants and students. Unfortunately, it violates the Information school’s goal.
Problem
100% of interviewees shared the MS Information website is hard to navigate and find wanted information. The page needs to be better organized.
User& Goal
Primary users are potential students interested in pursuing the program, current program students, and faculty members. Their goal is to browse and find information effortlessly and quickly locate the support if needed.
Solution: Final Design
1. Implement the side navigation
Previous versions of MS Information did not have a navigation bar, causing it difficult for users to navigate pages. Users need to scroll up and down and use the external link on each text to find information. According to an interview, 100% of users mentioned it is hard to find information. Creating the side navigation helps users quickly locate information and increase the website's consistency. Creating the side navigation helps users quickly inform where information is in which category and helps them efficiently find the expected data.
2. Remove the heading, section, and confusion and provide a clear hierarchy
According to users' feedback, the current website information architecture needs to differentiate the text information more. The current website only has one paragraph describing the concentration of the program. A new section with a distinguished heading (Concentrations) lets users easily browse the two concentration areas and immediately know the difference
3. Offer the explicit contact information
Users are required to scroll down to the bottom to find contact information. Only one paragraph describes how to contact the program manager. Users shared, “it is hard to find contact information.” Easy access to contact information can reduce users’ irritation if they need help. The new redesign website has an individual contact section in the navigation bar. Users don’t need to spend more time finding the right person and cause frustration anymore
Impact
After delivering our proposed redesign, the M.S. Information department is glad to have this new design with more apparent information architecture and functionality. Therefore, the proposed redesign successfully implement to the current website to reduce users’ frustration in locating information.
Design Process
Planning
As we kicked off the redesign process, we started by selecting the research method. We decided to conduct a competitive analysis of other schools' websites, including the University of Michigan, Texas-Austin, and Washington, to learn more about their information architecture. It gives us ideas on how to categorize sections and information in a user-friendly way. Secondly, we planned to interview current and incoming students(our major stakeholders) to reveal their perspectives on the existing website and follow up with how they wish to improve it.
Research
Competitive Analysis:
We looked at not only other Universities' websites but also other departments' (Computer Science and Business Analytics) of our university. Because of the limitation of WordPress, we looked at other departments' websites and hoped to get some ideas on the framework.
We found that most schools’ websites used double layers on the navigation. The global navigation is on the top, and the local navigation is on the side. We also noticed that the level of heading is distinguishable.
Interview: We conducted a total of 9 current and incoming students and the program advisor. We uncover what they like and dislike about the existing website. Also, what changes do they want to make to improve it? Below are some synthesized key findings.
- Messy information architecture: Cause trouble for students while browning the website and find the wanting information
- Confused course information: Hard to understand which courses have and can take in the program
- Baffled contact information: Users click back and forth and find no who they should contact to get more information about the program
Ideation
Journey mapping helps us to build the user experience path while students visit the MS Information website and see how we make the changes to improve the website through these low user feelings. We then start the low-fidelity design on the whiteboard to sketch out the idea
Design
We implemented our ideas on the whiteboard first. It allows us to review and make changes quickly if we want to. Then transform it into a high-fidelity prototype
Key learning
Teamwork increased efficiency
It was my first time collaborating with other designers, and I found it highly efficient. It was challenging to think of many solution ideas in my previous ePRINTit project because different people have a higher chance of varying viewpoints. For example, every team member shared various aspects and thoughts during the brainstorming. We could find solutions from a wider to narrow view on what changes can be made on the MS Information website to reduce user frustration. Having team members increases the possibility of more perspective and the efficiency of the project's progress.
Feedback spawned iteration
During the middle of the project, we presented the work to local UX professionals to get some feedback and opinion. It is a monthly meetup event hosted by UX professionals if anyone wants to share their work. After the presentation, we gathered a lot of helpful feedback, and one of them was to place the apply button on the home page because most people come to the website, and the goal is to apply for the program. Therefore, we have added an ‘apply now’ link prominently on the homepage to increase the conversion rate.
