Finding the limits of AI-generated design

We live in weird times at the moment. You can go to Claude and ask it to “give you a React component for a dashboard” and it will come up with something halfway decent. Work that used to take days, can now be handled in hours.

Where does that leave UI designers? I believe regardless of the speed gains that AI provides, a good interface still needs a lof ot thinking. AI will generate sloppy work and drop the ball when it comes to the details. But it can also do amazing things that I could never code before.

At Obra we've been experimenting with different tools like Claude, Subframe and Magic Patterns. Are these tools a silver bullet to get to better UI designs? Of course not. They are a tool to get to a result faster.

For example, for years, I've promoted data-driven design. If you're doing an interface to select a car, get a list of cars. If you show a list of people, make the names realistic. Why? Making the content match the real data uncovers user interface problems to then solve.

It's a basic designer technique by now to use a plugin like Google Sheets sync to get data in your interfaces. You'd set up a spreadsheet and then sync that data to your design app. With AI tools, the game changes: you just prompt the data, and the AI knows where to update the UI.

Please consider the user interface below. It was made using Subframe.

Quotes screen

Client detail screen

Clients screen

Previous

Next

What you see is probably a decent looking interface. However, looks can be deceiving. While this is a decent shadcn-based UI, quite little consideration has been given to the actual interface. This is not a jab on the tool, but on the techniques. This just used the AI feature with some minor tweaks, and we called it a day.

If I had to critique this piece of work I'd have a lot of comments. What's the point of those widgets, when they are not interactive? Do you really need to see company and team settings at all times? Does it make sense to have a refresh and a filter button on the top right, when there is a direct filter for “Provider” and “Insurance type” on top already?

Just like AI cannot generate literature, it cannot generate great interfaces. It's easy to mistake this for good work, because it looks good; but it has so many basic problems, I would be ashamed to present this to a client.

This interface was generated with a prompt. It contains UI choices that are a visual part of the framework that is behind this (a variation of Tailwind). It also contains content UI choices: the use of a sidebar, the way the widgets are placed.

Stakeholders might be OK with this interface given something called the aesthetic-usability effect. It refers to users’ tendency to perceive attractive products as more usable. But don't be fooled: this is not interface design. This is just a starting point, and there's a lot of things to consider.

At Obra we like to consider every part of the user interface. Every label, every button, every widget is considered. The answer that “Oh, the AI generated that” can cut it in an early, exploratory phase of a project, but when it comes to the later phases, we want human consideration to be the deciding factor in getting to quality user interfaces.