Skip to main content

How I Build UIs with AI

Updated 1 min readMarkdown

A lot of people say UI work is difficult with AI, so I wanted to briefly share how I do it.

My workflow is:

  1. With $design-ui, the AI uses imagegen to create a mockup and asks for my approval.

  2. With $add-issue, it attaches the approved mockup and prompt to an issue.

  3. With $slop-fix-batch, it implements the issues in parallel.

The attached screenshot shows the AI presenting an imagegen mockup and asking for approval. Here’s the prompt I used, translated from Korean:

I want to add appropriate animations to each screen in DeliDev. For each screen, $add-issue

The skills are in kdy1/kdy1-scripts. You can see an actual issue created using $add-issue and $design-ui here. The screenshots are in Korean.

For context, I merge into main without a separate review.

About the author

  • CEO of Delino. I created SWC, an open-source compiler project, and previously worked at Deno and Vercel.

I like the idea of getting the mockup approved before letting AI touch the code. Fixing the direction early saves a lot of back and forth.

Do you mind putting us through the process?i want to know more about how you did it

More from this blog