A new way to design prompts

Every AI generated output is in fact a design decision, taken by AI, moulded by you i.e., your system prompt.

How verbose should this be?
How formal?
What happens when the input is vague?
What happens when it's adversarial?

Each of these is a design question that you can only answer by playing with AI and seeing the real output. That's why maintaining a prompt book as a designer becomes important. It's your own library of lines and paras that work. They are transferrable too, across your AI features.

In early 2025, we, at aiverse, built a design CRIT agent.

It was a series of prompts to evaluate any given piece of UI and output a design score and an extensive critique, focused on actionability.

However, before landing on the final usable thing, we made a rookie mistake. Two mistakes actually.

First mistake

I assumed AI doesn't and wouldn't know design. You would think that's still true but it's actually very good (when design = UX patterns, not aesthetics) and it keeps getting better with every model update. At that time, I thought I would create a framework on how the LLM should critique a piece of UI.

And I went in deep. We ended up with an extensive framework. 3 months of breaking everything down, collecting the most informative design resources, testing the prompts and packaging it all up as a web app that gave an actionable output.

Only to realize...

ChatGPT launched their new model which gave the same, if not better, output with only one line input "critique this UI".

Even though we knew you had to design with the future state of AI in mind, we completely missed out on the fact that it would get better at design too.

Second mistake

When I mentioned testing of prompts, we spent one month iterating and writing 1 big-ass prompt that would critique just as well as I did. Oh boy, what a noob! We eventually had the enlightenment of breaking it down into multiple prompts, a better approach in hindsight. And to make it even better, we used different models for each prompt because each had different design capabilities.

But how did I do it? I launched tldraw in one tab, OpenAI's playground in the second tab and Claude's console in another. Then it was just bouncing between tabs, saving good working prompts on tldraw (because I'm a visual person) along with each model's output for comparison. It was cumbersome but it was the only solution out there.

Fast forward to this year, I'm back at the same stage. I'm working on an AI-native project in our studio. I'm maintaining prompts, different model outputs and this time, the UI too. But a little differently. I vibe coded a custom tool where on the left I have all my prompts and on the right, my UI. I can play with the prompts, change the model and see how the output influences the user interface in real-time.

In fact, I recently came across Chronicle's design process and they had something similar.

Honestly, my internal tool worked great.

Until, I wanted to update the UI and test 2 different layouts with the same series of prompts. I needed parallel-ism (or as the big boys call it, Orchestration).

Time to bring back the canvas

I decided to shift my complete workflow onto an infinite canvas, because Figma has spoilt me.

So all the UI are “interactive frames”, all my prompts live in a “generator box”, and my context as files or text fields.

And yes this the new Canvas UI i’ve been exploring.

In fact you can even upload your documents on the canvas (re: context) and prompt those through the “Generator box”.

All of my prompts now live on this canvas, next to my UI, and in a visual environment that makes it easy for me to think spatially.

It’s a new layer of prototyping.

Below is v1 of the Canvas and I’ve linked all three generator boxes through “@…” mentions.

• Generator 1 (top left) outputs 50 music genres

• Generator 2 (bottom left) take that Output 1 and identifies themes

• Generator 3 (middle) takes the Output 2 and formats the data in which the UI wants

• Component (the UI) updates the data.

And when I add more context, my style rules as “only reply in emojis” and I run it again, AI generates emoji-first data and the UI updates.

You can PLAY with prompts and see how the UI changes live.

It's so much easier than a mere text editor and has everything I was doing before (tldraw ↔ API playground ↔ Notion) but all in one place.

I am now designing the prompts, orchestrating evaluations and having fun.