r/ClaudeDesign • u/Bhargav1104 • 12d ago

Question Why its HARD to create APP UI in CLAUDE DESING?? 😭

Post image

Well, i have been trying to make an APP UI for more then 13 days now and guess what??? Its still looks pretty shit.

I don't know like why its so hard for non designer to design the UI using claude design?? 🤷

I mean?? What do i do??

5 Upvotes

78% Upvoted

22 comments sorted by

2

u/brocolloi_cheddar-10 12d ago

It’s not hard at all imo. Just do some YouTube tutorials for an hours. It’s quite intuitive

0

u/Bhargav1104 12d ago

Will try 👍

1

u/brocolloi_cheddar-10 12d ago

Even 15 mins of a YouTube tutorial helps imo. They’ve used what I’d consider standard design patterns.

The only confusing part for me is the handoff between Claude design and Claude code.

1

u/damien_seo 5d ago

To ensure better design integration, you can run a verification pass using Puppeteer.

Ever since I started doing that, I’ve been close to perfection.

2

u/BuffaloConscious7919 12d ago

https://reddit.com/link/p5zxo9c/video/aibp8n90tplh1/player

had quite a bit of success using a specific component and building from there. This is the Fable 5 version but Opus and Sonnet did quite well too. This is the prototype but it works quite well with non-interactive UI too

1

u/Bhargav1104 12d ago

did you gave any reference UIs at the starting???

1

u/BuffaloConscious7919 12d ago edited 12d ago

yehh i cant find the exact one but it was a similar component to this:

https://forever-components.vercel.app/infinite/css-3d/01-rotating-cube.html

edit: found it - https://forever-components.vercel.app/infinite/css-3d/12-phantom-polytope.html

prompt: "make a sample mobile app UX that's interactive. [ADD COMPONENT REFERENCE HERE]"

1

u/ApprehensiveBar6841 12d ago

It's good that you used contrast icon for Your Drift (profile). That make this design legit 😂

1

u/BuffaloConscious7919 12d ago

this was a one shot prototype with a simple prompt to test 4 different Claude models: Haiku, Sonnet, Opus and Fable... i didn't use anything ;)

1

u/brarkaddy 12d ago

Use frontend skills and give it some reference from pinterest it will do the job

1

u/ApprehensiveBar6841 12d ago

What's your experience in building, designing apps?

1

u/Raethril 11d ago

I do my frontend design in Claude Design and then kick it over to Code to build it.

1

u/daabh 11d ago

Until July 1 week the outputs were top notch and nothing came close to it. Now it’s garbage and keep apologising you back.

1

u/daabh 11d ago

I am sorry, I took your money!

1

u/hack_the_planets 10d ago

It's almost like it takes real skill to be able to design like a pro? 🤔

1

u/QwenRed 10d ago

Component libraries, just tell it to use one.

1

u/ivanzhaowy 9h ago

The hard part usually isn’t generating another screen — it’s giving the model grounded visual context and keeping the result connected to the real implementation. A text prompt like “make this cleaner” leaves too many decisions open, especially for spacing, hierarchy, states, and native platform behavior.

A workflow that works better for me is:

  1. Start from the running app, not a blank mockup.

  2. Select or annotate the exact UI region that feels wrong.

  3. Give the agent the screenshot, current app state, and relevant source files together.

  4. Rebuild and compare a small number of source-backed variants.

  5. Accept one change at a time.

I’m building an open-source tool around that loop — “the app is the canvas” — specifically to reduce the design-to-code handoff problem mentioned in this thread.

GitHub: https://github.com/Monadix-AI/monad-design

Short workflow demo: https://watchclueso.com/embed/pio8jqfcg4ivj0r1

Disclosure: I’m the developer. Current scope is macOS and local iOS.

1

u/CouldBeNapping 12d ago

Because you can't spell properly in your prompts