What's Included
- Skia shader component (VoiceBlob.tsx)
- Mic capture + level container (Container.tsx)
- SkSL fragment shader with FBM noise
- Reanimated shared-value level smoothing
- Haptic mic toggle controls
About the Project
The visual is one SkSL fragment shader run through @shopify/react-native-skia's RuntimeEffect, filling the screen via a Skia Canvas. Uniforms are pushed every frame with a useClock-driven useDerivedValue so the animation lives entirely on the UI thread — no JS re-renders. Microphone loudness comes from react-native-nitro-sound's metering callback; the dB reading is mapped to a 0..1 level and fed into a Reanimated shared value with a fast-attack/slow-release withTiming curve so the blob snaps up on speech and drains on silence. The top edge is shaped with layered fractal (FBM) noise for rounded cloud lobes rather than sine waves. Recorder start/stop is serialized through a promise chain and uses pause/resume to keep the iOS audio session warm. Built on Expo SDK 56 (Reanimated v4, RN 0.85); requires a development build (Skia + Nitro native modules, not Expo Go) and microphone permission on iOS and Android.