I replaced Figman with Claude Design for iteration, but I still need it for one critical task


Figma is something I’m still learning and not 100% fluent in, so dropping the ship to another tool entirely wasn’t really on the table. That doesn’t mean I’m not testing other options, and I’m probably just as curious as many of you. vibe coding tools lately. They’re primarily meant to make both design and coding more accessible to people who can’t do it, but there’s also something satisfying about watching your idea come to life with a few natural language suggestions.

So when Anthropic launched Claude Design a few weeks ago I was ready to like it. What makes Claude Design more interesting than your average vibe coding or prototyping tool is that it’s actually a bit of a hybrid. It generates designs from natural language suggestions, but it also gives you a small set of actual design controls to play with after the fact. But it still doesn’t replace Figma for everything…

Want to stay up-to-date on the latest developments in artificial intelligence? The XDA AI Insider newsletter drops every week with deep dives, tool tips, and hands-on coverage you won’t find anywhere else on the site. subscribe by change your ballot.


claude code and macbook image

I used Claude Code, Google Antigravity and Codex for a month and I have a clear winner for you

Searching for the perfect coding assistant

Claude Design really nails what

Usable speed is hard to beat

claude design mobile layout screens

What I appreciate the most Claude Design you can do start without knowing what you really want yet. So I can open it with a vague idea, describe its vibe, and it gives me something to react to or appreciate within seconds (sometimes minutes if it’s a few screens). It’s a completely different starting point to opening up a blank Figma canvas and trying to realize a plan from scratch – which can feel like the hardest part of the whole process when you’re still learning.

claude design tweaks

But where it really shines is something called Tweaks. After each generation, Claude spins contextual edit controls and sliders specific to whatever he just did. These can include custom color palettes, font weights, spacing, padding, corner radius, or anything else that the layout deems worth adjusting. That way I can fiddle with tweaks without reprogramming, which means I’m not burning as many tokens or risking Claude changing something I really liked in a previous iteration. I said before that it feels legitimately like a design tool within another design tool.

I also like that I can request two or three layout changes in one shot, sketch directly on the canvas with Draw as a reference, or drop a screenshot of an app I like and have a Claude draw structure from it.

But nothing can really be poked at at Claude Design

Direct manipulation is still Figma’s home field

Yes, an editor that lets you edit things is the most obvious requirement on the planet. But that’s the line that separates an actual design tool from a vibe coding tool that produces designs, where most of the time you save is eaten up on the back end. You can change the background color, font family, font size, click on any element to see its properties, sliders for padding or corner radius, etc. in Claude Design. as you will find enough control.

But its biggest limitation is that none of the controls actually allow you to move elements around on the screen. I can change what something looks like, but I can’t drag it 10px to the left or move it to another location in the layout. To move something, I have to go back into the conversation and suggest it, which means describing in words something I can do in half a second with click and drag. There is no guarantee that it will maintain the integrity of the entire structure after I bid again.

It may sound silly and obvious, but manual control over elements is non-negotiable when it comes to design. And Figma reigns supreme in this area, and so is still where the design is done.

Once the presentation is about right, work moves on to features that are generally absent from Claude Design. There’s AutoLayout to automatically manage response spacing, Constraints to tell elements how to behave when the frame resizes, and Components to keep the pattern of each button or card consistent across screens. These aren’t fancy additions, they’re the difference between a static layout and a design that actually stops when something changes. None of this is rushed (I mean, technically, if you wanted to write a detailed instruction with every element size and behavior, you could, but that kind of defeats the purpose of designing a vibe).

Figma is basically the last half of the design, and without this manual control, something will always break the visual hierarchy or user flow.

Prototyping is where it becomes more important. Claude Design can turn a static mockup into a fully interactive prototype – like CSS animations, hover states, even 3D effects. But you can’t close streams yourself. In Figma, I can draw an arrow from one frame to another and determine exactly what happened on the click, where it went, and how it went. At Claude Design, interactivity is created for me, and if I want a different flow, I suggest and hope again.


quant-ux on desktop, lego and lightbulb on view

I found a free, open source Figma alternative and kept finding reasons not to go back

It does what Figman can’t

There is no need to choose a side anyway

Just use them together

Claude Design is still in beta and is pretty impressive so far. Meanwhile, Figma has been holding its own for years, so why not Use it to fill in the gaps of Claude Design? Claude Design for exploration, Figma for production.

The easiest version of this workflow is to take a screenshot of a rough Figma wireframe, paste it into Claude Design with a “use this layout but make it feel more fun” alert, and manually drag the ideas I like back into Figma. I have been doing this for a while and it works without any installation.

The bigger question was, would I actually be able to get the Claude Design project from Claude Design and as editable layers in Figma? The export menu has options for PDF, PPTX, .zip, standalone HTML, export to Canva and export to Claude Code – but no native “Export to Figma”. But you still have options…

After a few false starts with HTML and zip exports, I landed on html.to.design. Figma plugin Chrome extension. Capture the Claude Design preview, download the file and drag it into the plugin. And that’s it. It appears as a fully layered frame in Figma and everything is editable. Now I can finish my vibe-coded designs in Figma with hand precision.


claude design vibe coding software on desktop computer with lego and lamp in view

I tried Claude Design, Replit and Figma Make for UI design and one is miles ahead

Three very different vibe-encoding tools at the same speed

Figma is still a valid design tool, but why not use them together to fill each other’s gaps?

Claude Design is definitely one of the more interesting design tools I’ve used. It’s a prototyping tool, a kind of vibe-coding tool, a kind of design tool… a little bit of everything. However, it is not a replacement for Figma. Maybe Figma Make is a substitute for creating stuff with suggestions, but it can’t do what Figma does by a long shot. I don’t think it’s necessary because you can use them together. Claude for practice, Figma for putting everything together and creating an accurate, working prototype.

cloud

OS

Windows, macOS

Individual price

A free plan is available; $17/month Pro plan

Group prices

$100/month per person for the Max plan




Source link

Leave a Reply

Your email address will not be published. Required fields are marked *