Updated desktop navigation experience
Wireframes / User Flows
The single most revisited problem when I worked at HealthSparq was the navigation. We were often adding features and 3rd party partners to our site which gave us the need to add items to the navigation without overwhelming the user. We tested and retested many different models off and on for almost the entire 2.5 years I worked there.
This work was some of the last work I did before leaving HealthSparq. The navigation needed to inform the user about the type of information that was available to them. For example, many of our users thought we were an online doctor finder tool and didn't know that we provided things like prescription information, cost estimates for procedures, treatment timelines, virtual doctors, etc.
Flow for navigation versions A & B
This model gives the user different home page content depending on the category she chooses. It helps keep the categories from getting confused and it was also helpful to be able to put targeted information about each category on the category home page. This model is similar to the model used on Apple's website.
Navigation wireframes version A
The top level of the navigation is taken directly from the healthplan website in order to make our app integrate seamlessly. The second level is the HealthSparq main navigation where the user can access their settings and account information as well as select the category they wish to browse.
Most of the information on the page changes depending on the category selected. The search bar has a secondary search category drop down depending on the category.
Navigation wireframes version B
This version is similar to the version above, but it goes a step further to explain the categories. In user testing we found this to be helpful to our users.
Flow for navigation version C
Version C uses a single home page, but allows a user to select the category she wanted to search through a large dropdown (we called this the Amazon model).
Navigation wireframes version C
