Real-Time UI

“If a picture is worth a thousand words, then a prototype is worth a thousand meetings.”
– Tom & David Kelley

But what if the meeting is the prototype?

That’s the spirit of an idea I’m calling “Real-time UI” (the name of which I gave next-to-no thought, so forgive me). The tools and technologies now exist to generate UI in realtime, making it possible to convert a conversation into a working digital thing. All without touching a mouse or keyboard.

In this video, I introduce the concept to TJ and Ian, and we talk about the possibilities and ramifications of generating UI in realtime, as well as speaking to the infinite creative potential of using AI & design systems together.

As we’ve been putting together our AI & Design Systems course, I keep excitedly talking about the potential to make design a more collaborative, democratic, and participatory experience. Historically, it’s been really prohibitive for people to design and build digital interfaces, so half of our meetings are spent talking other people out of pursuing ideas because of the effort involved to produce artifacts.

As I see it, real-time UI can help accomplish a number of things:

  • Visualize UI components in real-time – surfacing design system components immediately as they’re referenced in conversation (design systems are a shared language!)
  • Visualize product design in real-time. Make abstract ideas real as soon as the words exit your mouth, and use the working prototype as a wet ball of clay the team can sculpt together over the course of a conversation.
  • Wield your design system’s infrastructure to make realistic things. The spirit is to have the conversation and infrastructure tuned to your specific team’s context. Create prototypes that are built using your organization’s best practices rather than whatever AI decides to randomly generate.
  • Minimize the friction involved in making prototypes
  • A visual accompaniment to a conversation can help teams unlock new ideas, expose weak spots, explore opportunities, and iterate collaboratively
  • Open the door to a more participatory design process. Diversity is critical to success, and it’s so important to make sure that digital products represent the best thinking from different disciplines & perspectives at a company. Historically, the design process was prohibitive to people who weren’t skilled in the mechanical aspects of creating designs & code. This is no longer the case. Of course professional designers or developers are still necessary (now more than ever!) to produce great results, but there’s now an opportunity to create more democratic, collaborative, participatory design workflows.

Real-time UI is a nugget of an idea. And it’s merely one nugget in a much broader, much vaster technological landscape. Who knows if this nugget of an idea will become a whole-ass idea. There will be many, many, many things created, and who knows what the future holds.

But I have an instinct that it’s a Good Thing to create the conditions that get human beings together to collaboratively make things that help people. That instinct is something we will continue to explore.

If you’re curious in joining us on exploring this future together and learning how to wield AI & Design Systems together to make great digital things, we’d love it if you joined our community by preordering our AI & Design Systems course!