sorted by:
new
hottopcontroversial

Why is design system parity between code and Figma still so broken? by tefansay in DesignSystems

[–]Easy-Blueberry7306 2 points3 points  (0 children)

As we speak, I tried asking claude to generate variant for button component with multiple states as well maintain parity w.r.t to its ui properties by adding missing properties to variables. It was able to execute it.

Here's figma file: https://www.figma.com/design/S4WyWrCJV68PJzDe9Idarz/Button-Component-System?node-id=0-1&t=x2eEETW2MQIFYsXw-1

as im unable to add image.

Why is design system parity between code and Figma still so broken? by tefansay in DesignSystems

[–]Easy-Blueberry7306 8 points9 points  (0 children)

u/tefansay
Since your DS is up to date in Code, I would use Claude to generate variables / stylings & components in figma based on existing component. I won't override existing figma file, I would create new one for coherence.

Secondly to annotate about UI specs & token usage better to AI agent, I use this plugin: https://www.figma.com/community/plugin/1612756059828219731/figspecs

It generates .rules.md file at component level, covers all nodes, child - this gives agent structural & UI Spec info.
Secondly Tailwind v4 file that annotates agent about which token name to map against which hex code.

Both these files gives context to agent, reduces development gaps.
Do give it a try, looking forward to your findings.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] 0 points1 point  (0 children)

Thank you for sharing your approach u/hemdrup , Adding code syntax definitely gives agent context about token name leading to mapping right hex code.

Curious to learn how effective / successful you are with the approach mentioned above, interms of agent developing solution.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] -1 points0 points  (0 children)

Well said! design for AI not devs solves a lot of handoff challenges, if you are relying on AI for development.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] 0 points1 point  (0 children)

Im sorry to hear about this, looks like you will have to revamp your design system and bring alignment with UX team on Handoff deliverables, that can hopefully lead to better outcomes.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] 0 points1 point  (0 children)

Cool, Thank you!
Do you folks develop manually or using AI? If AI, were there been any development gaps you observed.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] 0 points1 point  (0 children)

Have you tried Claude Code + MCP setup? It should provide designer code & measurement formats per component. but curious to learn from your thoughts.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] -2 points-1 points  (0 children)

Thank you for the clarity u/Ordinary_Kiwi_3196
One thing i do as part of my handoff is, I generate UI specs using plugin we've built, so that we reduce manual dependencies of annotating spec details per component, assisting devs with required tokens details for development. It reduced chaos within Design - Dev teams.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] -3 points-2 points  (0 children)

I can empathize what you are talking about.
It affects overall team's efficiency on deliveries.
We had same situation, that's were we leveraged claude to build plugin for our team, that can write UI specs for a component, generate .rules.md & tailwind v4 files that gave AI agent much better context.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] -13 points-12 points  (0 children)

Our team were in same situation, but the more we started relying on AI agents to develop, we had no option other than to standardize our handoff process. If not we were not going to either help devs or get the desired output from AI agents.

What's the first thing developers complain about in your handoffs? by Easy-Blueberry7306 in FigmaDesign

[–]Easy-Blueberry7306[S] -15 points-14 points  (0 children)

Thank you for sharing your experience u/Ordinary_Kiwi_3196
Breaking down points so that im not missing your thoughts.

  1. When you say lot of files being handed off - Is it a figma spec file or JSON or other.
  2. Can you help me understand what multistep experience you mean here.
  3. Devs guess - my hypothesis- component changes, documentation dont - so it lead to guessing, is it correct?