diff --git a/docs/game_design/INTRO_SEQUENCE_DESIGN.md b/docs/game_design/INTRO_SEQUENCE_DESIGN.md new file mode 100644 index 000000000..e98dee71e --- /dev/null +++ b/docs/game_design/INTRO_SEQUENCE_DESIGN.md @@ -0,0 +1,518 @@ +# ๐ŸŽฌ INTRO SEQUENCE - DESIGN DOCUMENT +## "From Colors to Darkness" - Kai's Amnesia Awakening + +**Created:** January 10, 2026, 04:21 CET +**Duration:** 30-45 seconds +**Purpose:** Emotional setup for entire game narrative +**Style:** Style 32 Dark-Chibi Noir with fast cuts (ADHD energy) + +--- + +## ๐ŸŽฏ CORE CONCEPT: "SPOMIN vs. REALNOST" + +**The Temelj (Foundation):** +- **Kai & Ana:** Twin siblings, separated in chaos +- **DNA Link:** Pink/green dreadlocks (genetic connection) +- **Virus "X-Noir":** Spreads through tech and blood โ†’ creates "Ombiji" (Zombies) +- **Amnesia:** Kai survived basement attack but forgot everything except ONE image: Ana + +**Emotional Arc:** +> "We had colors" โ†’ "Then came darkness" โ†’ "I'm alone with hole in head" โ†’ "Must find her... even if takes whole life" + +--- + +## ๐ŸŽฌ SEQUENCE BREAKDOWN (3 Phases) + +### **PHASE 1: HAPPY FAMILY MEMORIES (15 seconds)** + +**Visual Style:** +- Fast cuts (ADHD energy - 3-5s per shot) +- Blur-to-sharp effect (memories clarifying) +- Bright neon colors (magenta/cyan rim lighting) +- VHS grain texture (nostalgic) +- Style 32 chibi characters + +**Shots (5 total, ~3s each):** + +**Shot 1 (0-3s): Longboard with Father** +- Reference: `/assets/references/aging_system/otac_punk_father.png` +- Scene: Ocean pier, sunny day +- Action: Father teaching Kai to skate +- Father's hand on Kai's shoulder: "Pojdi, sin!" (Go, son!) +- Blur clears when father smiles + +**Shot 2 (3-6s): Dreadlocks at Barbershop** +- Scene: Barbershop mirror +- Action: Stylist adding PINK streak to green dreads +- Kai's excited smile in reflection +- Ana visible in background getting similar style +- Blur clears on mirror reflection + +**Shot 3 (6-9s): Twin Moment with Ana** +- Reference: `/assets/references/aging_system/mlada_ana_twin_prisoner.png` (but happy, not prisoner) +- Scene: University lab (Ana's workspace) +- Action: Both laughing, Ana showing science project +- CLEAREST shot (most important memory) +- No blur - this is what Kai holds onto + +**Shot 4 (9-12s): Birthday Celebration** +- Scene: Home garden/party +- Action: Cake with candles, family together +- Mother and Father present (alive, happy) +- Reference: Both parents from `/assets/references/aging_system/` +- Warm colors, joy + +**Shot 5 (12-15s): Family Portrait** +- Scene: Professional photo setup or casual selfie +- Action: All four smiling (Father, Mother, Kai, Ana) +- Perfect family moment +- Freeze frame for 2 seconds +- This is "what was lost" + +**Text Overlay (Typewriter Effect):** +``` +"Nekoฤ smo imeli barve..." +(We once had colors...) +``` + +**Audio:** +- **Music:** Light, happy indie/lo-fi (slightly grainy) +- **SFX:** Children's laughter, ocean waves, city hum +- **Heartbeat:** Subtle, steady (background) +- **Volume:** 0.4 + +--- + +### **PHASE 2: THE COLLAPSE (15 seconds)** + +**Visual Style:** +- Images start GLITCHING (digital corruption) +- Colors become INTENSE (saturated reds, toxic greens) +- VHS scanlines multiply +- Blur increases (memory breaking) +- Style 32 Noir kicks in (dark atmospheric) + +**Shots (4 total, faster cuts ~4s each):** + +**Shot 1 (15-19s): Virus Spread** +- Visual: Green fluorescent particles spreading +- Digital HUD showing infection progress +- "X-Noir Virus: Outbreak Detected" +- Neon green toxic glow +- Screen glitches heavily + +**Shot 2 (19-23s): Ombiji Appear** +- Silhouettes of zombies (Style 32 shadows) +- Red eyes glowing in darkness +- Crowd of normal people transforms +- Panic, screaming (visual chaos) +- Fast strobe cuts + +**Shot 3 (23-27s): Parents Fight/Flee** +- Reference: `/assets/references/aging_system/otac_punk_father.png` and `mati_punk_mother.png` +- Scene: Parents protecting twins +- Father with longboard as weapon +- Mother pulling kids to safety +- Blur effect HEAVY (Kai can't process) +- Red atmospheric lighting + +**Shot 4 (27-30s): Separation** +- Ana being pulled away (military/scientists) +- Kai reaching for her (slow motion) +- Screen goes RED +- VHS glitch corrupts everything +- Final frame: Ana's face disappearing into static + +**Text Overlay (Typewriter Effect):** +``` +"Potem je priลกla tema..." +(Then came the darkness...) +``` + +**Audio:** +- **Music:** Fast, aggressive punk rock (distorted) +- **SFX:** Sirens, screams, gunshots, chaos +- **Heartbeat:** Rapid, panicked (120 BPM) +- **Volume:** 0.7 โ†’ 1.0 (building tension) + +--- + +### **PHASE 3: AMNESIA WAKE-UP (5-10 seconds)** + +**Visual Style:** +- COMPLETE BLUR (nothing clear) +- Screen goes dark (fade to black) +- Slow fade up to Kai's bedroom +- Kai visible but confused, disoriented +- Camera shake (grogginess) + +**Shots:** + +**Shot 1 (30-33s): Pure Blur/Darkness** +- Black screen with faint VHS scanlines +- Heartbeat gets slower +- Breathing sounds (Kai waking) + +**Shot 2 (33-37s): Kai's Bedroom (Current Day)** +- Reference: Young Kai base sprite +- Scene: Dark bedroom, morning light coming in +- Kai sitting up in bed, confused +- Hand on head (amnesia headache) +- Room details: posters, longboard, minimal + +**Shot 3 (37-40s): Memory Fragment Flash** +- Quick flash of Ana's face (twin memory) +- Only thing Kai remembers clearly +- Purple skin version (memory distortion) +- Reference: `/assets/references/main_characters/ana/master_reference_nobg.png` + +**Shot 4 (40-45s): Gronk's Voice** +- Audio only OR Gronk sprite appears in doorway +- Gronk's silhouette with vape smoke +- "Spet si zaspal, stari... upam, da si sanjal o mojem vapiu." +- (You overslept again, man... hope you dreamed about my vape.) + +**Text Overlay (Typewriter Effect):** +``` +"In ostal sem sam... z luknjo v glavi." +(And I remained alone... with a hole in my head.) +``` + +**Final Text (Typewriter Effect):** +``` +"Moram jo najti. Tudi ฤe mi vzame celo ลพivljenje." +(I must find her. Even if it takes my whole life.) +``` + +**Audio:** +- **Music:** Slow, dark ambient (ethereal) +- **SFX:** Heavy breathing, heartbeat slowing (80 BPM โ†’ 60 BPM) +- **Gronk's Voice:** [AI_VOICE:gronk:custom] with vape background sound +- **Volume:** 0.3 (quiet, intimate) + +--- + +## ๐ŸŽฎ SPECIAL EDITION NOTIFICATION (5 seconds - Optional) + +**Trigger:** If player is buyer #1-20 OR streamer mode detected + +**Visual:** +``` +โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” +โ”‚ โญ SPECIAL EDITION ACTIVATED! โญ โ”‚ +โ”‚ โ”‚ +โ”‚ Gronk Helper Mode: UNLOCKED โ”‚ +โ”‚ (Exclusive for Founder #XX) โ”‚ +โ”‚ โ”‚ +โ”‚ Press [G] to summon Gronk companion! โ”‚ +โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜ +``` + +**Style:** +- Neon magenta/cyan border +- Pulsing glow animation +- 5-second display +- Skip on any key +- Gronk chibi sprite appears briefly + +**Audio:** +- Special unlock chime (vape sound effect) +- Gronk: "Gronk help! Pink is best!" + +--- + +## ๐Ÿ“ TYPEWRITER TEXT SCRIPT (Complete) + +**Phase 1 (Happy Memories):** +``` +"Nekoฤ smo imeli barve..." +``` + +**Phase 2 (The Collapse):** +``` +"Potem je priลกla tema..." +``` + +**Phase 3 (Amnesia Wake-Up):** +``` +"In ostal sem sam... z luknjo v glavi." + +"Moram jo najti. Tudi ฤe mi vzame celo ลพivljenje." +``` + +**Typewriter Settings:** +- Speed: 50ms per character (ADHD-friendly - not too slow!) +- Sound: Subtle typewriter click (0.1 volume) +- Skip: Any key press +- Color: White with neon cyan shadow + +--- + +## ๐ŸŽจ VISUAL EFFECTS SPECIFICATIONS + +### **Blur Effect:** +```javascript +// Phase 1: Blur-to-Clear (memories clarifying) +blurStrength: 10 โ†’ 0 (over 2 seconds per shot) +ease: 'Power2.easeOut' + +// Phase 2: Clear-to-Blur (memories breaking) +blurStrength: 0 โ†’ 15 (over 3 seconds) +ease: 'Power2.easeIn' + +// Phase 3: Maximum Blur (amnesia) +blurStrength: 20 (total darkness) +``` + +### **VHS Glitch Effect:** +```javascript +// Phase 1: Light grain +scanlineIntensity: 0.2 +glitchFrequency: 0 (no glitches yet) + +// Phase 2: Heavy corruption +scanlineIntensity: 0.7 +glitchFrequency: 2.0 (glitch every 500ms) +colorShift: true (RGB separation) + +// Phase 3: Minimal +scanlineIntensity: 0.1 +``` + +### **Color Grading:** +```javascript +// Phase 1: Happy/Warm +saturation: 1.2 +brightness: 1.1 +temperature: 'warm' (orange tint) + +// Phase 2: Intense/Toxic +saturation: 1.5 +brightness: 1.0 +reds: +50% (danger) +greens: +70% (virus) + +// Phase 3: Desaturated/Cold +saturation: 0.6 +brightness: 0.8 +temperature: 'cold' (blue tint) +``` + +--- + +## ๐Ÿ”Š AUDIO TIMELINE + +**0-15s (Happy Memories):** +- Track: Light indie/lo-fi music +- Tempo: 100 BPM +- Mood: Nostalgic, warm +- Volume: 0.4 + +**15-30s (The Collapse):** +- Track: Fast punk rock (distorted) +- Tempo: 180 BPM +- Mood: Chaos, panic +- Volume: 0.7 โ†’ 1.0 (crescendo) +- SFX: Layered chaos (sirens, screams, gunfire) + +**30-45s (Amnesia Wake-Up):** +- Track: Dark ambient (drone) +- Tempo: N/A (atmospheric) +- Mood: Confused, lonely +- Volume: 0.3 +- SFX: Heartbeat (60 BPM), breathing, Gronk's voice + +**Transitions:** +- Crossfade duration: 1 second +- No silence gaps (seamless flow) + +--- + +## ๐Ÿ“‚ REFERENCE ASSETS REQUIRED + +**Images (Happy Memories):** +- Otac (alive): `otac_punk_father.png` +- Mati (alive): `mati_punk_mother.png` +- Mlada Ana (happy version): Generate from `mlada_ana_twin_prisoner.png` but smiling +- Young Kai: `/assets/references/main_characters/kai/master_reference_nobg.png` + +**Images (The Collapse):** +- Zombie silhouettes: Generate Style 32 shadow zombies +- Virus particles: Generate neon green toxic effect +- Parents fighting: Action poses from alive references + +**Images (Amnesia):** +- Kai bedroom: Generate dark bedroom scene +- Ana memory flash: `master_reference_nobg.png` (purple version - memory distortion) +- Gronk silhouette: `/assets/references/npcs/gronk/` (if exists) + +**Audio:** +- Happy music: Find CC0 indie/lo-fi track +- Punk rock: High-energy distorted track +- Ambient: Dark drone atmosphere +- SFX: Kenney.nl packs, Freesound.org +- Gronk voice: Edge-TTS generated + +--- + +## ๐Ÿ’ป IMPLEMENTATION GUIDE FOR AGENT + +### **IntroScene.js Structure:** + +```javascript +class IntroScene extends Phaser.Scene { + create() { + // Initialize systems + this.typewriterSystem = new DynamicTypewriterSystem(this); + this.audioSystem = new HIPOAudioSystem(this); + + // Play sequence + this.playPhase1HappyMemories(); + } + + playPhase1HappyMemories() { + // Duration: 15 seconds + // 5 shots, 3s each + // Blur-to-clear effect + // Typewriter text: "Nekoฤ smo imeli barve..." + + this.showShot('otac_longboard', 0, 3000, {blur: 10 โ†’ 0}); + this.showShot('dreads_barbershop', 3000, 6000, {blur: 10 โ†’ 0}); + this.showShot('ana_twin_moment', 6000, 9000, {blur: 0}); // Clearest + this.showShot('birthday_party', 9000, 12000, {blur: 5 โ†’ 0}); + this.showShot('family_portrait', 12000, 15000, {blur: 5 โ†’ 0, freeze: 2000}); + + this.time.delayedCall(15000, () => this.playPhase2Collapse()); + } + + playPhase2Collapse() { + // Duration: 15 seconds + // 4 shots, faster cuts + // Glitch effect intensifies + // Typewriter text: "Potem je priลกla tema..." + + this.showShot('virus_spread', 15000, 19000, {glitch: 'heavy', green: +70%}); + this.showShot('ombiji_appear', 19000, 23000, {glitch: 'extreme', strobe: true}); + this.showShot('parents_fight', 23000, 27000, {blur: 15, red: +50%}); + this.showShot('ana_separation', 27000, 30000, {glitch: 'corruption', red: 100%}); + + this.time.delayedCall(30000, () => this.playPhase3Amnesia()); + } + + playPhase3Amnesia() { + // Duration: 10 seconds + // Blur โ†’ Kai's room โ†’ Memory flash โ†’ Gronk + // Typewriter text: "In ostal sem sam..." + + this.cameras.main.fadeOut(2000, 0, 0, 0); + this.time.delayedCall(3000, () => { + this.cameras.main.fadeIn(2000); + this.showShot('kai_bedroom', 33000, 37000, {blur: 5}); + this.showShot('ana_memory_flash', 37000, 38000, {flash: true}); + this.playGronkVoice(40000); + + this.time.delayedCall(45000, () => { + if (this.checkSpecialEdition()) { + this.showSpecialEditionNotif(); + } else { + this.scene.start('GameScene'); + } + }); + }); + } + + checkSpecialEdition() { + // Check buyer ID or streamer mode + return (buyerID <= 20 || streamerMode); + } +} +``` + +--- + +## ๐ŸŽฏ KEY DESIGN PRINCIPLES + +**1. ADHD Energy (Fast Cuts):** +- No shot longer than 5 seconds +- Rapid transitions keep attention +- Skip button ALWAYS available +- Visual variety prevents boredom + +**2. Emotional Impact:** +- Happy โ†’ Sad = Maximum contrast +- Clear memory (Ana) = Quest motivation +- Parents sacrifice = Depth +- Amnesia = Player relatability + +**3. Story Clarity:** +- 3 text overlays tell complete story +- Visual storytelling (no exposition dump) +- Mystery preserved (what happened to Ana?) +- Motivation clear (find her!) + +**4. Style Consistency:** +- All Style 32 Dark-Chibi Noir +- Neon magenta/cyan throughout +- VHS aesthetic (memory theme) +- Thick outlines maintained + +--- + +## ๐Ÿ“Š TECHNICAL REQUIREMENTS + +**Assets Needed:** +- 15+ reference images (some need generation) +- 3 music tracks (happy/punk/ambient) +- 20+ SFX (layered chaos) +- 1 AI voice (Gronk) +- Typewriter font (monospace) + +**Phaser Effects:** +- Blur PostFX +- VHS Scanline shader (custom) +- Color grading pipeline +- Fade transitions +- Glitch effect (RGB separation) + +**Performance:** +- All images preloaded +- Audio streaming (not preloaded) +- Effects optimized for 60 FPS +- Skip function instant (no delay) + +--- + +## ๐Ÿš€ NEXT STEPS FOR IMPLEMENTATION + +1. **Generate Missing Assets:** + - Happy Ana (smiling version) + - Zombie silhouettes + - Virus particle effect + - Kai's bedroom + +2. **Create IntroScene.js:** + - Phase system + - Timeline management + - Effect controllers + +3. **Test Sequence:** + - Verify timing (30-45s total) + - Check skip functionality + - Audio sync + - Special Edition trigger + +4. **Polish:** + - Blur curves smooth + - Glitch timing Perfect + - Music transitions seamless + - Text readable + +--- + +**Document Status:** โœ… Complete Design +**Ready For:** Agent Implementation +**Next Phase:** Asset Generation โ†’ IntroScene Coding + +*Created by: David "HIPO" Kotnik* +*Hipodevil666 Studiosโ„ข* +*"From colors to darkness - Kai's journey begins"* ๐ŸŽฌ๐Ÿ›น๐Ÿ’œ