August 16, 2023

Start with naming

The first steps of collaboration between design and engineering teams are often quite delicate, in my experience. Designers assemble well-made Figma libraries. Engineers build out well-engineered applications. But what does it actually look like to work together?

In most orgs, each team has their own requirements and deadlines. This disincentives collaboration, because it introduces external risk. There’s often a decision-making Mexican Standoff. Does design provide design requirements first? Does engineering provide technical requirements first?

This can result in… well, nothing. Nothing getting done. Nothing getting decided. Until finally someone decides and does something, but it’s usually last minute and hardly looks like consensus.

If you’re in the aforementioned standoff, here’s my advice:

Start with naming.

If design is ahead of engineering and has put a lot of thought into naming components and their various props or states in their visual prototyping tool, engineering can benefit from that work and incorporate those naming conventions into their codebase (and provide useful feedback for improvement).

If engineering is ahead of design and has put a lot of work into building out a set of named components, props, classes, etc., design can benefit from that work and incorporate the naming into their design tools (and make better / more informed recommendations.)

Naming is a great place to start because it usually doesn’t require much work to make changes. If your design team calls the component for selecting a different site translation a “Translation Dropdown,” but your engineering team calls it a “Language Selector,” it’s easy for your design team to update the name in their Figma component.

And collaboration around naming requires hardly any tools. You could do this in a Google Doc, where anyone with a browser can contribute. This ensures early buy-in from all stakeholders.

Think of this like a pilot program for team collaboration.

Once the teams have met and decided on some unified naming conventions, that opens the door to more advanced future collaboration, like representations of key engineering components in the design tool or integrating design tokens into the codebase.

—
Cheers,

Up Next: Demonstrating expertise in design systems

← Full Archives