about the project
Cane Brew — Product Page & Cart Redesign
Cane Brew offers fresh-brewed sweet tea made easy — premium quality, surprisingly affordable, with nothing artificial in sight. When I joined the project with the Dango Digital team, the product was great but the buying experience told a different story. Customers had to navigate between multiple product pages just to compare pack sizes, subscription options were easy to miss, and the cart left too many questions unanswered. My job was to bring all of that together, to create one product page, one clear flow, and a cart that actually reflects what the customer chose.
Before
After
Challenge
One product, scattered across too many pages
Cane Brew's sweet tea came in multiple pack sizes — but each size had its own separate product page. Every one of those pages also had a subscription option with three delivery frequencies, and a one-time purchase alternative. Customers had to navigate between pages just to compare options, and the subscription logic was easy to miss or misunderstand. The cart drawer added another layer of confusion: it was hard to tell what you'd actually chosen, and there was no way to change it without going back to product page.
Solution
One page, every decision, then a cart that confirms it
A single consolidated product page where customers pick their pack size, choose between subscribe or one-time purchase, and set their delivery frequency — all in one place, in a clear step-by-step flow. The cart drawer was redesigned to reflect exactly what was chosen, with smart upsell nudges, a free shipping bar, free gift visibility, and discount savings shown clearly.
The purchase flow, redesigned
The new product page guides customers through three decisions in sequence — removing ambiguity at every step.
Pick your pack
All five pack sizes live on one page as selectable options. Customers can compare quantities and prices without leaving the page.
Choose your price
Subscribe & Save and One-Time Purchase are presented side by side with the discount clearly shown — making the value of subscribing immediately obvious.
Set your delivery frequency
If the customer chooses a subscription, delivery frequency options appear inline — no extra step, no separate screen.
Cart drawer redesign
The cart had its own set of problems. Once something was added, it wasn't clear what options had been selected — and there was no way to change them without going back. The client also wanted to use the cart to drive more value from every order.
Transparent subscription state
Subscription items show a delivery frequency dropdown directly in the cart — customers can change their schedule without going back to the product page. One-time purchase items show a prominent "Upgrade to subscription" prompt with the discount displayed, making the switch feel like a benefit rather than an upsell.
Free shipping bar, free gift & savings
The redesigned cart drawer shows a progress bar toward free shipping, automatically surfaces any free gift earned, and displays the total discount amount at a glance — giving customers a clear sense of the value they're getting before they check out.
Design Process
01 Audit
Mapped every existing product page and the cart flow, identifying where customers were likely to get lost or drop off.
02 Explore
Tested multiple directions for consolidating the purchase options and working within the brand's strict color palette.
03 Design
Built high-fidelity designs for the unified product page and the full cart drawer in Figma, covering all states and edge cases.
04 Design
Iterated on the step-by-step selector flow and cart upgrade prompt until the logic felt invisible to the customer.
Outcome
What was once a confusing spread of similar product pages became a single, confident buying experience. Customers can now understand, configure, and commit to their order in one place — and the cart gives them the clarity and control to follow through. The result is a flow that respects the customer's time and makes subscribing feel like the obvious choice.