Mobile App UI Production in Figma (No UX, No Product Decisions)

SCOPE Summary (Read First)

This task is visual execution only.

UX logic, behaviors, and flows are already defined and locked.
Flows are defined across UX Logic Maps, API Contracts, and Locked Decisions and must not be altered, reinterpreted, or expanded.

Your work is limited to UI production in Figma:
- spacing
- layout refinement
- reusable components
- basic visual styling (fonts, colors, buttons)
- option selectors (visual only)

Fixed budget range: $300–400.
Expected timeline: 1–2 weeks of active work from project start (start expected in ~8–10 days)

You must not change UX, behavior, logic, or data representation.
If something is unclear, ask…do not decide.

PLATFORM

- Target platforms: iOS and Android (mobile-first UI)
- Tablet devices (iPad / Android tablets) are supported via responsive scaling of the mobile layout
- No tablet-specific UI or layouts are required

SCOPE OF WORK — UI PRODUCTION (FIGMA)
WHAT IS IN SCOPE (YOU MUST DO)

1. Figma File Structure
- One single Figma file
- Organized into:
• Foundations (colors, text styles, spacing)
• Components
• Screens

2. Layout & Spacing
- Apply consistent grid and spacing
- Use Auto Layout
- No invented layouts
- No structural changes

Layout must follow exactly the provided mockups and references.

3. UI Components
Reusable components for:
- buttons (primary / secondary)
- bottom tab (Home / Volume / Mute)
- header
- list items
- modal / bottom sheet
- picker / option selector

Anything that repeats must be a component.

4. Visual Styling (Minimal & Neutral)
- One or two fonts (via text styles)
- Simple color palette (via variables)
- Consistent icon style
- No heavy branding

Visual styling must be easy to replace or improve later. Provided reference mock-ups

5. Option Selectors / Popups
Visual appearance only for:
- sound selector
- tempo selector
- octave / preset selector
- etc…

Focus on spacing, alignment, and selected states.
Do not decide behavior.

6. Screens (Static References Only)
- Home (Tools)
- Each Tool (Everyday)
- Stage Mode (where applicable)
- Library
- Games
- Settings

No flows.
OUT OF SCOPE

- UX decisions
- Product suggestions
- Flow changes
- Interaction logic
- Animations
- Transitions
- New features
- Redesign of Spectrum / Meter logic
- Redefining what buttons do
RED LINE

If a change affects behavior, meaning, or data interpretation, it is OUT OF SCOPE.
Only visual appearance is in scope.

DELIVERABLES
- One clean, organized Figma file
- All screens and components fully reusable
- Ready for developer handoff

Minor visual revisions based on feedback are expected and included.
Structural or UX changes are out of scope