Traditional UI patterns for AI prompts
Exploring the three most common implementations of text-prompt UX in SaaS products: user prompting, prompt templates, and prompt builders.
This is a weekly deep dive into a UI design pattern for AI products from the product library at Teardowns.ai — by Tommy Geoco
Traditional interfaces will become more invisible with the introduction of AI.
That’s an argument I’ve been hearing.
But after exploring more than 100 different implementations of AI in SaaS products and reading Microsoft’s intent to preserve human agency in AI workflows, I’m convinced otherwise.
In fact, traditional interfaces are doing a great service for the consumption of AI products.
For example, advanced prompt engineering can be packaged into easily consumable point and click UI, short-hand sentence representations, or step-by-step wizards for the less savvy user.
I refer to these as prompt triggers, and they come in 3 flavors:
User prompting
Prompt templates
Prompt builders
Let’s dive into these frequented patterns with some examples.
Pattern 1: User prompting
User prompting is the free-form approach to interacting with LLMs. It allows the user to type and send any text-based response to the system. This is rooted in the simplicity of the input field provided by ChatGPT that made it widely accessible.
These are best for when users need fewer limitations to their workflow.
But we’re also seeing this pattern evolve for workflows like document editing and task management.
Example: User prompting on Adobe Photoshop
Adobe Photoshop uses an inline input field for the user’s text prompt directly on the canvas through a floating action bar.
Pattern 2: Prompt templates
Prompt templates are pre-constructed text prompts that are sent to the system once the user triggers a button or action in the UI.
These are best for when you’re trying to enable a specific task for the user, like text summarization.
Right now, there is a race to learn to engineer better prompts. But on the other end, those that are creating robust text prompts are finding creative ways to make them consumable by customers.
Example: Prompt templates on Scribe
Scribe uses an inline editing UI that includes a list of pre-constructed text prompts to extend or change the output. These prompt templates are stored behind short label descriptions like “improve writing”, “summarize”, and “expand”.
Pattern 3: Prompt builders
Example: Priming wizards like Gamma
Gamma uses a guided wizard to walk the user through the process of building a detailed prompt where they make selections for content type, topic, and content outline. ‘
This workflow seemingly fills the gaps with user preferences in a detailed prompt for generating content without asking the user to actually write the prompt.
Takeaways
Traditional UI patterns are being used in effective ways to help users consume and edit key parameters of complex prompts in SaaS workflows.
Three prompt patterns: User prompting, prompt templates, and prompt builders
User prompting is the simplest mental model, providing an input field to the system’s AI for free-form text-prompting.
Prompt templates package pre-constructed prompts into a short-hand trigger.
Prompt builders use guided wizards for walking the user through a point-and-click prompt setup.
Have you seen an interesting way to solve similar UI challenges or are you currently working on a pattern you’d like me to check out?
Shoot me a comment below, check out our library at Teardowns.ai, and subscribe to AI Patterns for more weekly UI design insights for AI patterns.
Agree. Wrote similar in my Medium article, A better experience than just chatting.
https://medium.com/design-bootcamp/a-better-experience-than-just-chatting-9dd25a187912