Unify

CASE STUDY · 2025—26

Design System

One language for design & dev.

Co-owned as a Product Design Intern.

One language for design & dev.

Co-owned as a Product Design Intern.

↔

Responsive

1440 → 2560

◫

Scalable

100+ components

⚡

Lightweight

Modes, not variants

Dev-ready

Tokens & handoff

Unify design system for FLAM AI: Design System

Dashboard · 1440

1440 × 1024

Card Background Color

Label

HEX

No Color

2563EB

Cancel

Save

Button

❖ Button

3XL

4XL

Dev

Shubham

modes, not variants

reusable

components

1440 → 2560

Unify design system collage: Flam dashboard with mode switch, colour picker and button component

SHOWREEL · 0:49

01 — THE PROBLEM

Designer said 6.

Developer said 7.

Designer said 6.

Developer said 7.

Designer said 6.

Developer said 7.

Padding, colours and type drifted between Figma and code. Every team rebuilt the same UI — and 2K–4K screens broke the layout.

02 — WHAT I DID

Co-owned Unify with one other designer

Built variables & tokens — 3 tiers

Built & maintained 100+ components

Defined Figma modes for 1440 → 2560

Handoff, edge cases & fixes with devs

03 — WHY MODES

Modes, not variants.

One file switches between screen sizes — no duplicate frames, no redesign, smaller files.

100+

components & variants

605

variables

screen modes

duplicate frames

04 — UP CLOSE

Four components, up close.

Button

340 variants. States, sizes and styles from one component.

5 styles

5 states

4 sizes

Color Picker

Custom-built. Hue, palette, hex and live preview stay in sync.

Custom

Tokenised

Calendar

Range selection with real date states. Date, month and year views.

8 states

3 views

05 — DESIGN → DEV

One source. Handed off in Supernova.

Tokens and component docs synced from Figma to Supernova. Devs built from the same source — and every redesigned screen uses it.

Figma

Unify library — tokens, variables, components

→

Supernova

Token sync + component docs for devs

→

Development

Built in parallel from the same tokens

→

Product

Redesigned dashboard, every screen

Unify design system for FLAM AI: One source. Handed off in Supernova.

WHAT’S NEXT · IN PROGRESS

Rebuilding Unify for the AI era.

Rules, skills and modes that Claude can read — so AI-built UI stays on-system.

New Update — COMING SOON

Thanks for reading.

mestryshubham8@gmail.com · linkedin.com/in/shubhammestry

More case studies

01 · VeerTurning running into a real-world story game.

03 · Docroach1990s clinic software, rebuilt as a modern EHR.

Back

Unify

Unify

Modes, not variants.

Four components, up close.

Four components, up close.