Figma Standardization Guide

A shared system to keep Figma files clean, consistent, and scalable
A shared system to keep Figma files clean, consistent, and scalable

Summary

I standardized how Figma files were organized across 6+ teams at Dell.

I created a scalable guide—thumbnails, statuses, changelogs, and flow structure—so everyone could navigate, review, and ship faster. The system is now the default template used org-wide.

The Problem

Each design team at Dell had its own way of organizing work in Figma.
There were no shared standards, which made it harder to:
  • Navigate files across teams

  • Collaborate with PMs and engineers

  • Maintain clarity as designs scaled

It was slowing teams down — and wasting design time on avoidable mess.

My Role & Approach

I led this effort from research to rollout—interviewing teams, mapping patterns, and designing a scalable playbook for Figma file organization.

What I did:

  • Interviewed designers across orgs to identify pain points and habits

  • Audited existing files to extract common structures and failures

  • Created a repeatable system for naming, organizing, and labeling

  • Documented the guide in a flexible format anyone could follow

  • Tested with edge cases and gathered feedback for iteration

What I Created

I created a shared visual system that made every Figma file easier to navigate—whether you were a designer, PM, or engineer. Each file followed the same structural rules, labels, and visual indicators.
Page Structure

A consistent file structure helped everyone find what they needed, fast. Files followed the same layout: overview → flows → components → archive.

A consistent file structure helped everyone find what they needed, fast. Files followed the same layout: overview → flows → components → archive.

File Thumbnail

The first page of every file had a visual thumbnail with a title and ticket number. This made it easy to scan in Figma’s file browser.

The first page of every file had a visual thumbnail with a title and ticket number. This made it easy to scan in Figma’s file browser.

Ticket Cover

The first page of every file had a visual thumbnail with a title and ticket number. This made it easy to scan in Figma’s file browser.

The first page of every file had a visual thumbnail with a title and ticket number. This made it easy to scan in Figma’s file browser.

Why it worked:

Why it worked:

Why it worked:

  • Eliminated guesswork around scope and ownership

  • Made design reviews faster

  • Helped new team members onboard into ongoing projects

Status Indicator

We introduced clear status tags like “Ready for Dev,” “WIP,” and “Review Needed.”
These made it obvious which flows were finalized—and which still needed eyes.

We introduced clear status tags like “Ready for Dev,” “WIP,” and “Review Needed.”
These made it obvious which flows were finalized—and which still needed eyes.

Status Section Bars

Each major section had a bold, visual status bar showing its progress:
Ready for Dev, Design WIP, Design Review, Archived, or Feature Definition.

Each major section had a bold, visual status bar showing its progress:
Ready for Dev, Design WIP, Design Review, Archived, or Feature Definition.

Benefits:

Benefits:

Benefits:

  • Gave instant visibility into design progress

  • Made it easy to review only what was finalized

  • Reduced confusion during dev handoff

  • Gave instant visibility into design progress

  • Made it easy to review only what was finalized

  • Reduced confusion during dev handoff

Flow Titles & Descriptions

A standard layout for naming and describing design flows.
Each frame began with a clear title and short summary, making it easy to understand what the screen was for and how it fit in the bigger picture.

A standard layout for naming and describing design flows.
Each frame began with a clear title and short summary, making it easy to understand what the screen was for and how it fit in the bigger picture.

Used for:

Used for:

Used for:

  • Labeling user flows or feature areas

  • Grouping related screens

  • Guiding PMs and engineers through complex files

  • Labeling user flows or feature areas

  • Grouping related screens

  • Guiding PMs and engineers through complex files

Change Logs

To track iteration, I introduced a flexible changelog component embedded in each file.
Color-coded by contributor, it helped teams quickly scan for updates and know what changed, when, and by whom.

To track iteration, I introduced a flexible changelog component embedded in each file.
Color-coded by contributor, it helped teams quickly scan for updates and know what changed, when, and by whom.

Impact:

Impact:

  • Aligned design and PM teams during async reviews

  • Improved accountability

  • Made historical context easy to trace

Impact
  • Standardized design file structure across 6+ teams

  • Made Figma files easier to navigate for PMs, engineers, and new designers

  • Reduced onboarding time for new designers and contractors

  • Helped design leads review work faster and give clearer feedback

  • Playbook is now used as the default template for all new features across orgs

  • Enabled async collaboration by improving clarity and reducing ambiguity