The Heard

Designing for focus groups

Illustration of laptop screen with the home page of The Heard's website

Building user trust

The Heard is a site that recruits participants from all walks of life and from all over the country to take part in surveys, demographic research, and focus groups. They asked us to build them a website that better reflected their brand and helped their broad range of users engage and participate in a more frequent and meaningful way. Through our process of creating user personas, user stories, user-focused wireframing, and design we built a site that’s calming, intuitive, and puts the user in control.

Three images in circles overlapping a larger circle with The Heard's logo in the center

Hearing the user

When we analyzed the user information we found a broad variety of motivations, but we did notice a few commonalities that almost everyone needed; simple navigation, clear calls to action, an easy way to find and register for studies and focus groups, and simple account setup and payments. We also found that most people were visiting the mobile version of the site to find studies, but switching to desktop for account features and registration. So we needed to build a site that functioned quickly and intuitively on mobile and desktop screens.

Illustration of a mobile device with The Heard website's testimonial carousel on screen Illustration of a mobile device with The Heard website's home page on screen Illustration of a mobile device with The Heard website's upcoming studies on screen

User Delight

We thought given the nature of the business that we should design a site that looked and functioned like a simple online learning platform. The result is a very minimal design that breaks large amounts of information into digestible sections that keep the user engaged and scrolling. This design helps the user feel at ease while they are on the site, while the almost academic nature of the design builds confidence in the legitimacy of The Heard.

Typefaces & Colors

Poppins Bold used for Headings, Titles, Labels
Poppins Regular used for body text

#846785

#dcd8dc

#e6e0e7

#272933

#bdbf37

#f2f2dc