HEAR.COM

Responsive website

Hear.com

Hear better. Live better. 

hear.com_website_with_mockup

Background

Hear.com provides free consultations and top-of-the-line hearing aids. It is one of the largest networks of hearing care professionals. The company works with 1,600 of the best audiologists and hearing specialists in the country. They use the latest technology to evaluate your hearing, recommend a tailor-made solution, and put you on the path to a better quality of life.

Task and role

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.

Who is the user?

AdobeStock_307900949

John

Casual info seeker

User goal

John is looking for information about the hearing aid or hearing loss.

Behavior

John is having a minor hearing problem but he does not necessarily want to buy a device yet. He spends a lot of time on research the symptoms and devices.

HEAR.COM

George 

Serious buyers

User goal

Geroge want to get a hearing aid to hear better and improve his life.

Behavior

George has a hearing problem that causes a major impact on his life.

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.

EDC53F0B-B02C-4D8E-90A9-190AAE6F6787_1_105_c
AA82245B-1387-493B-9E1B-9325599C2B8E_1_105_c
8D8F4948-F538-4ABF-9E9A-8FAA23077303_1_105_c

Mood-board

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

moodboard

Sitemap

Based on the existing page data and user testing, customers had difficulty finding what they needed. I have designed the flow to reduce the amount of time the customer requires to find the right hearing aid and hearing health-related questions.

Site map

Wireframe

I placed the trust element on every page because it gave users confidence in Hear.com’s services and products. Hear.com is one of the few companies that offers 45 days risk-free and money-back guarantee. A lot of customers said they did not know about these great features after they talked to the hearing consultation. 

wf

Visual design

Millions of customers arrive 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.

Home page

Desktop

Home page

Mobile

iPhone 6-7-8 - Home page

Hearing aid styles

Hearing aids style

Questionnaire

Questionnaire

Hearing health

Hearing aids health

About us

About Us