Real-World AI UI Design Challenge

There's a ton of noise in the market for designers around AI, especially around text-driven generative AI. Gather around then in the quiet for a simple example of an AI UI design challenge you may be asked to solve in 2023-24 and importantly a UI you'll want to design (because your audience is other designers and visual thinkers).

The real-world UI challenge is to take the research UI shown in this article's hero image and whose interaction dynamics can be seen in the video below (skip to the 3:53 mark) and make it more usable to a visual designer who might use your UI say weekly to quickly turn around requests for unique imagery to be used in social media.

Since designers tend to think analogically and visually, the presumption is you'll come up to speed quickly on what image analogies are. You'll have the research prototype to learn the functionality you have to work with. You'd very quickly see that the Analogy and Input images are user-definable and that the main larger image is the generated image unique to those inputs.

A quick glance at the research prototype should suggest some standard visual layout, proportion, and design hierarchy challenges. You'd quickly note that the images can be any combination of aspect ratios, so you'll need to solve for that.

Some more difficult design challenges come up as you consider allowing for multiple input images for all 3 of the user-definable image wells and what kind of affordances you'd need to make navigating the multiple images in each of those 3 wells.

Finally, your use of the research prototype shows you how integral the UI in the bottom right (circled in red) is to the experience. It's very likely a novel UI component for you to design for and it's going to be novel for users. You intuit that your overall design will hinge on how well you make this functionality's UI seem familiar, how efficiently it can be interacted with, etc. Your interaction design instincts tell you that for the coarse input of touch devices, you'll need to consider the density of this component and you'll want to consider the appropriate placement of this element on tablet devices where reachability is important.

Of course, personalization is still paramount across any experience, so consider the kinds of questions you'd ask of your computational researchers about the types of personalization possible.

Finally, you're going to be a natural advocate for the users of this app in terms of helping them understand what imagery was used to feed the algorithm that's generating these image analogies and how any of their own images input will further feed the algorithm. It's not lost on you that a large percentage of users will be inputting images (in the bottom left of the research prototype) to transfer their personal style to new images.

So, that's your brief. Go design something at whatever fidelity makes sense! And, understand, that this is what a AI UI design project would be like were you to work for a creative tools company in 2023-24.

If you loved this exercise and created a solution, share it with me for private feedback or public promotion.

If you're more of a product/UX leader like me, see a similar challenge (from a few years ago) and my solution from the perspective of a product/UX leader considering functionality, UX, marketing, and other concerns here: