Brief IA

AI Designers: From Figma to Code with Claude Design

🛠️ AI Tools·Tom Levy·

AI Designers: From Figma to Code with Claude Design

AI Designers: From Figma to Code with Claude Design
Key Takeaways
1At Amplitude, a designer reports transitioning from Figma to HTML prototypes coded with Claude, followed by code deployment.
2Jenny Wen (Anthropic) claims that the "Source of Truth" in design is becoming the product itself.
3Claude Design is presented as better suited for visual polishing and allows for juxtaposing iterations.
💡Why it mattersAccess to code, described as the core of a "native to AI" workflow, allows for refining details that, when combined, produce a more polished experience and guide continuous implementation.
Le brief IA que lisent les pros

Le brief IA que les pros lisent chaque soir

Les 7 actus IA du jour, décryptées en 5 min. Gratuit.

Inclus dès l'inscription : notre sélection des meilleurs guides & comparatifs IA.

Choisis ton rythme

Gratuit · Pas de spam · Désabonnement en 1 clic

📄
Full Analysis

A designer at Amplitude describes how she moved from Figma screens to vibecoding HTML prototypes with Claude, before directly shipping code. Her goal: to make the product the "Source of Truth" for design, an approach that Jenny Wen (Anthropic) now says is central. This account details methods, limitations, and what EPD organizations need to implement to enable non-engineers to ship PRs.

The product becomes the "Source of Truth" and code takes precedence

The designer reports that despite rapid advancements, she had no "Source of Truth" in design, to the point where she couldn't indicate where to find the latest screens of Agent Analytics. The solutions tested, from hybrid Figma captures to HTML exporters, were either too rudimentary to qualify as final deliverables or too rich to stay updated, and the most polished mockups quickly diverged from the live product. During a sharing session, Jenny Wen explained that Anthropic was completely rethinking the process: the triptych discovery → mockup → iteration corresponded to a time when building was slow and costly. She clarified that her team is now focused on how to shape implementation and product direction using a combination of tools, and that the "Source of Truth" in design is becoming the product itself. The designer drew an operational conclusion: for this source of truth to be genuinely designed, it must ship real code. In her view, being "AI-native" primarily means delivering one's own designs and making them excellent.

At Amplitude, a designer transitions from PRs to interface management

At Amplitude, this designer recently joined a 0–1 team to design Agent Analytics, presented as a new observability and assessment platform. She had never shipped a PR before and claims to now be almost solely responsible for her team's interface. The team was building the product from scratch, with no existing Figma files to leverage, while engineers were delivering new features multiple times a day. Not wanting design to become a bottleneck, she aimed to influence the product direction in real-time: vibecoded prototypes allowed her to keep pace and concretely guide what engineering was building. She indicates that it took her a long time to reach this point, with support but without a manual at the time, to the extent that she added a short glossary to her account. Her mentor, Tyler Wanlass, encouraged her to move away from traditional tools and embrace AI.

Prototyping with Claude: clickable HTML and daily iterations

Her first breakthrough came from an artifact coded by Claude: instead of Figma screens, she vibecodes clickable HTML prototypes. Each day, these versions are shared, commented on, modified, and then returned to the team before the end of the day. To explore small UX details, she asks Claude to simulate 3 to 5 variations of components instead of rebuilding complete screens. This ability to quickly simulate interactions allows for precise exploration of user flows. The author initially believed it would be impossible to accurately describe changes without manually tweaking each component, only to find that a reservoir of UX templates accumulated over the years enabled her to effectively guide the agent to generate the envisioned visuals with just a few prompts.

How far to go without Figma: simplicity, limitations, and Claude Design

The advice given is radical yet targeted: close Figma for a week to attempt the switch, without suggesting abandoning it forever. The author states that she no longer uses it at all for product design and believes it is necessary to break away from the old routine. She did try to move quickly in Figma and feels very comfortable with the tool, but keeping pixel-perfect mockups updated proved untenable, and even rough mockups seemed slow in the face of complex and shifting flows. She observes that early mockups perform better when they remain simple and visually unlinked to the actual design system. According to her, refining visual detail is not AI's strong suit: achieving "ninety percent" of a mockup is much easier than getting the last "ten percent," which requires weighing whether that polishing is worth hours of frustration. A few months later, Claude Design — whose launch is mentioned at Anthropic — turns out to be somewhat better at managing this polishing, especially after configuring design system preferences. The designer now says she works in low-fi or hi-fi as needed, always via Claude Design, with the ability to juxtapose multiple iterations of the same screen on a canvas and even produce HTML product images for the website. She emphasizes that new tools are released every day and that one must continuously adapt their process, citing the AI Design Field Guide as a useful resource.

In San Francisco, the pressure from "AI-native" teams intensifies

Roles are evolving significantly in tech, and in San Francisco, this transformation is reportedly felt more intensely. It is reported that every company is seeking to build an "AI-native" team, with an explicit demand: optimize workflows, multiply productivity by 10, and "ship the future." On the ground, the prevailing discourse appears contradictory: pressure to use more — or fewer — tokens, assertions that Figma is outdated then "back" after a Config presentation, agents presented as the future but also described as needing design skills, a LinkedIn feed saturated with low-quality content, and engineering that continuously ships, PR after PR. Slogans go as far as "taste is paramount" and "design is dead." In the face of this noise, the author says she spent the past year seeking answers, without claiming to have them, and advocates for sharing learnings at the community level.

Access to code: details, experience, and conditions to achieve it

According to the account, accelerating production is not enough: access to the codebase allows for refining interactions and visual details that may be imperceptible in isolation but, when combined, create a polished software experience. Shipping code also opens up the addition of interactivity, responsiveness, and moments of delight; with AI, making these interactions enjoyable would be easier than before. According to this feedback, building has become more accessible in the AI era, and any designer can, with a bit of practice, learn to modify the frontend and ship PRs. The major obstacle lies less in the technique than in support and access: the author works in an EPD organization that has invested to enable non-engineers to ship code, while noting that access to tokens, learning resources, and technical support varies by team. She mentions peers who obtained similar rights after seeing that it worked, reminding that often it only takes one person to kickstart the momentum, and that once a first PR is merged, there is no turning back. Among the concrete levers put forward to advocate for access to code is sharing examples of designers who are already shipping code.

Brief IA — L'actualité IA en français

L'essentiel de l'actualité de l'intelligence artificielle, décrypté et expliqué chaque jour.