Back in Stock. Simplified.
Set up and style back in stock forms right in Klaviyo. No code, no hassle.
Overview
Role: Product Designer | Duration: 2 months (Oct-Nov 2024)
I collaborated closely with PMs Uday and Alex. I led the project end to end, from uncovering competitive gaps and gathering user insights to designing and implementing a solution that streamlined setup and improved the overall experience.
Context
So what is Klaviyo? Who are we building for?
Klaviyo is a marketing platform that helps e-commerce brands connect with customers through email and SMS. It makes it easy to capture data, send personalized messages, and drive growth.
The problem
To install a back in stock form, brands had to copy code from our help center or rely on a developer, making the process slow and cumbersome.
Why this matters?
The process slows users down and makes capturing back in stock signups harder. Users often need a developer to set up forms which can delay notifications to customers, resulting in missed opportunities and lost revenue.
Business goal
Help brands increase revenue and build their subscriber lists by making it easier to create and launch back-in-stock forms.
Research
Accelarated competitive research with AI
I used AI to quickly review how Klaviyo’s back in stock forms compared to other platforms. This research revealed a key competitive gap and helped us identify improvements to streamline the workflow and improve the user experience.
Closing the competitive gap
We lagged behind competitors, guiding us to key improvements.
Responding to top user requests
Back in stock forms were the most requested feature on Productboard, helping us prioritize what users needed most.
Extra context
So what was the previous user flow?
Users had to:
-
Go to the Help Center to get the code snippet
-
Leave Klaviyo and open Shopify’s theme editor
-
Copy and paste the snippet
-
Update the code to match their brand styling
-
Save and confirm the changes
This flow was fragmented and time-consuming, requiring users to leave the site. It created friction and increased the risk of errors.
Design
Wireframing
The wireframes below show an initial version of the user flow. I originally considered placing it in the Products section since two other back in stock features were located there.
Gathering more feedback
So why didn't that work?
While internal and external feedback agreed that placing it in the Products section made sense, the experience still felt disjointed. Users should access back in stock forms through the sign up form builder because it aligns with their mental model of where forms are created, centralizes setup, supports customization, and creates a faster, more consistent experience. The mock on the right reflects these updates, showing back in stock forms added to the template library for quick access.
Final designs
Highlight 1
Smart defaults
Creating a back in stock form, automatically includes a checkbox for users to opt in to marketing as a smart default. This ensures forms are optimized for list growth without extra setup.
Highlight 2
Customizing the sold-out button
Brands can customize their “Notify me when available” button in the forms editor for sold-out products, adjusting colors, text, and styling to match their brand.
Highlight 3
Setting them up for success
Once the form is published, the user is prompted to activate and set up the corresponding flow. Without a connected flow, users who sign up may not receive notifications, so this step helps ensure engagement and drives results.
Measuring success
Impact and results
The revamp shows strong adoption, with over 60% of created forms being published and customer support tickets remain low overall.
1.8k
Accounts started a back in stock form in the first 30 days
1.2k
Accounts published a back in stock form in the first 30 days
67%
Accounts that started a back in storm have successfully published the form
229
Unique accounts enabled Smart Opt-in
188K
Shoppers have opted in with Smart Opt-in
22%
lift with Smart Opt-in when compared to traditional opt-in
Reflection
The revamp made back-in-stock forms effortless to set up, and adoption quickly followed. Support needs stayed low, showing the experience was intuitive. Still, usage patterns revealed opportunities: flows saw little traction. The next step is helping more brands see consistent success through better guidance and smarter defaults.