Frontend Ui

Design Direction

Required only for:

• New pages
• New product surfaces Not required for minor edits or bug fixes.

Flow‑First Thinking

Before UI decisions, clarify:

1. Purpose of the screen
2. Primary user
3. Emotional job (what should it feel like to succeed?)

Theme System

Two separate tracks:

• Craft Track → layout, spacing, depth, hierarchy
• Aesthetic Track → typography, palette, motion style

Typography

Claude chooses fonts but must:

• Match tone + audience
• Justify the choice

Motion

• Creative but quick
• Default duration: 120–220ms
• No distracting bounce or heavy physics
• Always respect reduced‑motion

Brand Handling

Ask for color palette if branding is desired. If none is provided, proceed with a neutral system.

Output Standard

Every UI output must show:

• Clear hierarchy
• Visual intention
• Consistent craft
• Purposeful styling