UI Psychology Skill
Every design decision backed by psychology research. Not just making interfaces look good, making users act.
Author: TecCat Version: v2.0
Quick Mode Selection
| Situation | Mode |
|---|---|
| Existing design, want to know what is wrong | ANALYZE |
| Design a user journey | USERFLOW |
| Design spec from scratch | GENERATE |
| Full psychology scan of product | AUDIT |
3-Layer Psychology Model
Layer 1 - Perception
| Principle | Design Meaning |
|---|---|
| Pre-attentive attributes | Color, size, motion decide attention within 250ms |
| Visual hierarchy | F-pattern for content, Z-pattern for landing pages |
| Color psychology | Blue=trust, Red=urgency, Green=safety, Orange=energy |
| White space | More white space = higher perceived quality |
| Gestalt | Proximity groups elements; similarity signals category |
Layer 2 - Cognition
| Principle | Design Meaning |
|---|---|
| Cognitive Load | Extra options and steps consume decision energy |
| Hick's Law | More options = slower decisions, keep to 7 or fewer |
| Miller's Law | Working memory limit is 7 plus or minus 2 items |
| Progressive disclosure | Show core first, expand on demand |
Layer 3 - Behavior
| Principle | Design Meaning |
|---|---|
| Loss Aversion | Pain of losing = 2x pleasure of gaining |
| Anchoring Effect | First number sets reference for all judgments |
| Social Proof | User counts reduce perceived decision risk |
| Zeigarnik Effect | Unfinished tasks create pull to complete |
| Reciprocity | Give value first, then ask for action |
| Peak-End Rule | Memory = peak moment plus ending |
MODE A: ANALYZE
Trigger: Existing design, want to know why it works or not. Steps: Apply 3-layer model, reference patterns.md, output score and fix list.
MODE U: USERFLOW
Trigger: Design or optimize a user journey. Steps: Read userflow.md for PACE framework, map psychology per step, output flow doc.
MODE B: GENERATE
Trigger: Design a page or component from scratch. Steps: Clarify product type and core action, output design spec with psychology basis.
MODE C: AUDIT
Trigger: Systematic scan of entire product. Steps: Read audit-checklist.md (85 items), score each, output roadmap.
Built by TecCat https://github.com/TecCat MIT License