🎬 MEDIA DESIGNER PORTAL

🎮 Game Designer

Audio Preview

Select a sound or video to preview

Sound Properties

🎵 No sound selected

Assign Sound to Designer Context

On Break drag sound here
On Interact drag sound here
On Spawn drag sound here
Ambient Loop drag sound here

Target Selection

Upload Audio / Video to R2

📁
Drop audio or video files here
.wav .mp3 .ogg .webm .m4a .mp4 — max 50 MB each

After uploading, click Refresh to see new entries appear in the library. Category assignment will be saved to the manifest.

Upload History

📤 No uploads yet this session

Media Designer Portal — Quick Reference

Media Library (Left Sidebar)

Uploaded Videos (fetched from R2) appear first, followed by 536+ sounds organized into 32 categories: UI, Movement (incl. 8 stereo footsteps), Combat, Magic, Environment, Collectible, Coins & Currency (coin-1/2 + SQ coin variants + pickup sounds), Creature, Food Pickup (HP/Focus/Energy/Fatigue pickup sounds), 20 SFX sub-categories (alarms, animal, atmosphere, brass, chiptune, clang, clicks, crunches, death, dialog, doors, electronic, explosions, misc, ocean, parry, scratches, steam, success, text scroll), Card Sounds, Music — Songs, Music — Cyberleaf, Music — Aila Scott, plus Pet/Enemy placeholder stubs.

The library is baked as static HTML — it works offline without fetching the manifest. When the manifest loads, it enriches metadata. Use the sort dropdown above the search bar to reorder (Default, Name A-Z, Category, Date Newest). Category headers collapse/expand on click.

Preview (This Panel)

Select a sound, then hit Play to stream it. The waveform visualizer shows live audio data via AnalyserNode. Volume slider adjusts in real-time during playback. Works for both short SFX and full-length music tracks (streaming, no full download).

Assignment

Wire sounds to game entities. Select a sound in the library, switch to the Assign tab, pick a context (Asset, Map, Interior), choose an entity, then click the assign button on any event slot. Assignments persist in localStorage and can be exported as JSON.

Upload

Drag audio/video files into the dropzone (max 50MB each). Choose a destination folder (SFX, Music, Video) and optionally a category from the dropdown (e.g. Music — Songs for artist-uploaded tracks). Click Upload All. Files go to the eyesonly-assets R2 bucket. After uploading, click Refresh to see new entries in the library. Supported formats: .wav .mp3 .ogg .webm .m4a .mp4 .opus

For music contributions: select destination Music (audio/music/) and category 🎵 Music — Songs. The manifest ID is auto-derived from the filename.

Inspector (Right Panel)

Shows metadata for the selected sound: key, source path, category, loop flag, display name, tags. Edit fields to override properties. The "Assignments" section shows everywhere this sound is currently wired.

Actions section: Rename ID — prompts for a new kebab-case manifest ID, renames both WebM + MP3 files on R2 via copy+delete, records in the manifest diff. Mark Delete — toggles delete marking (strikethrough + red tint), reversible until synced. Missing-asset warnings appear if the gap check flagged the sound.

Header Actions

Refresh — re-fetches the manifest from the worker for metadata enrichment.
Save Assignments — persists current assignments to localStorage.
Export JSON — downloads sound-assignments.json mapping file.
Verify Assets — runs server-side manifest→R2 gap check, flags missing sounds with red border + ⚠️ badge.
Sync N Deletes — pushes all marked-for-deletion sounds to R2 batch delete (behind confirmation modal). Cannot be undone.
Export Manifest Diff — downloads a JSON file with all renames, deletes, aliases, and broken refs for merging into the repo.

Keyboard Shortcuts

Space — Play/Pause preview
Escape — Stop preview

Using from File System

