Audio Router

Routing Protocol

1. Classify — Identify audio task from user request
2. Match — Apply signal matching rules below
3. Combine — Audio-visual projects need 2-3 skills together
4. Load — Read matched SKILL.md files before implementation

Quick Route

Tier 1: Core Skills

audio-playback

audio-analysis

audio-reactive

Signal Matching

Primary Signals

• "play audio", "load music", "sound effect"
• "Tone.js", "Player", "transport"
• "loop", "crossfade", "volume"
• "schedule", "timing", "sync to beat"
• "background music", "ambient sound"

• "FFT", "frequency", "spectrum"
• "beat detection", "amplitude"
• "waveform", "audio data"
• "frequency bands", "bass", "treble"
• "analyze", "extract", "measure"

• "visualizer", "audio reactive"
• "respond to music", "sync visuals"
• "pulse on beat", "frequency to color"
• "music driven", "audio visualization"
• "bloom on bass", "particles on beat"

Confidence Scoring

• High (3+ signals) — Route directly to matched skill
• Medium (1-2 signals) — Route with supporting skills
• Low (0 signals) — Start with

  audio-playback

Common Combinations

Simple Audio Player (1 skill)

audio-playback → Load and play audio files

Audio Visualizer (3 skills)

audio-playback → Load and control audio
audio-analysis → Extract frequency/beat data
audio-reactive → Map data to visual properties

Background Music (1-2 skills)

audio-playback → Looping, crossfade, volume
audio-analysis → Optional: beat sync features

Beat-Synced Animation (2-3 skills)

audio-analysis → Beat detection
audio-reactive → Trigger animations on beat
audio-playback → Control playback

Decision Table

Integration with Other Domains

With Post-Processing (postfx-*)

audio-analysis → Bass/high frequency data
audio-reactive → Mapping strategy
postfx-bloom → Audio-reactive glow intensity
postfx-effects → Audio-reactive chromatic aberration

With Particles (particles-*)

audio-analysis → Beat detection, energy levels
audio-reactive → Emission rate mapping
particles-systems → Particle emitter configuration

With GSAP (gsap-*)

audio-analysis → Beat detection
audio-reactive → Timeline control
gsap-sequencing → Beat-synced timeline

With R3F (r3f-*)

audio-playback → Audio context in React
audio-analysis → Data extraction
audio-reactive → Update Three.js objects
r3f-fundamentals → Scene/mesh setup

With Shaders (shaders-*)

audio-analysis → Frequency uniforms
audio-reactive → Uniform update strategy
shaders-uniforms → Pass audio data to shaders

Workflow Patterns

Visualizer Development

1. audio-playback → Set up player and audio context
2. audio-analysis → Configure analyzers and band extraction
3. audio-reactive → Map frequencies to visual properties

Beat-Reactive Experience

1. audio-playback → Load audio
2. audio-analysis → Configure beat detection
3. audio-reactive → Define beat response animations

Ambient Soundscape

1. audio-playback → Looping players, crossfade
   (Single skill usually sufficient)

Temporal Collapse Stack

audio-playback → Cosmic ambient loop, countdown ticks, celebration
audio-analysis → Beat detection, bass/mid/high extraction
audio-reactive → Map to bloom, particles, digit glow, vignette

• Background cosmic ambient audio (looped)
• Tick sound per second (intensifies in final 10)
• Beat detection for particle bursts
• Bass → bloom intensity
• High frequencies → chromatic aberration
• Celebration music at zero

Quick Reference

Task → Skills

Audio Library Quick Reference

Common Frequency Bands

Fallback Behavior

• No specific signals → Start with

  audio-playback

• "Visualizer" mentioned → Full stack: all three skills
• "React to music" →

  audio-reactive

  +

  audio-analysis

• Just playing audio →

  audio-playback

  only
• Performance concerns → Focus on

  audio-analysis

  optimization

Performance Priority

1. audio-analysis

   — Use smaller FFT size (64-128)

2. audio-reactive

   — Apply smoothing to reduce jitter

3. audio-playback

   — Preload audio, reuse players