Choose Prompt Affordances Beyond the Chat Box

Workflow area: AX Patterns · Tier: Advanced · Hands-on time: ~40 minutes

A free-text box hands the user a blank page and the burden of prompt engineering. For open-ended exploration that's honest; for "translate this to formal French" it's malpractice — the user knows exactly what they want, and you made them write an essay about it. Shape of AI catalogs the alternatives under Prompting patterns: constrained inputs that encode intent through UI instead of prose. The craft is matching affordance to job: how well-defined is the task, how many parameters vary, how often does it repeat? This playbook turns those questions into a reusable decision tree and prototypes the winner.

When to use — and when not to

• Use it whenever a spec says "add a chat interface"run the tree first; in most products the majority of AI jobs resolve to something more constrained than chat.
• Use it to rescue a struggling chat featureif logs show users typing the same three intents repeatedly, those intents are begging to become buttons, presets or madlibs.
• Use it when prompt quality gates output qualityif only power users get good results, the affordance is offloading skill the UI should encode.
• Skip it for genuinely open-ended surfacesa general assistant, a brainstorming partner or an exploratory research tool earns its free-text box; constraining it would amputate the value.
• Skip hybrid complexity for v1 of a narrow featureone job, one affordance; add the escape-hatch text field when usage data demands it.

The recipe

1. 1.

   List jobs, not features. Write every task users bring to the AI surface as a verb phrase with a variability note: "summarize a thread (length varies)," "draft outreach (tone + recipient vary)," "find contradictions in research notes (open-ended)." Ten to twenty jobs is typical. The variability note is the input to everything that follows.

2. 2.

   Run each job through the decision tree. Four questions, in order — the first "yes" that fits picks the affordance:

   • •
     Is the intent fully known and repeated? → Inline action (one labeled button on the object: "Summarize," "Fix grammar"). No input at all.
   • •
     Is the task a fixed shape with a few slots? → Madlib (fill-in-the-blanks: "Write a [tone] reply to [message] that [goal]"). The sentence teaches the capability while collecting the input.
   • •
     Do users tweak continuous or enumerable qualities? → Parameters (sliders, steppers, toggles: length, formality, temperature-as-"creativity"). Best for iteration on an existing output.
   • •
     Do outputs cluster into recognizable families? → Presets (style gallery, template picker: "as a tweet / as a memo / as release notes"). Show, don't describe.
   • •
     None of the above → free text — now defended, not defaulted.
3. 3.

   Sanity-check the mapping with an adversarial prompt.

   Copy

   You are an AI-UX reviewer who believes chat boxes are overused.
   Here are my jobs-to-be-done with the affordance I chose for each:
   
   [PASTE JOB → AFFORDANCE TABLE]
   
   For each row:
   1. Say whether a MORE constrained affordance could do the job, and
      what the user would lose.
   2. Flag any madlib with more than 4 slots (that's a form, not a
      madlib) and any preset list longer than 6 (that's a browse
      problem, not a pick problem).
   3. Identify which single job, if any, justifies keeping a free-text
      escape hatch on this surface.
   Be opinionated; I will make the final call.
   

   Expect pushback like:

   Copy

   "Draft outreach" — you chose free text. A madlib covers 80%:
   "Write a [warm/direct] note to [name] about [topic], under
   [length]." Loss: unusual asks. Mitigation: 'More options…' opens
   text input pre-filled with the madlib as a prompt.
   

4. 4.

   Prototype the top two affordances in Figma Make. Build the madlib or parameter panel as a working mock with realistic slot values and one real-looking output per configuration. Constrained inputs live or die on microcopy — slot labels are doing the prompt engineering now, so test that a first-time user can fill the madlib without instructions.

5. 5.

   Design the graduation path. Constrained affordances should leak power gradually: the madlib's "advanced" link reveals the assembled prompt for editing; presets expose their underlying parameters on long-press; inline actions offer "adjust…" after the first result. Users who outgrow the constraint become your free-text users — by choice, with a mental model the constrained UI taught them.

Make it yours

• Claude as log analyst: paste 100 anonymized prompts from your existing chat feature and ask for intent clusters with frequency counts — the top clusters are your inline-action and madlib candidates, ranked by evidence.
• Figma Make A/B empty states: build the same job twice — chat box vs. madlib — and run five-user tests on each; measure time-to-first-good-output and count who needed a second attempt.
• Mobile-first products: bias the tree toward presets and inline actions — thumb-typing a paragraph into a chat box is where mobile AI adoption goes to die.

Quality check

• Every affordance choice traces to a tree question"chat felt more flexible" is not a node in the tree.
• Madlibs have four slots or fewerbeyond that, ship a form with labels and defaults instead.
• Parameter labels speak user language"creativity," not "temperature"; "length: short/medium/long," not token counts.
• Each preset previews a real outputa preset described in words ("professional tone") instead of shown is a guess, not a choice.
• The escape hatch is reachable but not centralpower users can get to free text in one step; first-time users are never confronted with it.
• Slot microcopy was user-testedsomeone outside the team filled the madlib correctly on the first try.