Whitepages.com

A free ad-supported site helping users look up contact information from public records, with over 2 billion annual unique visitors.

Problem

Whitepages.com was clogged with an array of confusing search bars, offputting display ads, and dated and indistinct visual hierarcy. The site didn’t feel trustworthy, and it was difficult to use.

Outcome

Over time, the team made major improvements to

  • Full redesign of the Whitepages.com experience.

  • Integrated a major rebrand, modernizing our look.

  • Reduced the presence of ‘ugly’ display ads while improving revenue.

My Role

Interaction Designer, responsible for UX, UI, branding, and illustration. Over the years I collaborated on this improvements with:

  • A small team of designers

  • Various engineers

  • Project managers

Problem

Overloaded UI, ugly ads

When I arrived in late 2011, the Whitepages.com experience was feeling confusing and dated:

  • The home page had a wall of different search fields for different types of searches, overwhelming the user.

  • General content hierarchy was flat, and look and feel were out of date. It was hard to decide what to do, and it didn’t look that appealing to try.

  • The site was full of distracting clickbait display ads, sometimes with gross imagery (‘miracle foods’ that looked like lengths of intestine, you know the kind of ad). This made our site look cheap and untrustworthy.

An example of the home page before I arrived, circa 2011

Design had a wishlist that we were able address over the course of multiple projects:

  • Reduce or eliminate ‘clickbait’ display ads, and reduce total display ads per page.

  • Simplify our navigation and search interface.

  • Bring the look and feel up to modern standards.

  • Improve overall content hierarchy on the site.

Over the course of a few years, the small design team collaborated with business and engineering to overcome a variety of hurdles:

  • We didn’t have any user testing infrastructure at Whitepages: we almost entirely relied on usage data to make decisions. The design team created our own user testing workflow, including recruiting user test subjects from Craigslist and interviewing them personally.

  • Revenue was very sensitive to changes that impacted our display ads. We had to work through incremental changes to the UI to avoid disrupting revenue. Over time we were able to replace and improve revenue with less distasteful ads.

  • Merging all our search bars was a tougher task than expected; our system required specific structured data to perform economical searches. Working with engineering we eventually created a tabbed search bar experience that reduced clutter without sacrificing discoverability.

Iterations

Early iterations in 2012 Focused on trying to merge search bars somewhat, creating a more pronounced type hierarchy, and reducing ‘3d button’ effects that had become dated. (Ads are hidden in this screenshot)

  • We had some small wins, like merging first and last name inputs into a single search field.

  • These were small changes, but we had to move slowly to not disrupt ad revenue.

  • I don’t have screenshots from this far back, but we were also redesigning a variety of search results pages, person and business details pages, etc.

  • I also spearheaded the design side of a fully responsive conversion of our site. We no longer needed to maintain a separate m-dot website, drastically improving the development process for our mobile offering.

Home around 2012.

In the coming years we contracted with an agency to conduct a rebranding, which gave us access to a new logo, color palette, and more.

  • This version included some of our early efforts to implement a ‘single search bar’. Our tabbed search bar let us focus on the dominant use case of people search, improving conversions.

  • Extensive refresh of our look and feel, with bold colors and consistent typography. This drastically improved the overall sense of quality trustworthiness presented by our app.

  • Our revenue improvements allowed us to remove most ads from ‘above the fold’, further centering our brand.

Post-rebrand home view

The previous generation of designs had solved many of our old problems, but we continued to make tweaks based on usage data and user interviews.

  • We improved search conversions by centering the search bar.

  • Further reduced overall visual noise, generation over generation.

Home around 2015.

Final designs

This is the state of affairs on the site around the time I left Whitepages for a new role.

  • The site had made major UI advancements under the watch of our design lead, Matthew Matanovic. Users had an easier time finding the information they were looking for.

  • Display ads were now scarce as other revenue streams and more effective placement of remaining ads made up the difference, improving user confidence in a less ‘scammy’ looking site.

Home page

Search results

Person details

Business details

Results and learnings

I’m proud of the improvements we made to the site over the years.

  • Multiple full redesigns of the Whitepages.com experience over the course of five years, each one further improving user and business outcomes.

  • Integrated a major rebrand, modernizing our look.

  • Reduced the presence of ‘ugly’ display ads without impacting revenue, improving the appeal and trustworthiness of the site.

More projects

Whitepages

Likewise