Skip to main content

UI Design Principles

SECTION 6 — UI DESIGN PRINCIPLES

6.1 Core Principles (Non-Negotiable)

PrincipleSpecification
Minimalist DesignClean, distraction-free interface. No decorative clutter. Content is the focal point.
Intuitive NavigationClear visual hierarchy. Consistent interaction patterns across all screens.
Responsive LayoutSeamless experience across desktop, tablet, and mobile. Mobile is not an afterthought.
AccessibilityWCAG 2.1 AA compliance mandatory across all screens. Full keyboard navigation support.
Component LibraryShadCN UI is the primary component library, supplemented by compatible third-party ShadCN registries (e.g. ui.tripled.work). Use ShadCN components as the baseline — customise, do not replace with ad-hoc implementations.

6.2 Design Handoff Protocol

  • Figma designs will be provided for select priority screens and user flows.
  • Where Figma is provided: developer implements pixel-perfect — zero deviation permitted.
  • Screens without Figma coverage: developer exercises full creative freedom within the principles above.
  • Reference UI: If the developer needs directional clarity on any un-specced screen, a reference app or competitor example will be provided by the product owner upon request.