NY-State-Insurance-Plans_Redesign_thumbnail.jpg

NY State of Health Insurance Plans Redesign

NY State of Health Insurance Plans Redesign

 
NY-State-Insurance-Plans_Redesign_For-Porfolio_1-on-screen.jpg
 

Current Design

There is an abundance of important information on this page. However, the current design is lacking in hierarchy, consistency, and usability.

Points of Focus

  • Create hierarchy with content and typefaces

  • Minimize the colors used and unify button styles

  • Improve responsiveness

NY-State-Insurance-Plans_Redesign_For-Porfolio_1.jpg
 

Ideation

I explored multiple ways to lay out the content in order to discover the best user experience. The main goal of this page is to search for plans based on the 8+ filters. In the current design, it is confusing that all of the tools are explained at the top of the page, but then one tool is below on this page and the user would have to click out to other windows to utilize the others. I divided each tool into different sections to provide clarity on the differences between them.

NY-State-Insurance-Plans_Redesign_For-Porfolio_1-2.jpg
 

Desktop

Discover Plans & Additional Tools

On the landing page, there is a clear delineation between the ‘Discover Plans’ tool and the ‘Additional Tools’. Once the user selects filters that fit their needs, they can view potential plans below. Each plan has its own card. The cards are in an isolated scrolling section, therefore the user can browse different plans without a full-page parallax scroll and still see the filters they selected. The user can click ‘View Details’ to see more information in an overlay pop-up window.

NY-State-Insurance-Plans_Redesign_For-Porfolio_1-3.jpg
NY-State-Insurance-Plans_Redesign_For-Porfolio_1-4.jpg
 

Comparing Plans

When the user selects up to three plans to compare, yellow tags will appear above the plan section to display the plans selected. Once the user selects the ‘Compare Plans’ option, an overlay will pop-up with the plan details side by side.

NY-State-Insurance-Plans_Redesign_For-Porfolio_1-5.jpg
NY-State-Insurance-Plans_Redesign_For-Porfolio_1-6.jpg
 

Mobile

Discover Plans

For mobile, it is a better user experience to divide the content into separate pages. The filters are the landing page with a hamburger menu on the top right. The menu includes access to the ‘Additional Tools’. Once the user makes their selections and clicks ‘Search’, the potential plans are displayed on the next page.

NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-08.png
NY-State-Insurance-Plans_Redesign_For-Porfolio_1-mobile-menu.jpg
NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-09.png

Potential Plans & Plan Details

Similar to the desktop layout, each plan is represented in a card. The user can click on ‘View Details’ to learn more about the plan and sign up.

NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-10.png
NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-12.png
NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-13.png

Comparing Plans

When the user selects two plans to compare, a sticky yellow bar will appear along the bottom of the screen. The user will be able to select ‘Compare Plans’ to view details of two plans side by side. Users are able to sign up here directly as well.

NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-11.png
NY State Insurance Plans_Redesign_For Porfolio_1-mobile_1-14.png
NY-State-Insurance-Plans_Redesign_For-Porfolio_1-compare-sign-up.jpg