Experience Checklist

Apply this checklist while building each surface, not as a final cleanup pass.

• Loading: route navigation shows a structural skeleton matching final geometry; no meaningful page starts as a blank region.
• Empty: explain what is absent, why it matters, and provide the next valid action when the visitor has permission.
• Error: preserve the page shell, use plain language, and offer a retry or safe destination.
• Success: mutations provide immediate visible confirmation; use a toast for cross-region outcomes and inline confirmation for local form state.
• Permissions: denied actions are absent or use the documented aria-disabled pattern with visible explanation.
• Keyboard: focus order follows visual order; every interactive control is reachable and has a visible focus indicator; focus returns after dialogs.
• Motion: transitions communicate state and respect prefers-reduced-motion.
• Responsive: verify 390 px, 768 px, and 1440 px with no page-level overflow.
• Themes: verify light and dark modes; status meaning cannot depend on color alone.
• Copy: describe the user's work, not implementation details or demo disclaimers.