CHALLENGE

To redesign a government agency website

My Role:UX Researcher & UX/UI Designer

Research Collaborators:2

Tools:Miro, Invision, Adobe XD, Zoom

Timeline:4 Weeks

Deliverables: Proto-persona, Defined User Path, Usability tests of current site, Heuristic evaluation and annotations, InVision mood board and assets, Usability website navigation tests, Card sorting of navigation links, A new sitemap , Revised navigation, Clickable lo-fidelity prototype (InVision), Five-second user testing , UI style tile, Hi-fidelity clickable prototypes for desktop and mobile applications (Adobe XD), Google Slide Presentation

...

RESEARCH

Proto-Persona Lisa Carter visits the DOI website to find information on volunteer opportunities in line with her interests. Her goal is to educate people on the environment and she feels volunteering with the DOI will help her accomplish this.

UI Analysis

5 usability tests

Objective

to determine the usability and any pain points associated with current DOI website

Usability Test Tasks

1. Navigate to page on environmental volunteer information

2. Navigate to homepage

3. Execute a career search for a Park Ranger Role

4. Find DOI contact information

5. Find an article on climate crisis

... ...

Redlined User Test Notes

Redlining and Accessability Analysis

...

Color Accessibility

THE PROBLEM

Based on user research the current government website for the Department of Interior is difficult for users to navigate.

The Solution: To reorganize and rename navigation bar links while updating overall aesthetic of site.

...

Card Sorting for Revised Navigation

USABILITY TESTING

Product Under Test

The redesigned navigation for the DOI is being tested for usability.

Business Case

The revised navigation is being tested to determine if the usability has improved with the new design. The benefit of testing is to confirm whether or not the redesign achieves this.

Participants

7 users were recruited between the ages of 23-34. All subjects had very limited knowledge of the DOI.

Equipment

  • Smartphones
  • Laptops
  • Zoom
  • Screen Recorder

User Tasks

  1. Where would you look for information to volunteer? 90% Success Rate
  2. How would you go about finding information about the clean energy future initiative? 60% Success Rate
  3. How would you go about finding media contacts for the DOI? 90% Success Rate
  4. Where would you look to subscribe to DOI email newsletter? 67% Success Rate
...

PROTOTYPE REVISIONS

A. Mobile :

User felt sub navigation looked like a paragraph vs separate navigation tabs. Revised by increasing space between tabs.

B. Desktop :

“Our Mission” Led to some confusion. User expected it to just be a mission statement or singular item. Revised tab to “Missions”.

A.

...

B.

...

C. Mobile :

User felt there was too much scrolling to reach the bottom of site/footer. Revised “In the News” section to be expandable via a dropdown.

C.

...

CONCLUSION

Redesigning a government agency website was a great opportunity to focus on navigation for a site with a lot of content. It was interesting to see how different tab names could ultimately add or decrease clicks when users were navigating. This exercise helped to shine a light on the value of user testing and gave me confidence in the iterations that followed. Given more time and resources I would have loved to expand my redesign to more pages of the DOI site.

Final Clickable Prototypes:

Desktop

Mobile

...