How should the input box of an AI product be designed? The Prompt Box should not make all users start the theme visual from a blank sheet of paper

How should the input box of an AI product be designed? The Prompt Box should not make all users start from scratch

Author: JVDS Design Studio Reading time: about 8 min

A huge empty input box with the phrase "Ask anything" seems very free, but for those who use professional AI tools for the first time, it might also mean "I don't know how to ask". A good Prompt Box should help users understand what the system can do, what context needs to be provided, and how to gradually turn vague goals into executable tasks.

01 Let the user know what the system can do first instead of having him test the boundaries himself

The first human-computer interaction guideline of Microsoft HAX is "Clarify what the system can do", and the second one further requires an explanation of how well it can do it. Placeholders, examples, and empty states near the input box are precisely the first positions to establish such expectations.

For professional AI products, don't just write "Enter your question". It can be clearly stated that "upload the contract and extract the risk clauses" and "generate weekly reports based on sales data", allowing users to understand the product scope from the capability examples.

02 The sample Prompt should be usable directly instead of being made into marketing copy

"Unleashing the potential of AI" and "exploring infinite possibilities" cannot help users get started. The examples are preferably from real high-frequency tasks. After clicking, they can be directly filled into the input box and modified.

Different roles can see different suggestions: Marketing personnel see "Summarize Competing Product Activities", while finance personnel see "Explain Abnormal Expenses This Month". The closer the example is to the task, the lower the cost of Prompt writing can be.

Make the context part of the interface instead of requiring users to write everything into the visual description of the Prompt

03 Make the context part of the interface instead of requiring users to write it all into the Prompt

If the system can read the current document, selected tables, items, web pages or attachments, the interface should clearly display which contexts the AI is using. Users should not write "Please base it on the XX file I just uploaded" every time.

The context Chip, attachment area, current page label, etc. can all help establish a visible input range and allow the removal of unwanted data.

04 Structured parameters are suitable for use with controls. Do not force users to remember the Prompt syntax

If the output language, length, format, tone, date range, model, etc. are stable parameters, you can use Select, Toggle or shortcut buttons. Natural language is responsible for expressing complex intentions, while controls are responsible for frequently determining parameters.

"Input everything through chat" seems uniform, but in fact, it turns what could have been accomplished with just one click into a task of memorization and expression.

05 Multi-line input, attachments, and shortcut keys should match professional tasks

Simple questions and answers can be input in a single line, but writing code, contract analysis, and content generation require multi-line editing, pasting large blocks of text, dragging files, and clear send shortcut keys.

Whether Enter is a line break or a send should have stable rules and provide users with discoverable prompts. On mobile devices, it is also necessary to avoid the send button being blocked after the keyboard pops up.

Visual explanations that can reduce repetitive work by inputting history and drafts

06 Entering history and drafts can reduce repetitive work

Users often need to modify the previous Prompt and run it again instead of starting from scratch. Supporting editing, copying, re-running and restoring from history will be more controllable than simply "re-generating".

However, when historical data involves privacy, users should be made aware of the scope of retention, the duration of retention, and whether it can be closed. Input box experience and data governance cannot be separated.

07 When the user's intention is unclear, the AI should clarify instead of guessing a complete answer

Microsoft HAX's "Scope services when in doubt" suggests that the system clarify or narrow the scope of services when there is uncertainty. For inputs like "Help me analyze it", the product can ask about the target, time range or output format.

Clarification should not turn into interrogating five questions every time. Only the missing conditions that truly affect the outcome are worth interrupting.

08 A good Prompt Box will eventually make users less and less "learn prompt words".

Users should not take a course to learn a set of Prompt engineering before using the product. As the product understands the context, provides templates, remembers reasonable preferences and supports interactive corrections, the input should become increasingly natural.

A truly mature AI UX enables users to focus on their goals rather than constantly thinking about "how to phrase things so that the model can understand".

The input area should clearly specify "to whom" it is sent: the model, the Agent, or a visual description of a certain tool

09 The input area should clearly specify "to whom": the model, the Agent, or a certain tool

When a product has multiple capabilities such as "asking the knowledge base", "generating images", and "operating CRM", a unified input box may leave users unsure of what this sentence will trigger. The current capability can be expressed through visible prompts after mode tags, tool selection, or automatic routing.

Automatic routing can reduce choices, but if the consequences are different, for example, switching from "answering questions" to "performing operations", users must be informed of what the system is going to do.

10 Voice input and mobile devices need to reconsider the submission confirmation

Voice is suitable for quickly expressing complex intentions, but recognition errors may alter key information. High-risk tasks can display transcribed text before sending for user confirmation. Ordinary questions and answers can be smoother.

The Prompt Box on the mobile also needs to handle the attachment entry, keyboard height and long text folding. The bottom toolbar of the desktop cannot be stuffed into one line as it is.

11 The Prompt template should save the "task structure" instead of fixing a single magic spell

A truly valuable template will inform users of the variables they need: target, audience, data range, output format, and allow for item-by-item filling.

In this way, the team can reuse the best working methods while not treating the occasionally effective prompt words under a certain version of the model as permanent rules.

Frequently Asked Questions

Must the AI input box be made in a chat style?

Not necessarily. Tasks such as generation, editing, analysis, and search may be more suitable for embedded input, command panels, or a combination of forms and natural language.

What should a Placeholder write?

Give priority to describing the executable task and provide a brief example instead of a general "Ask me any questions".

Should the sample Prompt be filled in with one click?

Very valuable. Users can start making modifications from runnable examples, which are easier to understand than static descriptions.

Would it be more flexible to put all the parameters into the Prompt?

It may be flexible for professional users, but the control for high-frequency stable parameters is faster and more consistent, and also reduces the cost of memory.

What should be done when AI doesn't understand users?

When the key conditions that affect the outcome are not clear, proactively clarify them to avoid making confident guesses and carrying out wrong tasks.

Related ServiceLearn More
UI/UX Design ServicesView Service Details
Project ConsultationContact JVDS Design Studio
Design and Website Development ArticlesRead More Related Articles
Link copied

From Idea to Launch, We Build It Together

Building useful, scalable digital products around user experience

Tell Us About Your Project