Constraints
Restricting what is possible is the cheapest way to prevent an entire class of error.
Definition
Norman identifies physical, cultural, semantic and logical constraints as forces that limit the set of possible actions. In interfaces, constraints are what make an invalid state unreachable rather than merely rejected.
Expert heuristic. A review criterion developed by practitioners. Useful and widely taught, but evaluated by judgement rather than measurement.
On this plate
Reach for this when
- Designing input for structured or bounded data.
- Preventing a class of error that keeps appearing in support.
- Deciding between constraint and validation.
Common mistakes
- Over-constraining, such as rejecting valid international formats.
- Disabled controls with no explanation.
- Constraints applied only in the client, so the invalid state remains reachable.
- Using a constraint where a default would have done, which removes a choice somebody occasionally needs.
Four kinds of constraint, applied to software
| Type | In an interface | Example |
|---|---|---|
| Physical | The interaction is not possible | A date picker that cannot produce an invalid date. |
| Cultural | Convention limits what people try | A red destructive button is not pressed casually. |
| Semantic | Meaning rules out an action | An empty cart cannot be checked out, so the control is not offered. |
| Logical | The structure implies the answer | Only one radio button can be selected, so the model is obvious. |
Constraints that pay for themselves
- Input masks and pickers for structured values.
- Selection controls rather than free text where the set is known and small.
- Maximum and minimum values enforced by the control, not by a message afterwards.
- Dependent fields that only appear when relevant, so an inconsistent combination cannot be entered.
- Disabled or hidden actions for states where they are meaningless, with an explanation of why.
Constraining without trapping
Do
- Disable what cannot be chosen, and say why in the same place.
- Restrict the input to the shape of the answer, as with a stepper bounded by real stock.
- Show the limit before it is hit, not as a rejection afterwards.
- Let people see what is unavailable, so the absence is informative.
Do not
- Hide options that are unavailable for a reason the reader could act on.
- Disable a control with no explanation, which reads as a bug.
- Enforce a constraint that is wrong for a legitimate minority, with no way past it.
- Rely on a constraint in the interface alone, with nothing behind it.
In practice
- i.
Quantity steppers with real limits
EcommerceA stepper that stops at available stock prevents an order that cannot be fulfilled. Accepting the number and failing at checkout moves the cost to the worst possible moment.
- ii.
Conditional fields
FormsShowing the company registration field only when the account type is business makes an inconsistent submission impossible rather than merely invalid.
- iii.
Greyed out, and unexplained
The disabled control problemA disabled Export button told a reader nothing. It required a saved report, which was stated nowhere. A tooltip on the disabled state, or a line beneath it, turns a dead end into an instruction.
Local chart
PRIN·009 · Region I · Grid A2
This entry and the entries it is stated to connect with. Each line is labelled with what the connection means.
Sources
Where a source establishes something narrower than the popular reading of it, the note says so.
- [1]
The Design of Everyday Things
D. A. Norman, Basic Books, 1988, revised 2013
Continue from here
Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.
Applied through
Where this shows up as a concrete interface decision.
- Date PickerCMP·009 · Component
- Radio GroupCMP·006 · Component
- SelectCMP·004 · Component
- Input ValidationPAT·007 · Pattern
- Visual StatesFND·053 · UI foundation
Check your work
Review passes that test whether this was done properly.
- Form UX ChecklistCHK·001 · Checklist
Related concept
Connected closely enough to change how you apply this.
- Error PreventionHEUR·005 · Heuristic
- Postel's LawLAW·012 · Law
- Tesler's LawLAW·005 · Law
- Affordances and SignifiersPRIN·007 · Principle
- Natural MappingPRIN·008 · Principle