Yelp for Business owners

Big companies and local businesses aren’t the same. They aren’t looking at the same data, they don’t make decisions in the same way, and their expectations of a product like Yelp are radically different. While Yelp has a long history of success at putting local businesses on the map, big brands have generally looked at it with skepticism, keeping their listings up-to-date and only sometimes investing in Yelp ads. After I joined the Yelp for Business Owners Multi-location (AKA Biz Multi-loc) team in Hamburg, we made it our mission to figure out why, and make features that could win over big advertisers while providing genuine consumer value.

company

Yelp

location

Hamburg, Germany

role

Product Designer

Responsibilities

Concepting
UX & UI
Documentation

tools used

Sketch
Figma
Google Slides

EARNING TRUST

Why do businesses use Yelp? In a word: trust. Most American consumers trust the reviews they read on Yelp far more than those they read on Google or Facebook, and that trust has strong business value in terms of getting people to actually go into a business and make a purchase, whether that’s a meal, a sweater, or a new set of tires. Because of this, Yelp ads are usually more valuable than equivalents on other platforms, especially for local businesses with limited advertising budgets.

Yelp was built with local businesses in mind from the very beginning. It’s a natural evolution of something like the Yellow Pages: a place to find all the info you need on a local business, with the added value of seeing reviews and photos from other people who have been there. That’s all great for discovering the new Thai place around the corner in a city, but what happens when you’re in somewhere more rural and just want to find the closest Five Guys Burgers & Fries? Chances are you’ll see just a few locations, and they’ll probably boast ratings of 3 stars or less, along with plenty of poor-quality photos and negative reviews.

Searching for Five Guys near Fresno, CA pulls up some poor quality results.

How might we give big advertisers a canvas for their brand story without compromising the trust we have with users?

The fact is that consumers aren’t excitedly writing Yelp reviews of their local Five Guys or McDonald’s when the burger is good. Chains are known quantities; customers know exactly what they’re getting, and that’s much of the reason for their success. We observed that consumers often used Yelp listings for big brands as sounding boards for negative experiences that deviated from their expectations of a known brand, and without positive reviews to balance the negative ones, ratings for big brands tended to skew below average. Understandably, spending money for ads on a platform that seems biased towards local businesses wasn’t very appealing to big brands, even if people are more likely to go to a physical location and buy something coming from a Yelp ad than a Facebook ad.

In addition to poor reviews and low quality photo content, big advertisers were struggling to find a place for their evolving brands in their Yelp listings. Brands stay relevant to customers through promotions, new products, and limited time offers like the McRib or the Pumpkin Spice Latte. Consumers could see what’s new and what’s coming from brands on Google, Facebook, Instagram, and Twitter, but on Yelp? Not so much. Advertisers could customize some photos, but their overall ability to communicate an evolving brand story was very limited.

So the ‘how might we’ statement was this: How might we give big advertisers a canvas for their brand story without compromising the trust we already have with our consumer users?

Balancing Act

Designing ads is tricky. It’s a process of treading the thin line that separates noticeable from annoying. As a product designer, my pursuit above all else is to design experiences that are good for the end user, and bad ads can very easily sour someone’s experience of an otherwise great product.

By requirement, I had to design a lot of bad ads before I made anything that resembled a good ad.

A sampling of ad designs that didn’t make the final cut.

Most of my bad ads were trying to do too much. Too much text, too big, too loud, too different. The approaches that my team and I agreed were close to the mark all had a few things in common:

A concise Search page ad unit that maintains as much of Yelp's organic result structure as possible.

On secondary pages, a prominent image plus a few short lines of text adding context to the promotion.

A carousel format that flexibly accommodates as many promotions as an advertiser wants to feature.

1 Promotion

2+ Promotions

A detail page where text and image can shine with no space restrictions.

With these principles as a guide, I refined our approach into the product we would eventually call Showcase Ads. From initial concept to full release on iOS, Showcase Ads took about one and a half months of design time, plus about two months of development with design support.

1 promotion

2+ promotions

showcase details

Shortly after I finalized the iOS designs, Cyriac Jannel took charge of transferring the full experience to Android, desktop web, and mobile web.

business details

