A wholesale sprinkle brand, rebuilt as an interactive candy factory.
They make their own sprinkles in their own certified facility. Their old site hid all of it. So on my own, as a concept pitch, I rebuilt it as a custom, hand-coded experience where the product itself, the sprinkle, runs the entire interface.
This isn't a screenshot. It's the real site.
The window below is the actual deployed homepage, running live. Scroll it, click the factory, build a blend, type the word “sprinkles.” Everything works right here.
Best experienced full-screen. open the live site in a new tab →
A real manufacturer with a hobby-seller website.
The brand isn’t a reseller. It’s a family business that makes its own product from pure cane sugar in its own certified facility and sells wholesale to bakeries and manufacturers. Everything that matters to a commercial buyer was true, and invisible.
- “We make our own,” the biggest differentiator, was nowhere visible
- No certifications, MOQs, lead times, or spec signals for buyers
- The full range flattened into a plain list
- Template styling that read hobby seller, not manufacturing partner
- No way to request a custom blend, their actual edge
A real production floor. The story the old website never told.
A brand-mark idea made from the product itself.
One direction I explored is an interlocked double-S monogram drawn entirely from tiny colored sprinkles, so the mark literally is the product. In the concept it threads through the whole system: the load reveal, the cupcake liner, the factory machine, and the family watermark. Their real logo is already on every bag and box, so this stays a proposed direction, not a replacement.
Before
A generic mascot badge that could belong to any candy shop.
A monogram built from the product itself. A proposed direction, not a forced rebrand.
Make the brand’s own shape do the work.
A sprinkle is a pill. So the pill became the site’s structural unit, but only where it means something. A deliberate shape grammar keeps the motif a signal instead of wallpaper: the moment everything is a pill, nothing reads as a sprinkle.
Interactive & moving
Nav, ticker chips, CTAs, FAQ rows, form selects. Small, discrete, clickable. The parts that behave like loose sprinkles.
Dots & icons
Icon holders, color swatches, carousel markers. A circle is the round sprinkle, the smallest accent, never competing with the pills.
Containers
Cards, sections, canvases. The bowls the sprinkles sit in. Their restraint is what lets every pill read as candy.
Every scroll does something only this brand could do.
Six custom-built interactions, not a single stock component. Each one turns a claim into something a buyer can feel.
304 sprinkles, precomputed offline and each angled to follow the letterform’s stroke, fall in to assemble the logo, hold, then explode like a firework as a drip-curtain melts the page in.
A five-second brand moment that tells a first-time buyer “this is a serious, crafted operation” before they read a single word.
A living canvas diorama runs the whole process: cane field to certified machine to color shower to shape stamp to a sealed, certified box. Every station reacts to a click, each with a sound synthesized live in Web Audio.
It demonstrates “we make our own” in six seconds, the one claim that separates a manufacturer from a middleman, instead of asking buyers to take it on faith.
A catalog-accurate configurator: pick a line, style, and colorway and watch it render onto a cupcake in real time, then hand the finished blend straight to the quote form.
A way to turn a static catalog into something a buyer can play with and hand straight to a quote. Built to show the capability. Whether a brand wants it customer-facing, internal, or not at all is a call for the owner.
At the top it’s a full-width bar; on scroll it contracts into a floating pill, the sprinkle shape, with width, radius, and shadow all tuned to glide instead of snap.
Premium interaction detail signals a premium supplier. And it’s on-brand twice over: the navigation literally becomes the product.
A lane of tumbling pill chips with a staggered bob wave and scroll parallax, linking to real sections. Between every section, icing drips cast scoop shadows and occasionally pinch off a falling droplet.
The candy-shop personality lives in motion, not clip-art. Charm that still routes buyers toward products, samples, and the quote form.
The natural-line bowl spins with scroll and spirals colored dots off its rim in the direction it turns. Hidden throughout: type “sprinkles” for a rainstorm, poke the cupcake, click the footer mark for a season-aware burst.
Delight that rewards exploration keeps buyers on the page longer and makes the brand memorable. The kind of site people screen-record and send to a colleague.
The mockup is the questionnaire.
Every fact I couldn’t yet confirm, like certifications, minimums, and catalog specifics, went onto the live site as a yellow placeholder. Those same placeholders became a private intake page in the site’s own voice, where each of my best guesses is pre-filled for the owner to confirm or correct.
- Autosaves as they type, with a progress bar
- Accepts photo uploads and emails answers straight to me
- Themed like the site, not a boring form
- The deliverable does its own discovery
← The intake page concept, styled in the site’s own voice.
A supplier that could finally look like a maker, not a middleman.
The retail lineup, rendered in the proposed system.
- “We make our own” becomes the felt center of the concept. The factory demonstrates it in six seconds
- Commercial-buyer signals built in, ready for the family’s real answers
- A working blend builder, showing how their custom blending could become interactive
- One cohesive brand system across five interactive pages
- Zero frameworks, no build step, ~3MB. Static deploy to Cloudflare Pages
- Three independent design critiques converged: the design and structure are resolved. The real-world specifics are what the client would bring
Not a template. The real thing.
I build custom, hand-coded sites where the interactions come from what the business actually is, never a page builder’s component library.
