Complete Screen-by-Screen Design Specifications

SECTION 1: ONBOARDING & AUTHENTICATION SCREENS

ON-001 — Splash Screen

WIREFRAME LAYOUT

┌─────────────────────────────────────┐ │ ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ │ ← Status Bar (hidden/light) │ │ │ ┌─────────────────┐ │ │ │ │ │ │ │ TRUE REVIEW │ │ ← App Logo (centered) 80x80dp │ │ ✓ │ │ │ │ │ │ │ └─────────────────┘ │ │ │ │ "Real Reviews. Real Trust." │ ← Tagline │ │ │ ◯ ◯ ◯ (loading) │ ← Loading indicator │ │ └─────────────────────────────────────┘

DESIGN SPECIFICATIONS

Property Value
Background Brand primary color gradient (top to bottom)
Logo White/Light version, animated scale-in effect
Tagline White, 16sp, medium weight, fade-in after logo
Loading 3 dots pulse animation at bottom
Duration 2-3 seconds (or until app loads)
Transition Fade out to next screen

STATES

State Behaviour
Initial Logo scales from 0 to 100%
Loading Dots animate
Complete Fade to Language Selection

PROMPT FOR DESIGNER "Design a splash screen with centered app logo, brand gradient background, tagline below logo, and subtle loading animation. Clean, minimal, trustworthy feel. Logo should have checkmark integrated. Animation: logo scales in, tagline fades in."

ON-002 — Language Selection

WIREFRAME LAYOUT

┌─────────────────────────────────────┐ │ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ │ ← Status Bar │ │ │ [🌐 Globe Illustration] │ ← Illustration 120x120dp │ │ │ Choose Your Language │ ← Title: 24sp, Bold │ │ │ Select your preferred language │ ← Subtitle: 14sp, Gray │ │ │ ┌─────────────────────────────┐ │ │ │ ○ English │ │ ← Radio button + Label, Height: 56dp │ └─────────────────────────────┘ │ │ ┌─────────────────────────────┐ │ │ │ ○ हिंदी (Hindi) │ │ │ └─────────────────────────────┘ │ │ ┌─────────────────────────────┐ │ │ │ ○ తెలుగు (Telugu) │ │ │ └─────────────────────────────┘ │ │ ┌─────────────────────────────┐ │ │ │ ○ தமிழ் (Tamil) │ │ │ └─────────────────────────────┘ │ │ ┌─────────────────────────────┐ │ │ │ ○ ಕನ್ನಡ (Kannada) │ │ │ └─────────────────────────────┘ │ │ ┌─────────────────────────────┐ │ │ │ ○ മലയാളം (Malayalam) │ │ │ └─────────────────────────────┘ │ │ │ │ ┌─────────────────────────────┐ │ │ │ Continue │ │ ← Primary Button: 48dp height │ └─────────────────────────────┘ │ Disabled until selection │ │ └─────────────────────────────────────┘

DESIGN SPECIFICATIONS

Property Value
Background White
Illustration Globe with multiple languages icon
Radio buttons 24dp, brand color when selected
List items 56dp height, 16dp horizontal padding
Button Full width minus 32dp margins, rounded 8dp
Scroll Enabled if languages exceed screen

INTERACTIONS

Trigger Action
Tap language Radio selects, button enables
Tap Continue Navigate to Onboarding Carousel
System back Exit app (first screen)