Jay Kim

Don't Be a Figma Mockup Slave

Designers in most tech companies hand down high fidelity UI mockups, built in Figma, to the developer to be implemented. From what I've seen, the best UI developers are the ones who treat their relationship with their designer as a two-way street. They offer feedback and suggest alternatives. Importantly, they reveal the API constraints of the design system and push back if what has been mocked up is not possible with whatever system of design that has been agreed upon between the developer and designer.

This push back needs to happen for there to be a healthy iteration loop that feeds back into improving the design system. The designer needs to be made aware of the decision and tradeoff of either evolving the design system or doing a custom job. An occasional custom job might be fine, but if there's too many, the developer needs to convince the designer of benefits of sticking to a system and improving it. Unfortunately, I feel the perception of frontend code among many developers is that it is adhoc work with tons of arbitrary decisions. There has always been an undercurrent of thought that frontend is not 'real engineering'. Perhaps this is just my imposter syndrome coming through. I believe UI engineers also fall victim to this thinking too as it can be attractive to get stuck in some flow state pushing pixels around, but we need to push back on this notion and offer to both the designer and other developers that UI can be built in a systematic way akin to any well designed back end system.

Unfortunately, I feel that some developers do not have the confidence or concern to have this kind of relationship with their designer. I often see devs throw up their hands with phrases like "I'm not a designer" or "I defer to design" when asked their opinion about UI design. This kind of mentality - being a slave to the Figma mockup, can be harmful to the product. Not letting the designer know that this is a custom job and doing the custom job can eventually result in layers of CSS rules and hardcoded constraints that implicitly depend on each other. Over time, you will be doing archeology on the layers of weird CSS rules that are built on top of each other. The other devs on your team will become too scared to touch UI code as small changes start to have 2nd order effects. The UI starts to feel janky and inconsistent over time.

Designers, by their nature, are inclined to think about the aesthetic side of design and can neglect how their drawings actually manifest in the real design system as their Figma canvas has no constraints. Developers however are inclined to think about implementation design. The two sides working in concert and feeding back with each other is what produces long lasting, good design. When you have a designer and developer who recognize this dynamic, or a design-engineer or designer who can code, you have something special that you should try to preserve.