HEAR.COM WEBSITE 2.0

hear.com_website_with_mockup

Hear.com received millions of visitors from organic search or ads but over half of these users did not finish what they were supposed to do. The site navigation was confusing. During our user testing, users said that they completed the questionnaire without finding what they wanted. 

Worked closely with the VP of Product, the VP of Marketing and the SEO manager to develop a new website for Hear.com. The goal was to create the impression that hearing aids are not just for the elderly. I wanted to design a sleek, modern website with themes of trust, services and personal care. I designed a site on which finding information is easy due to a clear, simplified layout and top menu.

User_profile

Preparation and brainstorming

Before the meeting, I have pulled data from Google Analytics and feedbacks from customers. We showed the collected information during the meeting and used a whiteboard to write down all the ideas and what we would like to achieve. We came up a project timeline, a rough flowchart, define key stakeholder and top 10 ideas that we would like to happen at this project.

Mood-board

Setting up the tone, look and feel of the website. Since we are selling medical devices, blue color is the best color to represent medical related industries. I also want to show the clean and sleek style on how I will design the page. I also want to add icon graphic so it adds extra visual information with text.

moodboard

Flowchart

This is the improved site navigation. Based on the existing page data and user testing, customers had difficulty time finding what they need. This flow reduced the amount of time the customer requires to find the right hearing aid and hearing health related questions.

Site map

Wireframe

I always design the wireframe before visual elements so that I can more easily make changes. The design is simple and straightforward.

wireframe

Style Guide & Visual Design

Up to 85% of leading healthcare companies use blue as their branding color.

Hearing aids are medical devices and Hear.com is part of healthcare industry. Therefore, I designed a style guide with clear typography and a healthcare-oriented color palette.

Styleguide

The home page is the most important page because millions of customers arrives here first from the searching engine. I want to create a strong statement by showing the slogan and the top hearing aid image above the fold. This is followed by the 3 USPs, which show what Hear.com offers. I also want to show the easy step by step process buying process. The design is clean, sleek and modern.

hear.com_1
hear.com_2
  • website_with_phone
  • iMac-27-Silver2
  • iMac-27-Silver3
  • iMac-27-Silver