swatchbook

swatchbook

Platforms

Web app | iOS & Android apps

Project Overview

swatchbook Ecosystem

From first designer to Head of Design — building the design language, system, and team behind swatchbook’s global platform

Overview

I joined swatchbook as the first designer, tasked with creating a unified design system and language for a cloud-based platform that would reshape how the fashion industry digitizes, sources, and collaborates on materials.

Over an 8-year journey, I established the company’s design practice from the ground up, eventually becoming Head of Design. I built and led a design team that owned the UI/UX across swatchbook’s entire product line — including web, mobile, and spatial apps — and extended design into every client-facing touchpoint, from branding to supplier communications.

swatchbook’s ecosystem is now trusted by Nike, Adidas, Puma, H&M, Target, New Balance, Victoria’s Secret, lululemon, Wolverine, Hanes, and more.

My Role

  • Design Systems & Language → Established the swatchbook design system, creating consistency across product lines, integrations, and client-facing assets.
  • Leadership → Built and scaled the design team, fostering a culture of collaboration, research-driven decisions, and continuous iteration.
  • Product Design → Directed and delivered UI/UX across swatchbook, Mix, and Remix apps for web, mobile, and tablet.
  • Cross-functional Collaboration → Worked closely with engineering, QA, and leadership to ensure execution aligned with business goals.
  • Brand & Marketing → Extended design language into websites, campaigns, supplier materials, event booths, and promotional assets.

Execution

Execution Highlights

1. Design System

  • Built the foundational design system still in use today, enabling scalability across multiple apps and integrations.
  • Established reusable patterns, interaction models, and visual identity for both product and brand.

2. Major UI Overhauls

  • Led two platform-wide redesigns that simplified navigation and improved usability.
  • Conducted A/B testing and analytics reviews to validate design decisions, resulting in measurable improvements in satisfaction and task completion.

3. UX Research & Continuous Enhancement

  • Introduced a UX research practice: surveys, interviews, and analytics monitoring.
  • Mapped personas and user journeys to inform product strategy.
  • Created a research repository to track insights and inform iterations across teams.

4. Key Integrations & Features

  • Designed the swatchbook x Centric PLM integration, enabling seamless data exchange between platforms and unlocking enterprise adoption.
  • Launched innovative features like Flashcards — quick-reveal digital material details that simplified collaboration between designers and suppliers.

5. Beyond Product

  • Designed branding, websites, and marketing collateral, ensuring a consistent and professional presence across all client touchpoints.
  • Created supplier-facing digital workflows, replacing static PDFs with live, updateable resources.

See Design ops & design systems and Design leadership, culture & advocacy for more details.

Competitive Audits

Competitive and design audits were regularly done to ensure highest quality.

Competitive Audit

UI Overhauls

UI updates including two major overhauls across all platforms were designed and executed in collaboration with engineering and QA. Several case studies, mockups, prototypes and usability tests were made. For the details of the design system created to govern these designs see Design Ops & Design Systems

v2 UI mockups_01
v2 UI mockups_02
mobile app 01
mobile app 02
Information Architecture 01
Information Architecture 02
Information Architecture 03
v3 UI mockups_01
v3 UI mockup_02
v3 UI mockup _03
v3 UI mockup _ collection view
Store mockups

UX Research Continuous Enhancement

Surveys, interviews, analytics monitoring helped identify patterns and key insights.

System Usability Scale Survey

Google analytics was leveraged to understand many aspects like device types per region, another example is most common screen resolutions to test against. Screen resolution is indicative of the height and width of the screen where the browser size refers to the space available for your website to load (removes toolbars and also covers the case of manually resized windows) scale can be a factor as it can sometimes be larger than the screen size. windows users for example are known to tweak scale as a global setting for the machine nevertheless we were able to identify outliers highlighted yellow (less than 1 sec average sessions) as well as common resolutions.

Screen resolution analytics

In house analytics was leveraged to monitor user interaction with swatches to quantify interest, and identify patterns.

In house analytics to monitor swatch view KPIs

Efforts have been made to design a UX Research Database by identifying the needed fields and workflow.

UX Repo field mapping for Jira

Features Introduced

A recent example would be Flashcards, swatchbook's flashcards offer a "quick reveal" feature, allowing users to access material details without the need for sign-ups or complex navigation. Additionally, flashcards can be easily shared within organizations, teams, or with external partners for efficient collaboration. Overall, swatchbook's flashcards serve as a comprehensive and visually engaging resource for material exploration, enabling designers and professionals to make informed decisions and streamline their material selection and development processes.

A/B testing & usability research was done in collaboration with BRU (a leading global supplier of interior furnishing fabrics and wall coverings), as well as Sunwell try a prototype

Prototypes
Flashcard UI
Mapping out collaboration feature
Line collaboration feature

Plugins & Integrations

A good example would be the swatchbook x Centric integration. This integration allows swatchbook customers who also use Centric PLM to seamlessly connect their digital material libraries and data between the two platforms.The key benefits of this integration include:

  • Streamlined material data exchange between swatchbook and Centric PLM, eliminating manual efforts and errors.
  • Centralized access to accurate, up-to-date digital material information within the PLM environment.
  • Improved collaboration and visibility into material development processes across teams and suppliers.
  • Accelerated product development cycles by ensuring material information is readily available.

By tightly integrating swatchbook's digital material management capabilities with Centric's PLM solutions, fashion and consumer product companies can drive greater efficiency, transparency, and speed in their material selection and product development workflows.This partnership exemplifies swatchbook's commitment to providing an open ecosystem that integrates with other best-in-class solutions, enabling customers to leverage the full potential of digitized materials within their existing technology landscapes.

Try one of the prototypes

Integration Mapping
Integration UI 01
Integration UI 02

Design Services

Design and UX services were rendered across the company functions a good example would be the Service Center Digital requirements card they hand out to textile supplier factories. So instead of a printed PDF, this card provides supplier with access to live requirements that can be updated at any given time.

Designed a streamlined digitization requirements sharing pipeline for swatchbook China

Websites, branding, email templates, campaigns & promotional elements

I designed, executed and maintained the company's websites and promotional elements.

Results

Results

  • Enterprise adoption → Platform adopted by global brands including Nike, Adidas, Puma, H&M, and Victoria’s Secret.
  • Efficiency gains → Reduced sourcing and collaboration cycles from weeks to days through digitization and integrated workflows.
  • System longevity → Design system and language scaled successfully across multiple product launches and continues to govern the ecosystem.
  • User experience → Post-redesign usability studies showed significant increases in navigation efficiency and satisfaction scores.
  • Industry recognition → Featured in publications such as The Interline in partnership with New Balance.

Reflection

Leading design at Swatchbook meant shaping not just products, but an entire ecosystem and culture. What began as the work of a single designer evolved into a full design practice embedded across product, brand, and client experience.

The journey reinforced the importance of balancing vision with iteration: building scalable systems, fostering collaboration across disciplines, and always grounding design in measurable impact for both users and the business.

New Balance x swatchbook case study by the interline

Visit Website

Appstore

GooglePlay