Work / Design System

StandOut UI — Design System

My own design system, built in my spare time. Twenty years of best practice poured into one Figma library, on its way to becoming a Webflow component kit anyone can build with.

Background

StandOut is my own design system, built in my spare time, and it’s where everything I’ve learned doing this professionally gets poured. The ambition is a “full-fat” solution: a complete Figma library first, then a Webflow component kit that lets anyone assemble feature-rich websites without fighting their tools.

That’s the end game. Here’s how it actually gets built.

The brief

Use the full suite of what Figma offers, properly:

Then carry the exact same variable structure and naming conventions into the Webflow template, so the two platforms stay in lockstep.

The work

Everything starts with the component audit, and I won’t pretend it’s glamorous. You go through every component that exists or needs to exist based on the user journeys and wireframes, then group the lot.

From there it’s atomic design. Break each component down to its core elements, text and iconography at the bottom. But before building a single component, I set the variables. My rule of thumb is to define values for:

Components built on that foundation update in minutes when a token changes. Components built without it update one screen at a time, forever.

Then comes documentation: guidelines that break each component into small identifiable chunks, so a designer meeting the system for the first time can teach themselves. And finally stress testing — device testing and deliberately pushing each component past its intended use, because the failure you find before launch is the cheap one.

Maintaining a system is its own discipline. I structure components so new features can be added and tested with minimal impact, with mandatory testing and documentation on every update. The best release process I’ve run pairs that with a voting forum where designers suggest and upvote features, shipped in weekly pushes.

The result

StandOut hasn’t officially launched yet, and honestly, the building is half the point. It’s my laboratory. It’s where I experiment with new Figma features, refine my process, and stay sharp as a design system specialist between client engagements.

Design systems are the corner of this industry I get genuinely evangelical about. If you want to talk through my process in more detail, I’d enjoy that conversation.

Like what you see?

Let's talk