← ClaudeAtlas

rule-thumb-firstlisted

Interface design starts from where the hand is and what each element MEANS, not from a palette. Reach zones, progressive density, and the rule that unearned signal destroys real signal. Load before designing a screen, choosing a theme, or adding colour, motion, or output.
djnsty23/claude-auto-dev · ★ 3 · AI & Automation · score 65
Install: claude install-skill djnsty23/claude-auto-dev
# Thumb-first, meaning-first A theme is not a palette. **It is a claim about where the user's hand is and what their eye does first.** Colour is downstream of that. Pick colours first and you get something that looks designed; pick geometry and meaning first and you get something that *feels* designed — which is the part people never articulate and always notice. Three questions, in this order, for anything built: 1. **Where is the hand?** What can this person reach, in the posture they are actually in? 2. **What does the eye do first?** What is this screen for? 3. **What does this mean?** Every colour, motion, and word — or cut it. ## 1. The screen is two machines On a 6.1–6.9" phone held one-handed, the thumb sweeps a comfortable arc across roughly the **bottom 45%**, biased to the dominant side. Above that the user can see but not act. - **Top ~30% — the READ plane.** State, identity, numbers, "where am I". Never a control. An unreachable *title* is fine. An unreachable *button* is a bug. - **Bottom ~45% — the ACT plane.** Every verb. The primary action sits at the far edge of the arc where the thumb rests, not centred. - **The band between — TENSION.** Where something lives just before it becomes actionable; scrolling brings it into the arc. **Let the interface fall toward the thumb.** Sheets, menus and confirmations rise from the bottom edge, originating from the control that summoned them. Nothing important appears top-centre — that is the one place a th