Navigation

nav-hero.png

project overview

Google analytics showed that there were a lot of unused areas of the site that may have been due to the site navigation.

The goal of this project was to fix the current left-hand nav that took up a lot of site real estate and had discoverability issues.

My role in this project was user research, interaction and visual design.

I worked on this as a pet project on the side.

Stakeholders included product, UX, research, and business.


Current navigation

Current navigation


3-nav-research.png

user research

Started out the project by identifying problem areas in the current navigation through a tree jack study. Below shows the tool time users spent looking for areas in the nav and how often they didn’t find them.


IA.jpg

information architecture

This was the current version of the navigation.


card-sort.png

card sort

Ran a card sort to see how users would like to bucket areas of the site. 


IA-concept.jpg

proposal for IA

Architected the site information based on the user research learnings.


card-sort2.png

card sort 2

Ran another card sort based on the proposed IA hypotheses.


wireframes

desktop3A.png

version A, iteration 1

Explored different variations in wireframe, including one with just text to mirror the core site. 

desktop1.png

version B, iteration 1

And one with more simple bucketing to mirror the most used functions on the site.


visual

desktop1c.png

version B, iteration 2

Iterated on this visual design based on internal guerilla testing and feedback.


3-nav-testing.png

tree jack test 2

Performed a tree jack test and this IA worked better than the current one, with more task-basked success and less tool time for users navigating to different ares of the site.


Next steps

  • Worked this into product roadmap and engineering pipeline to improve nav with the responsive project.