UI_SPEC

Category: 04. No-Code / Low-Code
Section: Phase 3: Execution & Quality

8. UI_SPEC.md

Purpose: To define the frontend components and user interface for the no-code application.

Act as a senior UI/UX designer.
Using the PRD and System Architecture below, create a UI Specification document for a no-code hackathon project.

PRD: [PASTE PRD]
ARCHITECTURE: [PASTE SYSTEM_ARCHITECTURE]

Provide:
1. Design system (Colors, typography, spacing)
2. Component hierarchy (List all major components and reusable elements)
3. Screen-by-screen breakdown (Login, Dashboard, Core Feature, Settings)
4. Loading states (Skeletons, spinners)
5. Error states (How errors are displayed to the user)
6. Empty states (What the user sees before data is loaded)
7. Responsive design guidelines (Mobile and Desktop)
8. Accessibility considerations (Contrast, keyboard navigation)

Keep the UI simple, clean, and realistic for a 24-48 hour no-code hackathon.
Focus on demonstrating the core user journey.
Use platform-native components where possible.