BerryLush — Case Study · Edward Georgevic

The storefront homepage — “Real Fruit. Real Good. Reimagined.” This isn't a mockup: it's a live, hand-coded page. Open the working prototype ↗

The opportunity

The candy aisle is a $41B+ market that keeps growing — but shoppers read labels now. There's a widening gap between legacy gummies built on artificial everything and joyless “diet candy” that forgets the fun.

BerryLush lands in that gap: real-fruit indulgence with zero apology. The challenge was to build a brand and a storefront that felt playful and premium while quietly being a high-performing commerce machine — starting from a blank page.

What I built

Product strategy & PRD — a full v1 spec: objectives, KPIs, personas, information architecture, prioritised requirements and roadmap.
Brand & design-token system — a reusable brand-tokens.css encoding the palette, type, radii and motion so every future page stays on-brand.
A live front-end storefront — hand-coded HTML, CSS, JS and inline-SVG art, with no build step and no dependencies.
Developer handover docs — README, project context and working rules so any developer (or AI agent) can extend it safely.

BerryLush featured product with pricing and trust cues

BerryLush ingredients — in every bite, never ever

BerryLush Berry Drop subscription and story

Featured product with clear pricing, the “In Every Bite / Never Ever” ingredient transparency block, and the Berry Drop subscription hook — the whole funnel, on-brand. Tap to enlarge.

A design system, not just a page

Rather than eyeball each screen, I codified the brand into tokens. The book's rules became enforceable code: a 60/30/10 colour weighting (blush fields, berry moments, leaf-green accents only), a chunky display face reserved for heroes, and rounded corners everywhere — no sharp angles.

Every value lives in one file, so a second page inherits the brand for free and nothing drifts.

Accessible & interactive

The brand's pinks fail contrast on blush, so I made a hard rule: body text is always Berry Ink and every flow passes WCAG 2.2 AA — visible focus, full keyboard support, and a prefers-reduced-motion variant.

Slide-out cart drawer with a free-shipping progress bar.
Add-to-cart bounce and toast; FAQ accordion; email capture.
Scroll-reveal animations and hand-built SVG mascot, pouch and minis.

Product thinking behind the pixels

Because the storefront is the destination for a feeds-first launch campaign, I wrote a PRD tying the site to business goals — convert social traffic into first purchases, grow the “Berry Drop” subscription into predictable revenue, and capture email/SMS for drops and restocks — with measurable KPIs (conversion ≥ 2–3%, AOV ≥ $18–22, subscription ≥ 10–25% of DTC revenue).

I also kept the scope honest. The cart and checkout in the prototype are front-end demos; the handover docs recommend real commerce on Shopify with a subscription app and Klaviyo for lifecycle email/SMS — so nobody builds a custom checkout by mistake.

“A website that feels like opening the pouch — while quietly being a high-performing commerce machine.”

— BerryLush PRD, v1.0

Open the live prototype Brand launch book (PDF)

Launching something?

From brand and strategy to a real, accessible front-end — I can build the whole thing. Let's talk.

Start a project See more work

BerryLush — a candy brand, built from strategy to a working storefront.