Thumb-First · Design

Mobile design judgment — what the right mobile pattern is and why, not how to code it. The decisions hold whether the implementation is CSS, SwiftUI, or React Native. This is the design-judgment layer of the thumb-first suite.

Quick Start

Plan a feature's mobile design: /thumb-first-design plan or "design the mobile UX for this" or "how should this work on mobile" Audit an existing mobile design: /thumb-first-design audit or "review this mobile screen" or "is this good mobile design"

This skill decides patterns and ergonomics; it does not write the implementation — for responsive CSS use responsive-craft; for mobile-web/PWA technical defects (safe areas, viewport, service workers) use its sibling thumb-first-platform; for React Native/Expo use the native-mobile skills. For a single combined pass that runs this judgment audit and the platform audit and merges them into one report, run /thumb-first.

Core Principles

These are the durable principles — synthesized from the people who defined the field. They survive device generations and platform churn.

Design for the most constrained grip (Hoober) — Grips switch every few seconds with the task. The often-quoted "49% use one hand" is not license to bury controls in easy-reach zones. Accommodate the hardest grip the user might be in, so the interface works no matter how they hold the device. In practice: keep the interaction surface — controls, nav, primary actions — in the lower band; let content fill the top, but don't put interaction there.