Storefront redesign to 150% acquisition growth
Design system and multi-marketplace support for a premium pet brand.
Client Snapshot
- Brand: Whiskers n Paws (Premium Pet Food)
- Challenge: Multi-storefront design system
- Timeline: 10 weeks fixed
- Budget: $24,000 fixed
- Result: 1 design system, launched into HKTV Mall
Business Impact
The Problem
Whiskers n Paws operated across multiple marketplaces (Tokopedia, Shopee, HKTV Mall) but each storefront looked mismatched. Product pages were not optimized for how customers actually shopped. Search patterns differed by platform. The brand needed a cohesive visual identity without losing conversion.
Expanding into HKTV Mall (a high-friction marketplace) required entirely new store and product layouts. The team faced a choice: rebuild manually on each platform (months, high cost), or architect a design system that could scale.
The real challenge: design a system flexible enough for platform-specific workflows, yet consistent enough to feel like one brand across all touchpoints.
Our Solution
We built a unified design system - component library, typography, color hierarchy, imagery standards - then adapted it for each marketplace. Week 1-2: audit current pages, define the visual identity. Weeks 3-7: design new product pages, storefront layouts, and checkout flows tailored to each platform UX patterns.
Rather than forcing Tokopedia layout onto Shopee, we applied the same design principles (color, hierarchy, spacing) within each platform constraints. Weeks 8-10: implementation oversight, QA on all pages, and HKTV Mall launch preparation.
The system remained living: new product images, promotions, seasonal campaigns - all templated so updates took hours, not weeks. User acquisition shot to 150%, with the same system extended cleanly into the HKTV Mall launch.
Design & Implementation
- Design Tools:Figma (component library)
- Frontend:React, Tailwind CSS
- E-commerce Platforms:Tokopedia API, Shopee API, HKTV Custom
- Analytics:Google Analytics, PostHog
- CMS:Contentful for image management
- CI/CD:GitHub Actions + Vercel
Inside the Design System
1. Product Card Component Library
Unified cards (hero, thumbnail, detail) that adapt to platform grid systems without losing brand identity or conversion mechanics.
2. SEO-Friendly Product Pages
Redesigned layouts for natural search behavior on each marketplace. Tokopedia users browse; Shopee users search. Pages adapted to user behavior, not forced templates.
3. Promotion & Campaign Framework
Templated banner system, seasonal layouts, and flash-sale mechanics that worked consistently across Tokopedia, Shopee, and HKTV without manual redesign.
4. Unified Inventory Architecture
Central inventory synced across all three marketplaces. One source of truth; no stock mismatches or SKU confusion.
"We went from managing three separate storefronts to managing one design system. The consistency is night-and-day. Customers recognize us. And launching into HKTV was just weeks, not months, because the system was already there."
Founder, Whiskers n Paws
Need a design system for multi-channel growth?
Let us build the framework that lets you scale across marketplaces without losing your brand.