Rebuilding the On e-commerce platform in 3 months with a 7-person distributed team

I joined as Lead Product Designer & Design Engineer with a clear scope: take a 7-person distributed team and ship a brand new e-commerce site from zero to production in 3 months. The team was a PM, two UX designers, two frontend engineers, and two QA, spread across time zones, with stakeholders needing fast answers around the clock. My job was to keep design and engineering operating as one unit, remove blockers fast, and own the quality bar across both sides. Set up a few simple habits that did most of the work: clear ownership per surface, short daily check-ins, definition of done, and a shared design system so people built once and reused often. Stayed hands-on in both Figma and the codebase, paired on tough tickets, ran reviews, and mentored without managing. The team hit the 3-month window, landed 2 to 3 weeks ahead on each milestone, and left behind more than a launch: a calm cadence, a token-aligned design system, and a foundation that makes the next release faster.

Starting from the existing design system, the task was to map the full site experience in hi-fi while tightening the system itself. I built mobile-first, fully responsive wireframes that locked layout, hierarchy, and states for every key screen. Components and variants followed clear rules for spacing, type, breakpoints, and interaction, with accessibility baked in from the start. Where gaps appeared, the system was extended with new patterns, tokens, and naming so designers and engineers could speak the same language and reuse with confidence. To speed up build, every frame was optimized for a Figma MCP, Cursor, and Claude Code workflow: component specs lived next to the design, tokens matched code, and prompts generated clean scaffolds that mirrored the wireframes. The result was a smooth design-to-code pipeline. The team turned wireframes into reusable components and pages quickly, with fewer back-and-forth questions, less rework, and tighter visual consistency across PLP, PDP, cart, and campaign pages. In short, the system got stronger, the UI stayed consistent, and shipping got faster.

From day one, the codebase had to help the team move quickly without losing consistency. On the front end, we set a feature-based structure in Next.js with atomic React components, typed props, and shared utilities for state, i18n, analytics, and a11y. Design tokens for spacing, color, and typography mirrored the Figma system, so UI decisions translated cleanly to code. Routing and layouts lived in Next.js, with a balanced mix of SSG for stable pages and SSR for dynamic views, plus lazy loading and image optimization to keep interaction snappy on mobile. On the back end, we used typed adapters to connect Shopify for commerce and Contentful for content, keeping domain logic isolated behind clear interfaces. Webhooks and incremental revalidation refreshed pages when products or content changed, while edge caching on the CDN kept TTFB low across regions. Clean HTML, structured data, and tidy URLs supported SEO and marketing needs. CI ran pre-commit checks, type checks, tests, and preview builds, and a documented component library made reviews predictable. The result was a calm, repeatable rhythm: new components and pages dropped in without collisions, data flows stayed reliable, and load times remained sharp even under launch traffic. Editors published faster without waiting on engineering, developers shipped with confidence, and the platform scaled smoothly across campaigns, locales, and future features.

The website needed to feel native in every market, not just translated. A core requirement was dynamic localization with easy country and language switching, plus smart defaults set by domain and regional norms. That meant mapping domains to locales, loading the right currency and size guides, and keeping SEO signals clean with hreflang and tidy, locale-aware URLs. From first visit, users should see the correct language and market rules without lifting a finger, and still be able to switch in a click. I integrated i18n at the framework level and added a locale router that applies sensible defaults per domain, then persists user choices across sessions. Contentful became the single source of truth for copy and assets: localized entries, shared media, editor roles, and preview made market updates fast and safe. Fallbacks prevented missing strings, edge caching kept switches snappy, and analytics carried locale context so marketing could read performance by country and language. Where relevant, the system accounted for RTL and typographic differences, aligning tokens with regional needs. The result is a fast, dependable experience that ships the right language, currency, and compliance by default, and scales cleanly as new markets come online.

The site shipped on time, with measurable wins on the bar that mattered. The platform now handles product drops and seasonal launches as a routine event instead of a release-day exercise. The design system can be extended by content teams without breaking layout, the localization system carries language, currency, and sizing by default across markets, and the design-to-code path stayed lossless across two phases and seven people.