When I joined Greenlight, I started off working on a product feature team but quickly saw the need for a design system. Here is a quick overview of what I was working with…

Overview of components in initial design system

In Figma, it looked ok.
In the production app, another story.

Screenshots of production app views — Screenshots from various areas in the app that were live in production.

Clearly we were a little inconsistent.

Buttons of all shapes and sizes. If we were inconsistent with our primary action buttons, I can’t even imagine the can of worms I was about to open.

Why do we need a design system?

Product designers and developers can create and build a consistent user experience across our entire app.

Product designers and developers can design and develop new features quicker.

Releases are less error-prone when leveraging “tried and true” component from a code library.

Whenever it is justified to design and build a “new” component, it can be designed and built according to the design system rules/guidelines and then added to the system for all teams to use.