The most significant obstacle I faced was that our product had already been built with no foundation for a design system so there weren’t guidelines set for engineers or other team members to go off of for any feature being built.
Previous Sketch style guide
The engineers had global components on their end for elements they were accessing, but design didn't have anything to match that. This resulted in inconsistencies between the design file and what gets handed off to engineers.
In my opinion, the power that Figma holds for setting global and local style guides I find unmatchable to any other tool out there.
I spent the first couple of months doing inventory of the files sprawled out between Sketch, InDesign, Photoshop, and Illustrator and then recreating common components into Figma, and finally, transferring the design files over.
The way I approached it was to create every component of our product in Figma based on what the engineers had built in production.
Once a style guide was set in place, it was all about implementing and maintaining.
Since then, anything I put into designs was consistent with production, new components are made for new features, inputs, or states, and the file is also the source of truth for anyone to access up-to-date designs.
I also implemented the new Figma auto layout and variants feature to make it easier to switch between use cases and states.
It seems unnecessary to build out this comprehensive and detailed design system if I am the only designer but there were a few reasons for it:
I worked for a year and a half to ensure it was maintained with system updates, added more accurate guidelines, and worked to transform it to a more flexible and comprehensive system.
As we grew, I tried different ways to organize it within the Figma file, use new Figma features such as auto layout and variants, and a more clear way to communicate it to engineers.
I was consistently adding new components and improving old ones based on new features or product changes. Design systems should be a living breathing document and that was the long term goal with this system.
This was my first system I built from scratch to be a flexible and approachable design system for the entire team.
A global style guide is absolutely necessary if you have multiple designers but if you are the only one, it won’t be useful for anyone else unless you create an external resource to reference.
Check out the external zeroheight resource that was accessible for the team to access when they needed anything.
Next items on backlog: