Recreating a living Design System in Sketch

Our never ending journey to improve workflow and collaboration

carwow has recently experienced quick growth. In building and evolving our product, we have found it’s important to find ways to communicate to everyone in regards to design.

From the very beginning, the team created a live online styleguide, it enables our development team to move faster. Problems arose when carwow’s Design Team didn’t have anything similar set up in Sketch, our design tool of choice. As a team we found that designers wasted a fair amount of time by producing designs by copying and pasting elements from other files. To help establish a quicker workflow and bring design consistency to the product, we embraced the power of Sketch in creating components as symbols.

The beginning

First step was to put in place a plan of action to tackle the problem. Our response was to create a Sketch file made up of components which mirrors the live styleguide.

The framework focused first on primitive elements such as basic typography, colour and layout. Moving onto more complex components once we had converted and created the whole live styleguide into reusable Sketch symbols. Easy-peasy right?