More recently, we’ve been looking at innovative ways to frame Showcase content across the Yelp product. Showcases have a lot in common with Yelp Connect, a product for local businesses to post updates directly to their followers on Yelp. With the Showcase Ads carousel as a starting point, we looked into an integrated format on Yelp’s Home page combining Showcase and Connect posts into one unit. The appeal here is that there’s one easy place to see all of the promotions from businesses near you, whether they’re big or small.

combined content in carousel

Home

showcase details

get directions

A TALE OF TWO STYLEGUIDES

While I was working on Showcase Ads, Yelp’s newly founded Design Systems team was laying the groundwork for a brand new design system: the Cookbook.

Four posters from our internal Cookbook reveal event, designed by the Yelp Design Systems team.

I can’t describe how excited I was to start working with the Cookbook. In my 3+ years at Yelp, I’d been running up against the limitations of our old styleguide constantly, especially in the areas where there was little-to-no styleguide coverage. Inconsistency between platforms was a major headache, and would add days to most projects while I tracked down eccentric patterns unique to each platform.

Twice in the past I had volunteered for initiatives to clean up the styleguide and drag Yelp’s visual language into modernity, and twice those initiatives failed because of the simple fact that they were side projects, always playing second fiddle to feature work.

Finally, we’d committed to having a talented team working on design systems full time. I was trying to use the Cookbook at every opportunity, but I had to temper my excitement when it became clear that implementing the new styleguide would take considerable time and effort.

In a perfect world, someone would flip a switch and the Cookbook would go live for all pages on all platforms at the same time. We don’t live in a perfect world, though, so the reality ended up being a lot more complicated. While I might have access to the new design system for all pages in Figma, our developers were updating major pages one-by-one on all platforms, and doing so with the care and precision necessary for such a dramatic overhaul. Different pages were set to go live at different times on different platforms. Furthermore, the rollout of redesigned pages was phased and closely monitored, meaning that months could go by between when the first cohort of users on a given platform would see new pages and when it was live to 100% of devices.

I had to face reality: if we’re making anything new, we’re going to have to design it twice.

the old

the New

The hardest part of the styleguide transition process by far was managing expectations with stakeholders.

I learned that the simplest way to design in two systems is to start with the newer, more robust one, and then work backwards from there. The framework of the Cookbook allowed me to iterate quickly; in a good system, you can build almost anything from basic building blocks and it will simply work alongside everything else. It’s also much easier to design for all platforms simultaneously when they share consistent typography, colors, icons, and spacing.

In some cases (as with Showcase Ads), I had begun the design process with the older Yelp Classic™ styleguide and didn’t need to work backwards. In others, I had to dust the cobwebs off of old files and make Yelp Classic™ mockups for coverage. While undeniably painful, this process was necessary to guarantee that users would have a consistent experience regardless of whether they were seeing old or new styles.

The hardest part of the styleguide transition process by far was managing expectations with stakeholders, both internal (Group Product Managers, VPs, Sales Managers) and external (Advertisers, third-party Design Agencies). A gradual rollout of pages using an evolving design system means change and uncertainty, which can make the sales process very difficult. In order to get ahead of this uncertainty, I worked with the sales team to make a short document purpose-built to answer important questions about the transition before they were even asked.

This consisted of highlighting the differences between the old and new styles, trying to define a clear timeline for when different pages would be rolled out on different platforms, and defining exact requirements for new assets from advertisers. To make this information easily accessible, I formatted it into a printable Google Slides presentation. The document took me a little over a week to make, but it saved weeks of back-and-forth conversations between prospective advertisers and our sales team.

other contributions

Organized and led various user-centered workshops

Conducted user research with advertisers to better understand their needs and expectations

Hamburg office advocate for the Cookbook design system

Resident American language, punctuation, and culture expert

Organizer of the Hamburg football & Rocket League clubs

Credits

Product Design manager

Nayoung Kim

Product Designers

Tim Plummer
Cyriac Jannel

Group Product Managers

Rahul Hampole
Andrew Martinez-Fonts
Marc Kadish

Product Managers

Frederik Kemner
Birgit Kramer
Thomas Brouwer
Adwait Karmarkar
Sid Arora
Hanh Nguyen