One-Click Upsell and Landing Page for a Toy Doll: A Case Study
Summary: A Shopify 1-click upsell and landing page design enabled Lammily to sell, fulfill, and ship a significant quantity of dolls and accessories in three days.
View The Final Design Images
Use the links below to see a larger version of each image.
The rest of this page will discuss my strategy for designing these pages.
About The Product
Lammily® is the producer of the world's first toy doll with realistic body proportions. The doll is based on CDC measurement data for an average 19-year-old American woman. Lammily’s goal is to promote realistic beauty standards and a positive body image.
The Problem
Unable to Run a Large-Scale E-Commerce Promotion
The stakeholders decided to retire their original "Traveler" doll. To be able to advertise this campaign at scale, Lammily® needed an effective and efficient way to sell, fulfill, and ship the remaining inventory in a short amount of time.
Unable to Separate Campaign Accounting from the Main Website
The design, pages, order processing, and everything else involved in selling the remaining “Traveler” doll inventory needed to be separate from the company’s main financial accounts and ecommerce website.
My Role
I was hired as the designer and developer for this campaign. I communicated with the company’s investor and marketing manager. My responsibilities were as follows:
- Design and code a landing page that would effectively sell the “Traveler” doll.
- Design and code an upsell page to sell the doll’s outfits, using Zipify one-click upsell.
- Recommend an ecommerce platform that would efficiently automate the sale, fulfillment, and shipment of each doll and outfit.
- Set up the e-commerce platform so Lammily could accept online sales that would be separate from their main e-commerce website and financial account.
The Solution
I chose the following solutions based on the project's requirements, my research, and my experience using similar approaches on previous projects.
Shopify
Shopify is a leading multi-channel commerce platform and shopping cart that powers over 500,000 businesses.1 It is reliable, scalable, and can be integrated with many solutions.
One-Click Upsell Using Zipify
A one-click upsell increases the average order value by letting customers purchase accessories, with just one click, after they've purchased the doll. This reduces friction when ordering the accessories because customers don’t have to enter their credit card information again. It also secures the initial doll sale. Zipify is software that enables the one-click upsell feature in Shopify.
This one-click upsell example includes a green button that, if clicked, automatically adds the product shown and charges the customer. The gray button declines the offer and completes the order.
Stripe
Stripe is an established, trusted payment processor that integrates with most software. This project required that different Stripe accounts be set up for first orders versus upsell orders, and Stripe easily accommodates this requirement. One Stripe account could process the first order and a second Stripe account could process the upsell order. Stripe also readily integrates with the other software we used, namely, Shopify and Zipify.
Cart Rover
I discussed order notification options with Lammily's fulfillment center manager and chose to use Cart Rover because Lammily had used this service before. After I set up Lammily's Cart Rover account, every order was automatically sent from Shopify to Lammily's fulfillment center team to be picked, packed, shipped, and marked as fulfilled inside Shopify. Lammily employees didn’t have to do any manual communication when shipping an order—with Cart Rover, it was all done automatically, allowing Lammily to scale their marketing campaigns.
Landing Page Design
I designed the landing page in Adobe Photoshop, then used Bootstrap to code the page so it could be used as a custom Shopify theme. For some projects I also write sales copy, but the stakeholders provided it for this project.
Persuasive points that I added include:
- Social Proof - The CNN interview video provides social proof.
- Scarcity - Once the limited inventory is gone, the doll will not be available.
- Urgency - The countdown timer emphasizes that the offer will soon expire and increases urgency.
Upsell Page Design
I met with stakeholders and reviewed all of the doll outfits being offered. After gathering the product images and descriptions, I designed and coded the upsell page (shown below) inside Zipify. This upsell page displays immediately after a person places an order. It contains a special offer that compliments or enhances the product the customer just purchased. The goal is to increase average order value. If the customer accepts the upsell offer by clicking the green button, the offer is automatically charged to their order - they don't have to enter their credit card information again. If they decline the offer, they are taken directly to the order confirmation page.
- Outfit images - Using Adobe Photoshop, I edited and combined images of the outfit, box, accessories, and doll into 6 different images that clearly show what the customer will receive and how the outfit appears on their doll.
- Scarcity - Again, the customer is reminded that once the limited inventory is gone, the product will not be available.
- Urgency - The countdown timer again increases urgency by emphasizing that the offer will soon expire.
This is the entire one-click upsell page that a customer sees immediately after they order. Each outfit is removed from this page when it sells out.
The Outcome
- Lammily was able to sell a significant quantity of dolls and outfits in just three days.
- Orders were automatically sent to their fulfillment center to be picked, packed, and shipped without problems.
- Lammily achieved their campaign goal.
Challenges
Removing Items When They Sold Out
Initially, I didn’t have a solution in place for when one of the doll outfits sold out. Because these outfits were offered in a pack, I needed to have 5 different upsell page variations and upsell SKUs ready for when an outfit sold out. As soon as I became aware that this would be a problem, I immediately took steps to resolve the issue.
Product Awareness for Cold Audience
The cold audience needed proof and history of the Lammily Doll. They responded well to the CNN video, which provided a story and social proof, thus addressing the audience’s concerns and increasing their motivation to buy.
Things I Didn’t Use
Sales Page Without CNN Video
We split-tested a hero area without the CNN video and media logos. We didn't use this version.
Observations
Test All Edge Cases
It is important to test all possible order situations and edge cases before launching a campaign so as to have a solution at hand for those rare cases when a problem arises. An example is not having a new upsell page variation with "sold out" outfits removed while still accepting orders for them. When this happens, the customer needs to be emailed an explanation, refunded, and is unhappy.
Notify Payment Processor of Large Sales Volume
Notifying a new payment processor that a high sales volume is expected can prevent a “verification” hold on the revenue generated.
Cold and Warm Audiences Require Different Details
Different audiences require different levels of information detail. This project involved two audiences: a warm audience (internal email list / previous buyers) and a cold audience (paid social media).
Use Clear Product Images
It is important to keep product images clear and representative of what customers will receive so that they know what to expect. Is the image helpful or just decorative? Consider too how visitors will see images on mobile devices.
References
1 - https://www.shopify.com/press/releases/shopify-now-powers-over-500-000-businesses-in-175-countries