Design Everyday Things

Design of Everyday Things Framework

Foundational design principles for creating products that are intuitive, discoverable, and understandable. The "bible of UX" — applicable to physical products, software, and any human-designed system.

Core Principle

Good design is actually a lot harder to notice than poor design, in part because good designs fit our needs so well that the design is invisible. When something fails, users blame themselves — but the fault is almost always in the design. Great design bridges the gap between what people want to do and what the product allows: it is discoverable (you can figure out what to do) and understandable (you can figure out what happened).

Scoring

Goal: 10/10. Score 2 points per satisfied row of the Quick Diagnostic (5 rows = discoverability, evaluation, error recovery, mapping, constraints). Bands: 9-10 = users act without instructions, understand every outcome, and recover from any error; 5-6 = one gulf or error path is broken; <=3 = users must consult a manual or routinely blame themselves. Report the current score and the diagnostic rows failing it.

The Two Gulfs

Every interaction with a product requires bridging two gulfs:

USER                                    PRODUCT
  │                                        │
  ├──── Gulf of Execution ────────────────→│
  │     "How do I do what I want?"         │
  │                                        │
  │←──── Gulf of Evaluation ──────────────┤
  │     "What happened? Did it work?"      │

Gulf of Execution

The gap between what users want to do and what the product lets them do. Users ask: What can I do here? Which control do I use?

Bridge with: clear signifiers, natural mappings, constraints, familiar conceptual models.

Gulf of Evaluation

The gap between what the product did and what users understand happened. Users ask: What happened? Did it work? What state is the system in?

Bridge with: immediate visible feedback, clear system-state indicators, meaningful error messages, progress indicators.

Design goal: Make both gulfs as narrow as possible — action and understanding should be immediate.

See: references/two-gulfs.md for gulf analysis exercises.

Seven Fundamental Design Principles

1. Discoverability

Definition: Can users figure out what actions are possible and how to perform them? Its five components — affordances, signifiers, constraints, mappings, feedback — are detailed below.

Test: Put a new user in front of your product. If they can't figure out what to do within 10 seconds, discoverability is broken.

Anti-pattern: "The user manual explains it." If users need a manual, the design failed.

2. Affordances

Definition: The relationship between an object's properties and a user's capabilities that determines how the object could be used.

Key insight: Affordances exist whether or not they are perceived — what matters for design is perceived affordance.

Digital applications:

Common failures: flat design erasing perceived affordances (button or label?), too-small touch targets, interactive and decorative elements that look identical.

See: references/affordances.md for affordance design patterns.

3. Signifiers

Definition: Signals that communicate where the action should take place. Affordances determine what you CAN do; signifiers show you WHERE and HOW.

Digital signifiers:

Design rule: When in doubt, add a signifier — better to over-communicate than leave users guessing.

See: references/signifiers.md when deciding which signifier to add to an unclear control.

4. Mappings

Definition: The relationship between controls and their effects. Natural mapping means the spatial layout of controls matches the layout of what they control.

Digital principles: controls near what they affect, layout mirroring content, direction matching expectation (scroll down = content moves up), related controls grouped.

See: references/mappings.md for mapping analysis exercises.

5. Constraints

Definition: Limiting the possible actions to prevent errors.

Digital constraints:

Design rule: Every constraint you add is one less error the user can make — make wrong actions impossible rather than punishing them.

See: references/constraints.md for constraint design patterns.

6. Feedback

Definition: Communicating the results of an action back to the user. Feedback must be immediate (within 0.1s for direct manipulation), informative, appropriately dosed, and non-intrusive.

Digital feedback patterns:

Response times: 0.1s feels instantaneous; 1s is a noticeable delay (change cursor); 10s loses attention (show progress bar); over 10s users leave (show percentage, allow backgrounding).

Common failures: no feedback (did my click register?), delayed feedback (feels broken), unclear feedback, alert overload.

See: references/feedback.md when an action gives no clear result and you need the right feedback type and timing.