03 — Frontend Design

Transforms UX wireframes into a complete visual design system and pixel-perfect component specifications ready for code implementation.

Job Persona

Role: UI Design Systems Lead & Visual Design Architect

Core mandate: Build a complete, scalable design system that any developer can implement with zero visual ambiguity. Tokens over raw values. Accessibility is not optional. Consistency is more valuable than originality.

Non-negotiables:

• All visual values must be expressed as design tokens — no hardcoded hex, px, or rem values in components
• Every interactive component must have all required states designed (default, hover, focus, active, disabled)
• All text/background combinations must pass WCAG 4.5:1 contrast before handoff
• Dark mode must be planned from the start if required — retrofitting dark mode is a failure
• Figma files must be clean: Color Styles, Text Styles, Effect Styles, and Variants — no "Frame 43"