Zenith Design System

Role:

UX/UI

Strategy

Tokens

Design

Project Date:

2024—2025

There’s something special about discovering a hidden-gem event.

BACKGROUND

BACKGROUND

BACKGROUND

BACKGROUND

World of Good Brands is home to multiple digital publications, including Well+Good and Only In Your State, each with its own distinct visual identity, audience, and content strategy. While this diversity is a strength, it also posed a major design and development challenge—every brand operated with fragmented design assets, inconsistent UI patterns, and duplicated efforts across teams.

To solve this, we built Zenith—a scalable, multi-brand design system in Figma, powered by design tokens via Tokens Studio. This system provided a single source of truth, allowing teams to design and develop experiences faster while maintaining brand differentiation and consistency across products.

Goals
Goals
Goals
Goals
Challenges
Challenges
Challenges
Challenges

PATTERN & LAYOUTS

PATTERN & LAYOUTS

PATTERN & LAYOUTS

PATTERN & LAYOUTS

Identifying the Need

PROCESS

PROCESS

PROCESS

PROCESS

Before Zenith, design explorations across Well+Good, Only In Your State, and other brands were inconsistent, inefficient, and difficult to scale. We solved this by translating each brand’s visual identity into a structured system of typography, color palettes, iconography, spacing, grids, motion, and accessibility standards, all managed within Figma Libraries and Tokens Studio.

This provided:

• A single source of truth – every brand’s visual attributes were centralized, eliminating inconsistencies and redundant styling.

• Effortless updates – branding changes could sweep across the entire system in real time.

• A collaborative design approach – brand teams had direct input in shaping their digital presence without disrupting UX cohesion.

BUILDING CORE COMPONENTS

BUILDING CORE COMPONENTS

BUILDING CORE COMPONENTS

BUILDING CORE COMPONENTS

Once brand toolkits were established, we developed a foundational library of UI components that could be themed and adapted to multiple brands. These included:

• Buttons, inputs, dropdowns, navigation bars, and interactive elements, each designed with atomic-level consistency

• Tokens Studio integration, ensuring all visual treatments were converted into semantically named design tokens, creating structural parity across brands

• A scalable, adaptable foundation for all future product explorations, making UI updates fast and frictionless

SCALING WITH PATTERNS & LAYOUTS

SCALING WITH PATTERNS & LAYOUTS

SCALING WITH PATTERNS & LAYOUTS

SCALING WITH PATTERNS & LAYOUTS

With a solid foundation of tokens and components, we moved into higher-level UI structures, developing:

• Complex, purpose-driven patterns such as affiliate-driven content modules, map-based discovery, search functionality, and homepage frameworks

• Reusable product layouts that could be quickly adapted to different brands, campaigns, and content needs

• A catalog of product capabilities that made it easier for stakeholders to visualize MVPs and prioritize future roadmap initiatives

Project Highlights

BRAND TOOLKITS FOR CUSTOMIZATION

BRAND TOOLKITS FOR CUSTOMIZATION

BRAND TOOLKITS FOR CUSTOMIZATION

BRAND TOOLKITS FOR CUSTOMIZATION

Each brand maintains its own unique aesthetic while leveraging a shared design foundation, making customization easy without reinventing the wheel

SCALEABLE COMPONENTS

SCALEABLE COMPONENTS

SCALEABLE COMPONENTS

SCALEABLE COMPONENTS

Our core component library allows for faster builds and seamless UI updates, ensuring consistency across brands while reducing design and development time

EFFICENT TOKENS

EFFICENT TOKENS

EFFICENT TOKENS

EFFICENT TOKENS

By implementing Tokens Studio, we established a structured, scalable token system that allows for real-time updates and effortless theming, making cross-brand design work smoother than ever

GAME CHANGER FOR DESIGN & DEVELOPMENT

GAME CHANGER FOR DESIGN & DEVELOPMENT

GAME CHANGER FOR DESIGN & DEVELOPMENT

GAME CHANGER FOR DESIGN & DEVELOPMENT

Zenith transformed the way teams worked, reducing design inconsistencies, streamlining production workflows, and improving cross-brand collaboration

Lets talk

Don’t be shy, say hello—I'm always happy to chat: amberleefayee@gmail.com

Lets talk

Don’t be shy, say hello—I'm always happy to chat: amberleefayee@gmail.com

Lets talk

Don’t be shy, say hello—I'm always happy to chat: amberleefayee@gmail.com

Lets talk

Don’t be shy, say hello—I'm always happy to chat: amberleefayee@gmail.com