Catylist had 12 developers and an ecosystem of several websites and apps, but they had never had a design system before.
I knew a design system would:
Provide design consistency.
Give the team a shared vocabulary.
Improve maintainability and productivity with the design and code.
Give us a way to examine and improve modular pieces of the UI.
So I pitched the idea and was given permission to work on it. The goal was to create an effective system that matched the brand and increased designer and developer productivity, and then document it for everyone's reference.
I met with several stakeholders to make sure we were aligned on the branding and general business requirements. I built a sound understanding of the type of impressions we wanted to make as a brand, as well as business goals of a system like this, which informed the rest of the process.
Then I performed with an analysis: researching competitive design systems, recording common pieces of UI we already used regularly, and figuring out what kinds of components would make the developers' work easier. This helped me develop the list of components I'd need to work on.
Over a few weeks, I took the information I had gathered and built out each piece of the system one by one using HTML and CSS. I worked closely with my product manager and a couple of developers along the way to make sure I was staying on the right track.
After building all the components, I created a website that the team could use for reference. This site included every component broken down by category, with notes on how and where to use them, and the required HTML and CSS.
The product manager and developers were very impressed with the new system and appreciated how much more productive it made front-end development. It also clarified my own work and made things more consistent. I noticed over time that every adopted a shared vocabulary for how to talk about the UI, and maintainability was much easier.
After applying this updated styling across all websites and apps, the branding and product lineup felt much more cohesive and thought out.
And of course, a design system is never finished. I continually adjusted and added to it throughout my time at Catylist.