(CASE STUDY) BRUSHERS CO. · 2026 LAUNCH + ANIMATION
Toothpaste, but actually fun to look at.
Built Brushers Co. end-to-end — brand identity, illustrated visual system, fully-animated Shopify storefront. Premium toothpaste in a category that mostly looks like a chemistry set on a fluorescent shelf. The brief was to make people stop, look, and read — for two minutes — about a tube of toothpaste.
Responsive · live storefront at 1440 / 820 / 414
(01) PROBLEM
A premium product in a supermarket-default category.
Toothpaste is the textbook low-engagement category. Buyers walk down an aisle, grab whatever they grabbed last time, and walk out. The legacy brands have been making the same product for a hundred years, and the supermarket-shelf design language has barely moved in the last twenty.
Brushers Co. came in with a real difference: apothecary-style illustration, fluoride-free formulations, named flavours (Arctic Mint, …), proper ingredient stories. The product was beautiful. The challenge was getting people to look long enough to notice — in a category where attention is the scarcest resource of all.
(02) APPROACH
Animation as brand-building, not decoration.
Built the storefront as a fully-animated experience — every section choreographed with GSAP + ScrollTrigger. The hero is split-screen per flavour: cream/butter on one side, bright pink on the other, the tube floating between them with subtle parallax as the user scrolls.
- Split-screen hero per flavour — Arctic Mint on icy crystals, others on flavour-specific backgrounds. The tube enters the frame on every scroll.
- Scroll-triggered ingredient reveals — the “Know Your Ingredients” page reads like a Victorian apothecary catalogue, each ingredient drawn to scale, animated in as the user scrolls.
- Illustrated PDP — fixed tube imagery on the left rail, scrolling story on the right. Add-to-cart sticks at the bottom of the right column.
- Motion as a quality signal — every button hover, every menu open, every flavour switch carries the same craft as the printed packaging. The brand says “we cared about this” without writing it in a tagline.
- Performance budget held — animation is selectively loaded, GSAP plugins tree-shaken, all reveals respect
prefers-reduced-motion. No accessibility cost for the visual ambition.
(KEY PAGES)
(03) RESULT
Three-minute sessions for a tube of toothpaste.
- Launched on schedule — brand identity, animated theme, packaging system, and Instagram identity all consistent on day one.
- Time-on-page over 3 minutes on the homepage — category-leading for D2C personal care, where most sites see under 45 seconds.
- Social-share rate above benchmark for D2C personal care — visitors screenshot the animated hero, the apothecary illustrations, the ingredient pages.
- Merchandising team ships flavour drops + ingredient stories via theme sections — every animated module is editor-configurable.
- Lighthouse 95+ across all categories despite the animation budget — motion gated behind
prefers-reduced-motion+ a JS budget audit.
(SCOPE)
- Brand identity from scratch — wordmark, illustrated visual system, palette (cream / pink / icy mint), tone
- Custom Shopify theme — section-level Liquid for editor flexibility
- Full motion system — GSAP + ScrollTrigger choreographed reveals across hero, PDP, ingredients page
- Illustrated PDP with sticky-cart, fixed-image / scrolling-story layout
- “Know Your Ingredients” apothecary-catalogue page — extensible via theme sections
- Performance pass — JS budget audit, animation gating for reduced motion, Lighthouse 95+ contract