Speed & delivery badges

Items eligible for Free Full Service Delivery or Fast Delivery are marked with small visual indicators (“badges”) that appear throughout the shopping experience — including on Browse, Product Detail Pages, Cart, and Checkout.

I led updates to Wayfair’s delivery and speed badge styles to resolve visual and functional inconsistencies across web and app. The goal was to improve responsiveness, fix long-standing bugs, and create a cohesive system that could scale to new use cases. The work also aimed to increase conversion rates on badge-eligible products by improving clarity and trust in delivery messaging.

This project successfully brought consistency to badges across the shopping experience, reduced tech and design debt, and increased conversion rates for Full Service Delivery–eligible products.

Role: Product Designer

Team: Product Manager, User Research, Engineers, Analytics

KPI: Conversion rate of Full Service Delivery items

Scope: Wayfair & specialty brands web and app

Web badges

Speed and delivery badges appeared across the shopping journey. However, the Free White Glove badge displayed inconsistently across these surfaces, with different visual treatments on Browse and PDP compared to Cart and Checkout. In addition, user feedback revealed that customers often didn’t understand what Free White Glove Delivery meant or what the service included.

App badges

In the Wayfair app, badge styles also lacked consistency. For example, the speed badge appeared with a purple background on Browse, but as green text in Cart and Checkout. These discrepancies contributed to both tech and design debt, making it harder to maintain and scale the system.

Badge bugs

The existing badges also had several long-standing bugs that impacted reliability and presentation. Common issues included badges breaking when translated to German and French, duplicate badges appearing on the same product, and text occasionally rendering outside of the badge’s container.

Competitors

I conducted a competitive audit to understand how other brands displayed key product information on-site. A strong takeaway was that many brands used brightly colored badges with text to draw attention to highlighted details like fast and free shipping, best sellers, and savings.

Exploration

I explored a range of new design patterns for Wayfair’s speed and delivery badges, experimenting with variations in color, iconography, and copy. Using Wayfair’s brand palette as a foundation, I tested different visual treatments to find a balance between prominence, clarity, and consistency.

Research

White Glove Delivery is Wayfair’s most premium delivery service; products are brought inside the home, assembled, and all packaging is removed. Research revealed that many customers didn’t understand what Free White Glove meant, prompting an exploration of alternative naming options. Partnering with the User Research team, we tested several potential names, and 6 out of 10 customers found Full Service Delivery to be the clearest and most accurate. This insight ultimately informed the service rebrand.

A/B test

User research also revealed that customers didn’t understand the value of Free White Glove Delivery when seeing the badge on a product. To address this, an A/B test was conducted in the PDP shipping overlay and cart, and checkout showing a strikethrough price to indicate the service’s value. The displayed price was based on the cost for items with a paid White Glove Delivery option, helping customers better understand the benefit of the service. The test variant showed a 2.5% lift in conversion rate for Free White Glove Delivery-eligible products.

New web badges

Based on insights from user research and the A/B test, I designed updated badge treatments. White Glove Delivery was rebranded as Full Service Delivery, and new visual patterns were applied to all speed and delivery badges to improve clarity, consistency, and alignment across web and app.

The updates addressed key technical and design issues: badges could now wrap to two lines without breaking, translated languages seamlessly, and appeared consistently across Browse, Product Detail Pages, Cart, and Checkout on web.

New app badges

The updated badges were also implemented in the Wayfair app, ensuring consistent designs across web and app platforms. This alignment was especially important because roughly 20% of customers cross-shop between mobile web, app, and desktop. Providing a unified badge experience improved visual coherence, reduced confusion, and made the system easier to maintain and scale.

Prototype

Impact

The redesign of Wayfair’s speed and delivery badges delivered measurable benefits for both internal teams and customers:

  • Increased conversions: Conversion rates for Full Service Delivery–eligible products improved by 3%.

  • Enhanced product clarity: Items eligible for both speed and delivery badges could display both badges, clearly communicating when an item was eligible for both fast shipping and Full Service Delivery.

  • Clearer service messaging: Free White Glove Delivery was rebranded as Free Full Service Delivery, improving customer understanding of the premium service.

  • Reduced tech and design debt: A single, unified badge style across web and app simplified maintenance and future updates.

  • Improved reliability and localization: Badges wrapped to two lines without breaking and translated seamlessly into German and French.

Through this project, I gained valuable experience designing for multiple languages, effectively applying user research and A/B test insights effectively, create a reusable component across the shopping journey, and provide detailed documentation for both design and engineering libraries.

Specialty brands

In addition to the main Wayfair site, badges also appear on Wayfair’s specialty retail brands; Perigold, AllModern, Birch Lane, and Joss & Main. Each brand has distinct style guidelines that needed to be respected while implementing the new badge system. This required adapting the updated designs to fit each brand’s visual identity without sacrificing consistency, clarity, or functionality.

Documentation

To ensure the new badges could be easily reused and maintained, I documented them in Wayfair’s Figma design library. I added detailed specifications, usage guidelines, and examples, enabling Engineers to accurately replicate the badges in their own libraries and maintain consistency across future updates.

Future vision

There is still potential to further improve Wayfair’s badge experience on-site. Currently, Wayfair has many different product details that can appear on a Product Detail Page, spread across multiple locations. Bringing these key details together in a dedicated space on the PDP could make important product highlights more visible and easier for customers to understand, which could drive faster purchase decisions.