Responsive Website

Case Study: Responsive website – Phase 1: navigation

Overview

The University of Washington Bothell’s mission is to provide access for the community at large to a premier institution in higher education. The www.uwb.edu is the central source of information and serves as the primary communications and marketing tool for the university. It consists of about 12,000 pages, not including attachments, and has close to 200 content editors.

Opportunities: The university website is not responsive. The navigation is confusing to students and other audiences. It has not changed in 6 years, and it’s CMS is not well known.

My Role: As a lead and senior designer, I worked on the project budget, team velocity, guided the research, solution, and design of the responsive website. It required hiring, coordinating, and collaborating with project owners, stakeholders, interviewers, and the university’s leadership.


Goals

  • Re-design the global navigation to be responsive.
  • Increase mobile views.
  • Create consistent experience across platforms for all end users regardless of accessibility requirements.
  • Cater to the main audience of the website, prospective and current students.
  • Support the university’s business goals.
  • Support the university’s mission of commitment to access for the community at large.

98% of our competitors have a mobile-friendly website

64% of American adults own a smartphone

15% depend entirely on a smartphone for internet access


Discovery

Our team conducted an extensive market research, content audit, qualitative and quantitative research by conducting user interviews, card sorting, usability tests, data analysis of the University’s data factsheets as well as Google Analytics to learn more about:

  • audiences
  • visitors behaviors
  • website engagement
  • user flows
  • keywords search
  • most visited pages

28 in-person user interviews

2 tests of static navigation

1 online test with proposed navigation

Card sorting

Personas


Findings

  • The size of the navigation eats up significant screen space when is expanded.
  • Hover navigation makes the visitor go through a funnel before they can click on the desired item.
  • The global navigation is audience-based and the users don’t always relate or know which audience they belong to.
  • Taxonomy of navigation is not clear, there are lots of duplicate labels and pathways.
  • Lack of content strategy.
  • Search is not reliable.
  • 98% of the competition have a mobile friendly website.
  • Current students don’t like navigating the website.
  • With a new navigation, visitors can find their content 76% faster.

45% of incoming first-year students are 1st generation to earn a degree

23% of our users visit the website using a mobile device


Ideation & Solutions

  • Responsive design with updated information architecture
  • Dropdown menu with click-through instead of hover. This solution provides a better user experience for visitors using any device
  • Non-audience-base navigation, but a mix of task and topics
  • New condensed global navigation taxonomy and information architecture
  • Visible search bar
  • Categories and labels focused on the primary audience instead of the university department organization.
  • Added quick links: with most used links gathered from analytics and heat maps