ux-design-principleslisted

# UX Design Principles A consolidated design standard. Apply it when producing UI and when reviewing it. ## How to use this skill **When building something new:** read the Core Rules below, then read the reference file matching what you're building. Apply the rules as you write the code. Do not stop at "it renders" — run the Review Pass before handing it over. **When reviewing or fixing existing UI:** run the Review Pass. Report findings as a numbered list of specific problems with specific fixes, not general advice. Name the element, name what's wrong, name the change. **When the user asks for something that conflicts with these rules:** the user's brief wins. Say once, briefly, what the trade-off is, then build what they asked for. ## Reference files Read the ones relevant to the task. Don't read all of them by default. | File | Read when | |---|---| | `references/visual-hierarchy.md` | Any screen with information to rank: dashboards, cards, stats, tables, detail pages. Also covers shadows, colour and typography. | | `references/product-page.md` | E-commerce, product detail, pricing, or any page ending in a purchase action. A 15-point teardown checklist, plus how to choose and present product imagery. | | `references/navigation.md` | Bottom nav bars, tab bars, mobile app navigation. Includes hard spec numbers. | | `references/conversion-psychology.md` | Signup, onboarding, upgrade prompts, paywalls, forms, pricing. Six behavioural principles with an ethics gate. | |