Brandless

Launching Gift Cards

About Brandless

Brandless is an e-commerce company with a mission to make better for you products more accessible by everyone. As a direct-to-consumer company that works with manufacturing partners, Brandless eliminates the brand markups and overhead costs to bring you curated, high quality products across food, household, beauty, baby, and pet categories at a much lower price.

Scope

Create and launch gift cards on the site to enable our community to give the gift of Brandless before the holiday season

My Role

Sole designer, partnering with PM and two engineers. I was involved in every step of the process, from research to end-to-end testing

TIMELINE

6 weeks from research to launch

TL;DR

Launching gift cards on the site had been on the product roadmap for some time, and given the clear business value and increasing customer demand, we wanted to get the gift card program launched before the holiday season. However, it would take much more time to create a full physical gift card program - vendor evaluations alone would take weeks. With only 6 weeks before the Thanksgiving deadline, we decided to launch with a digital only gift card experience and monitor performance to determine whether or not we should build a physical gift card experience.

We had many challenges throughout the project, from limited engineering resources to uncovering new constraints along the way, but were able to deliver the MVP of the digital gift card experience before Thanksgiving, and ultimately hit our goal of 1000 gift cards sold by end of Q4!

Process Overview

Empathize

validate demand

To evaluate demand for Brandless gift cards, we looked at several sources of signals:

Looking at the data from the previous year, both Monthly Gift Orders and Zendesk feature requests had a decent amount of volume per month, and volumes for both increased towards the end of the year leading up to the holiday months. Monthly on-site search intent for "gift cards" was also a strong indicator of demand. While exact Google search match for "Brandless Gift Cards" was low, there was a ton of long tail related matches for "gift cards for students" or "healthy grocery gift card", showing a strong demand for these types of gift cards.

Strong signal for gift card demand from on-site search intent
Long tail related matches for "healthy grocery gift cards"

Competitive research

To find inspiration for the Brandless gift card experience, I looked at other e-commerce sites to research the different patterns that other companies were using - below are a few examples:

DESIGN

SENDER Flow MOCK UPS

Desktop flow for checking out with only gift card in cart
Mobile flow for checking out with only gift card in cart
Desktop flow for checking out with gift card and other items in cart
Mobile flow for checking out with gift card and other items in cart

Checkout flow Screens

Checkout screen when user only has a gift card in cart - user enters gift card email address and message
Payment section in checkout
Order confirmation screen - displays gift card message and email address
Checkout screen when user has gift order AND gift card in cart
Additional steps in checkout when user has gift order - user must enter shipping information and message for gift order, and then also enter gift card email and message
Order confirmation screen - displays gift order message AND gift card message

SENDER Flow ANNOTATIONS

Selected screens from interaction annotations for the sender flow

DESIGN

REcipient Flow MOCK UPS

Desktop flow for adding new gift card in Account
Mobile flow for adding new gift card in Account
Desktop flow for adding new gift card in checkout
Mobile flow for adding new gift card in checkout

Different states in checkout

State when user attempts to add a gift card that has already been redeemed
State when gift card amount does not fully cover order total - user must add a payment to cover the remaining order balance
State when user has a saved payment method but has not added a gift card & has no credits
State when user has already added gift card in account OR has credits - user can choose to pay with gift card/credits or add a credit card
State when user has added a gift cards/has credits that cover the order total, and ALSO has a saved payment method - user can select which payment method to use for their order

REcipient Flow Annotations

Selected screens from interaction annotations for the recipient flow

Takeaways