Pebellslearn by building
0%
RoadmapsMatrixCoursesSandboxSign in
Prototyping  ›  Lesson

Designing for Uncertain Outputs

1. Prototyping 13 minAn AI feature can give poor, slow or empty results, so the design needs a screen for each of those moments and must block unacceptable results in code rather than rely on users to notice.

Designing for Uncertain Outputs

Ordinary features behave the same way every time: tap Save and it saves. Pantry Pal's suggestion button does not. The same pantry can produce different dinners, some ideas will be odd, and now and then the model will be slow or fail. If the prototype shows only the happy path, users meet the unhappy ones for the first time after launch.

The rule

Design the screen for when the AI is wrong, slow or empty.

Every AI feature needs a design for four moments:

  • Wrong — the answer is poor or mistaken. Show what the AI used ("Using: eggs, spinach, rice"), let users change the input, try again or tell you it missed. Word results as suggestions, not facts.
  • Slow — the answer takes seconds. Show that work is happening and, where you can, show partial results as they arrive.
  • Empty or failed — nothing usable comes back, or the call fails. Say so plainly and offer a way forward: a retry, or something useful to do instead.
  • Must never happen — some mistakes are unacceptable, like an allergen in a suggested dish. These are blocked by code before anything reaches the screen, never left for the user to spot.

Good design also keeps trust calibrated: people should rely on the AI where it is good and double-check it where it is not. Overconfident wording such as "The perfect dinner for you!" teaches them to stop checking.

The shortcut

Walk the four doors. For every AI screen, sketch four versions: wrong, slow, empty, and never. If you cannot sketch one of them, the design is missing a piece.

Walking the four doors on Pantry Pal's dinner cardsStep 1 of 4
  1. Wrong

    Each card lists the items it used and has "Not for me" and "Try again" buttons. "Not for me" asks for one quick reason, and Asha reads those every week.

These screens belong in the prototype, not after launch. Show testers the failure screens too, and watch whether the way out makes sense to them.

Drills

Answer fast — trust the rule.

quick drill

Why does an AI feature need more screen states than an ordinary Save button?

quick drill

Which wording best keeps a user's trust calibrated?

quick drill

The model sometimes suggests a dish containing a user's listed allergen. What is the right fix?

quick drill

The call to the model fails. What should the screen do?

Remember

  • Design the screen for when the AI is wrong, slow or empty, and block the never-cases in code.
  • Walk the four doors for every AI screen: wrong, slow, empty, never.
  • Trap: prototyping only the happy path, and wording guesses as facts.

Practice — level up

0/1 solved

Write your answer, then compare it with a rubric and a model answer.

ExplainWalk the four doors

An app uses AI to summarise long emails into three bullet points. Describe what the screen should do in each of the four moments (wrong, slow, empty or failed, and must-never-happen), and explain why each design choice helps the user.