Product redesign and introduction of a design system

Upon joining the company I realized the design was not standardized, style declarations were scattered across the codebase and the product experience was therefore not consistent.

I conducted a design audit and realized we had more than 200 style variables declared, a multitude of colors including at least 30 different shades of grey and at least 10 different button styles.

After this I reduced the color palette and introduced more accessible color combinations. With the palette, font styles and the rest of the foundational elements set in place, I set out to put together a system of components.

Existing components were reused, functionalities adjusted and styles updated. Additionally new components, that were immediately needed were created code first in React with CSS-in-JS. Other components and patterns followed as new product features were introduced.

With the release of the first company wide design system an interactive documentation based on a Next.js website was published internally.