Case study: Elevating the Bed Bath & Beyond email signup

Shiny products, lovely people, messy website.

It’s unfortunate, and I’m sure they’re working on it, but BB&B’s site makes some basic design missteps.

I joined a BiteSizeUX workshop last night where a dozen or so designers evaluated the site, found areas for easy improvement, and laid out solutions.

(You know the rush of snapping puzzle pieces into place, with a group, faster and better as you build off each other? It’s like that. Find the workshops here.)

We identified several issues, but one stood out to me:

Their Email Signup Needs Some Work

North Americans, you may recognize it. It looks just like their monthly coupon in your mailbox. But here, you have to invite their invasion of your email inbox for the same coupon. Already not a great start.

Click “yes,” and…

I chose specifically to focus on the confirmation after you sign up:

First, a Heuristic Evaluation

I evaluated this experience against three basic design heuristics:

1. Visibility of system status

Score: 3 (Needs improvement)

The problem: If I don’t watch carefully, I might miss that teeny tiny confirmation text in the top left corner — see it?

2. Match between system and the real world

Score: 3 (Needs improvement)

The problem: In the real world, a trade involves a hand-off in both directions. I just ‘handed’ BB&B my email address; where’s my coupon? I guess I could visit ‘visit my offers,’ but isn’t an offer something you don’t have yet? Why would the discount I’ve already ‘earned’ be there?

Also,

(Also, unrelated but why are some button calls to action capitalized and others aren’t? So may questions!)

3. User control and freedom

Score: 2 (Could use help if there’s time)

The problem: Two things, here.

• First, how can the user now control their discount? Should they shop and it’s automatically applied? That’s the first CTA, and has closer proximity to the discount itself. Should they use the barely-there link to instructions? (Should one ever need instructions to use a discount??)
• Second, what if the user wants to ‘undo?’ They’d need to go to their inbox, find the BB&B email, and locate the unsubscribe link — then likely confirm their un-subscription. I have never actually seen an ‘undo’ button on an email subscription. It’s probably not great for growing audiences. But it’s nice.

I went hunting for inspiration from other retailers offering discounts in exchange for email addresses.

Competitor 1: Free People

As with BB&B, Free People shouldn’t require customers to switch to their inboxes to find their discounts. Not a great match to the real world.

Get Amanda at Mystic Tea & Stories’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

But, at least they clearly communicate the system status, and give users control with the next step.

Competitor 2: Atlas Coffee

Atlas Coffee got it right. Take a look:

Twice, they tell me my discount has been applied for checkout — no fuss, no muss. System status: check.

As for the other heuristics: This matches the real world, if your world is a Disney hotel, where you’re told, “Your bags are waiting for you in your room,” and, “It’s already been charged to the card on file.” I’ll take it.

Otherwise, users have control. They can X out the yellow announcement bar, and simply scroll down, as directed, to move forward.

Competitor 3: Milk Makeup

Thank you to BB&B for not pulling this dirty trick (sorry, Milk, but it is!):

I saw this multiple times while hunting down these examples. They don’t explicitly state I’ll need to give them my phone number as well, but it’s implied, and it’s standard.

Also, access to my text stream is gonna cost you a lot more than 15% off.

Moving on…

Next, I started ‘rapid sketching’ possible solutions to improve the usability of Bed Bath & Beyond’s email sign up confirmation.

I decided to go forward with this sketch, because it elevated each heuristic:

1. Visibility of system status. Three different sentences indicate the new status of ‘discount provided.’

2. Match between system and the real world. The discount code is delivered on the spot.

3. User control and freedom. Users have four ways to get to their discount code, including just looking right in front of them. No extra steps needed.

HOWEVER. That’s a lot of text. I needed to reduce it, or at least break it up visually. I took another crack:

Much better. A colored bar, a 3-column grid, easier on the eyes.

It was finally time to start playing with design tools. Here is my redesign of the email signup confirmation, as designed in Figma:

I’m quite happy with my little upgrade prescription here. But, I know I’ve only tackled one tiny bit of the full Bed, Bath and Beyond site experience.

Were I to continue, I’d work next on the initial email sign up form (steps 1 and 2, which, incidentally, I would combine).

But, as always, one step at a time.