The portal works when opened directly from disk (file://). All audio fetches are automatically rebased to https://flapsandseals.com. The manifest fetch is optional — the static library functions without it.

Audio Pipeline

All assets on R2 are transcoded to WebM/Opus (primary) + MP3 (fallback for Safari < 15.4). Manifest src fields reference .webm paths. Portal data-src attributes match. R2 is dumb storage — the manifest in the repo is the source of truth.

Manifest Diff Workflow

The portal exports a manifest diff (renames/deletes/aliases). That diff is merged into the repo, validated by scripts/manifest-gap-check.sh, then deployed. R2 remains immutable storage with no live manifest authority. During transitions, the alias layer in the diff maps old IDs → new files for one release cycle, then prunes.

Categories (536+ entries, 519 in manifest)

🖥 UI9
🏃 Movement (incl. 8 footsteps)28
⚔️ Combat43
✨ Magic22
🌿 Environment29
💎 Collectible24
🪙 Coins & Currency8
🐾 Creature5
🍔 Food Pickup4
SFX (20 sub-categories)204
🐾 Pet Sounds0 / 5
👹 Enemy Footsteps0 / 24
🃏 Card Sounds103
🎵 Music — Songs20
🎮 Music — Cyberleaf18
🎹 Music — Aila Scott14

Card Sound Families (103 SFX)

FamilyCountUsage
deal_card17Card dealt from deck
deal_card_loop6Rapid deal sequence
flip_card16Card reveal / flip over
fold_hand15Hand fan collapse
hand_shuffle8In-hand shuffle
pick_up_card12Card pickup / draw
place_card11Card deploy / play
shuffle8Full deck shuffle
slide_card10Card slide / discard

Footstep Engine (v2 — Time-Based Cadence)

8 stereo footstep samples (L/R × 4 terrains) served from R2. The runtime AudioSystem.tickFootsteps() runs every frame with time-based cadence (walk=229ms, sprint=115-229ms fatigue-scaled), strict L-R alternation, stereo panning (L=-0.22, R=+0.22), floor-depth volume + pitch scaling, injury limp mode (HP <30%), player volume ×0.40 (60% reduction), fatigue-based sprint deceleration (0→115ms, 100→229ms), and ±5% vol / ±2% pitch humanization. See docs/FOOTSTEP_AUDIO_SYSTEM.md for full spec.

BiomeTerrain
Forest, Lakegrass
Cave, Office, Mall, Industrial, Aerospacestone
Ski Mountainsand
Junkyard (fallback)dirt
All interiorsstone
DepthWalk VolRun Vol
Exterior0.700.80
Shallow interior (N.N)1.051.20
Deep interior (N.N.N)1.201.35

Collectible Sounds Canon (Phase 4.5)

All collectible types have canonical pickup sounds. Ammo/Gemcoin-1. Currency/Low-tier Keycoin-2. Quest Keygrab-item-2. Itemsgrab-item-1. Cards use a 3-phase sequence: pick_up_cardplace_card (+180ms) → rumble-1 (+400ms, on backup overflow). Food uses resourceType: HP → sq-sq-pickup-success2, Focus → sq-sq-pickup-success1, Energy → sq-sq-pickup, Fatigue → sq-sq-pickup-quick. See docs/AUDIO_WIRING_ROADMAP.md Phase 4.5.

Door Contract Audio (Phase 10)

Floor transitions produce sound sequences derived from the layer distance between source and target floors. Three token types — DoorOpen, Ascend/Descend, DoorClose — combine to form a sonic navigation language. Uses 12 active manifest keys from the 🚪 DOORS and 🪜 TRANSITIONS categories. Timing: DoorOpen at 0ms, vertical at +250ms (~30% overlap), DoorClose at +600ms. Pre-fade delay of 350ms lets the player hear the door creak before the screen fades. See docs/BUILDING_INTERIOR_SYSTEM.md and docs/AUDIO_WIRING_ROADMAP.md Phase 10.

Planned: Breakable Audio (Phase 11)

Breakable HP rebalanced to 3.0–5.5 (3–5 kicks at 1.1 damage). Progressive kick audio: attack-5attack-4attack-3 as damage ratio drops. Break event layers: attack-3 + material_break (+20ms) + whoosh-2 (+40ms) + debris echo (2–4 sounds at 80–180ms). 5 material types (wood, glass, metal, organic, plastic). Needs 15–16 new sound assets. See docs/BREAKABLE_AUDIO_SYSTEM.md.

Mobile Usage

On portrait mobile (<768px), the layout stacks vertically. Tap the Media Library header to collapse/expand the sidebar. The center panel and inspector scroll independently. On landscape / tablets (768–1024px) the sidebar widths are reduced to fit.

Planned: Pet Footsteps

Per-pet-type movement sounds: RUMBA gets a one-shot lullaby hum on initial movement only. HUMANOID gets high-humanization L/R steps. MEGA gets low-humanization heavy thuds with wider pan. 5 assets needed.

Planned: Enemy Footsteps

Pathing enemies produce distance-attenuated footstep sounds. 3 weight classes (light/medium/heavy) × 2 sides × 4 terrains = 24 assets. Until created, player footsteps reused with pitch/vol transforms. See docs/AUDIO_WIRING_ROADMAP.md Phase 4.2 + Phase 8.

Planned: Footprint Ground Effects

Persistent visual footprints that decay over time. Enemy AI queries footprints near patrol path to accumulate suspicion. Stealth bonus modulates decay rate. See Phase 8.2 in roadmap.

Roadmap: Music Slicer

A future Slicer tab will allow cutting segments from full-length music tracks to create SFX snippets directly in the portal. Waveform region selection, preview, fade in/out, batch export to R2. See docs/AUDIO_WIRING_ROADMAP.md Phase 7 for the full spec.