-
AuthorCélio Pires
-
Published2024
-
CategoryDesign Systems
Working with engineering
Design systems only work when design and engineering move in the same direction. On projects like Bitloops, Clutch and Metallicus I learned that early alignment saves everyone time.
Early alignment
Design systems only work when design and engineering move in the same direction. On projects like Bitloops, Clutch and Metallicus
Mapping Figma to code
I usually started by sitting with the engineering leads to map how Figma should behave in code.
We aligned on:
• naming conventions
• component states
• constraints and layouts
• variant structures
Nothing glamorous, just clarity. This upfront work meant components translated cleanly from design to code without confusion or rework.
Component specs
Even when teams didn't use Storybook we still made predictable component specs.
Every component came with:
• clear usage guidelines
• behavior rules
• edge cases and states
• accessibility requirements
The goal was always the same: engineers could rely on the specs to build without guessing.
Documentation
Zeroheight helped with documentation and Jira kept things tidy.
Documentation wasn't just about showing components. It was about making sure engineers knew when to use what, how components behaved, and what to do when something didn't fit.
Clear docs meant fewer questions, faster implementation, and less back-and-forth.
Process
Jira kept things organized and tracked.
We used it to:
• track component requests
• manage updates and changes
• document decisions
• keep everyone aligned
Simple, but it kept the system moving forward without chaos.
Trust and collaboration
Engineers always had space to challenge decisions. If something felt heavy or confusing we fixed it together. That's how trust builds.
When an engineer said "this doesn't make sense" or "this is too complex" I listened. Sometimes the design needed to change. Sometimes we needed a different approach. The system wasn't just my vision — it was ours.
And when engineers trust the system it becomes part of their workflow instead of something they avoid. They start suggesting improvements. They become advocates. They help keep it alive.
What I learned
Design systems only work when design and engineering move in the same direction.
Early alignment saves everyone time. Clear specs prevent confusion. Trust makes the system real.
When engineers trust the system, everything else is easier: implementation, maintenance, evolution. The system becomes part of how the team works, not something they work around.
Latest Articles
Insights and learnings from building design systems across different products and teams.View all articles
