My Role
Partial discovery • UX research • Sketching + Wireframing • Visual design • Clickable prototypes
The Problem
Our navigation is getting too crowded and not organized in any way that makes sense. This creates confusion and lots of clicks to get to the right place.
The Solution
Create an organized navigation that enhances our internal linking strategy, user experience, and use of prime real estate on the site.
My UX Design Process
Discovery + Research
Before I was a part of this project, discovery and research was done by my product manager. Early stats we got were as followed:
60% of prospective users on Bluehost have a navigation impression
52% of prospective users on Bluehost click on the navigation
Those users who use the navigation convert at 1.03% vs. those who do not use the navigation convert at .99%.
They also used an outside source called Brain Labs. They surveyed our current navigation (see image below), did a competitor analysis, and gave us the following recommendations:
Expand drop down navigation
Add additional links within navigation
Update top nav menu items
Include an accessible domain search for the user
Implement consistent navigation across site
Update drop down menu functionality
While they did a competitor analysis, they only compared four web navigations, only two of those navigations were direct competitors. I researched more websites, compared their functionality, header and footer, as well as responsive sizes. I also received data from my project manager on the percentage of clicks our header and footer had gotten from our users.
Ideate
After doing my competitor analysis, I started sketching some rough ideas (see below). Naming the top navigation links are tricky. Both my UX content writer, Genevieve Mount and I had a challenging time trying to figure it out. I know how I wanted it organized, but naming groups of links was tough. We’re still unsure, this is where user testing could help us solve that problem.
Here’s a quick bird’s eye view of wireframes I’ve done for the header & footer navigation:
PrototypeS
I came up with two ideas that I want to test with users: “Simplified Navigation”, which consolidates the links we had, but organized better; and “User Journey” where we use action words based on the stage they are in their web building. View prototype to see all of the drop down links.
Next Steps
I’m still in the middle of this project. Testing these two ideas is the next thing I plan on doing. I want to know which one makes more sense to the user.
POSSIBLE METRICS
Unfortunately, I left the company before I was able to test the two ideas with a set of users. Since I wasn’t able to implement either of my designs and gather metrics, here are some potential metrics I could have measured to evaluate the effectiveness of the redesigned navigation:
Task Success Rate: Measure the percentage of users who successfully complete tasks related to navigation (e.g., finding specific pages, products, or information) before and after the redesign.
Time on Task: Measure the average time it takes for users to complete navigation-related tasks before and after the redesign. A decrease in time may indicate improved efficiency.
Navigation Click-Through Rate (CTR): Track the percentage of users who click on navigation elements before and after the redesign. An increase in CTR may indicate improved usability.
Bounce Rate: Measure the percentage of users who leave the site immediately after landing on a page. A decrease in bounce rate may indicate that users are finding what they need more easily.
Conversion Rate: Track the percentage of users who complete desired actions (e.g., signing up for a service, making a purchase) before and after the redesign. An increase in conversion rate may indicate that the redesigned navigation is more effective at guiding users toward desired actions.
Engagement Metrics: Monitor metrics such as page views, time spent on site, and interaction with key pages or features before and after the redesign. An increase in engagement may indicate that users are more engaged with the site's content as a result of the improved navigation.
Feedback and Surveys: Collect qualitative feedback from users through surveys, interviews, or usability testing to gather insights into their perceptions of the new navigation and any areas for improvement.
Heatmaps and Click Tracking: Use tools like heatmaps and click tracking to visually analyze user behavior on the navigation elements. Identify areas of high and low engagement to optimize the design further.
User Satisfaction Scores: Collect user satisfaction scores through post-interaction surveys or Net Promoter Score (NPS) to gauge overall satisfaction with the navigation experience.
Error Rate: Measure the frequency of navigation-related errors (e.g., users clicking on broken links or getting lost in the navigation) before and after the redesign. A decrease in error rate may indicate improved usability and clarity.
By tracking these metrics, I would have been able to assess the impact of the redesigned navigation based on user experience, engagement, and ultimately, the success of the website.