Part 5 · 2 chapters · ~20 min

Thinking Patterns for UX

Mapping flows and counting friction, spending it only where consequence is, defaults and progressive disclosure measured by the disclosure rate, the steps that make a flow safe to leave, and funnel measurement; then error design from prevention through timing to the message, affordance restored by tokens, the trust signals a user reads before handing over money, and the dark patterns named so a review can refuse them.

10

Flows, friction and disclosure

where to spend the user's effort
  1. Map the flow first: intent, entry points, screens and decisions in order, exits (done, cancelled, failed, abandoned), the data each step needs. The map shows the steps that serve the system rather than the user; they are the first to remove.
  2. Count friction as the user pays it: fields, decisions, confirmations, waits, reading. A transfer is five steps (recipient with a resolving lookup, amount with the limit shown, review, authorise, done) and the friction sits at the review and the authorisation, where it buys safety (the Trust course part 0).
  3. Where friction belongs: at the irreversible step and at a consequential default; never on the way in (a signup that asks for everything first); never evenly (a confirmation on every save). Friction follows the Trust course's consequence score.
  4. Defaults and disclosure: the common case is the default (the usual recipient, today, the primary account); the uncommon is disclosed behind "more options"; the rare is a separate flow. The measurement: under ten percent opening the disclosure means it is right; over forty means the default is wrong.
  5. Steps that are not steps: progress for flows over three steps; back without losing input; drafts autosaved; resume from the home screen (the Trust course part 2); a safe exit at every step saying what cancelling does. A flow the user cannot leave safely is one they fear starting.
  6. Measuring: completion rate, drop-off per step (the biggest drop is the step to redesign), time per step, error rate per field (the field users get wrong is mislabelled), disclosure rate, tickets per flow. The Architecture course part 3's custom marks per step are the instrumentation; the funnel is the dashboard.
FLOWS, FRICTION AND DISCLOSURE
the path through a task, where to spend the user's effort, and how much to show at once
swipe the figure sideways, or tap expand for full screen
1/6
mapping
Mapping a flow: the intent ("send money to Ada"), the entry points (the home action; a contact; a request), the screens and decisions in order, the exits (done; cancelled; failed; abandoned), and the data each step needs. Drawn before any screen is designed; the drawing shows the steps that exist for the system's convenience rather than the user's, which are the first to remove.
11

Error design, affordance and trust signals

three patterns with outsized effect
  1. Prevent the error: constrain inputs to the valid set (pickers, steppers, masked fields in the locale's format, limits shown inline); resolve what can be resolved (the account name before commit); confirm the ambiguous; make destructive actions distinct and require the review. The best message is the one the design made unnecessary.
  2. Validation timing: on blur for a field judged alone; on change only once touched and invalid (so the error clears as they fix it); on submit for cross-field and server rules; never on the first keystroke of an empty field. Next to the field, naming the field, focus moved to the first invalid field on submit (the Disciplines course).
  3. The message: what happened and what to do, in words, next to the thing (the Trust course part 7); plain, calm, never blaming, never jokey over money; one per field with a summary for many.
  4. Affordance: interactive things look interactive (a surface, a hover, a boundary, a grip), disabled things say why, states are visible, and nothing non-interactive looks interactive. The tokens for interactive surfaces (part 1) carry it consistently; flat design erased it and the system restores it.
  5. Trust signals in money products: the resolved recipient name, the fee and total before the action, the arrival time, a reference the moment it exists, a receipt reachable forever, the lock and a recognisable domain, the rail's name where known, no surprise steps after the review, the balance named (the Trust course). Each absent signal is a hesitation; hesitations sum to abandonment.
  6. Dark patterns, named so they can be refused: a pre-ticked upsell, a hidden fee at the last step, a cancel path longer than the signup, the confirm styled secondary and the upsell primary, a fake countdown, a shaming dismissal, consent bundled with terms. Each converts once and costs trust permanently; in money products some are illegal; the design review (part 6) refuses them by name.
the exercise
Instrument one flow with a mark per step and read the funnel for a week. Redesign the step with the biggest drop; then count the trust signals on its screen against the list above.
ERROR DESIGN, AFFORDANCE, AND TRUST SIGNALS
preventing the error before it happens, showing what can be done, and the cues that let a user hand over money
swipe the figure sideways, or tap expand for full screen
1/6
preventing errors
Preventing errors: constrain the input to the valid set (a picker for dates, a stepper for small integers, a masked field for account numbers and phone numbers with the locale's format, a limit shown so the user never types above it); resolve what can be resolved (the account name from the number, before the user commits); confirm what is ambiguous (two contacts with the same name); make destructive actions distinct in placement and colour and require the review. The best error message is the one the design made unnecessary.