Orb Shader Animation with React Native Skia

The **Orb** component is a GPU-accelerated shader animation built with **React Native Skia**, designed to render smooth, dynamic glowing effects. It responds in real time to **Reanimated SharedValues**, enabling you to animate its appearance using gestures, timing functions, or live audio input. The `Orb` component renders a glowing sphere whose brightness and color are driven by the `intensity` shared value. Since `intensity` is a **Reanimated SharedValue**, it can be smoothly animated with transitions or linked to external input sources for real-time feedback. When `hueByIntensity` is enabled, the orb’s hue shifts dynamically based on the intensity level, creating a vibrant, reactive visual effect. As an example, you can pass `intensity` as a metering shared value obtained from the **Expo Audio** API’s microphone input. This setup allows the orb to react to your voice in real time — glowing and pulsing as you speak into the microphone. The optional `autoRotate` property introduces subtle rotation, enhancing the perception of depth and motion in the animation. #### Usage ```tsx controlling brightness hueByIntensity // Adjusts hue based on intensity autoRotate // Enables slow, automatic rotation /> ``` #### Features * High-performance GPU rendering with **React Native Skia** * Real-time reactivity through **Reanimated SharedValues** * Seamless integration with live audio metering via **expo-audio** * Configurable hue, intensity, and rotation parameters * Ideal for visualizers, ambient UI effects, and interactive feedback The **Orb** component provides a flexible, performance-optimized foundation for creating immersive, sound-responsive animations in React Native applications. The initial [tweet](https://x.com/mironcatalin/status/1980357793099157962) where I showcase it (sound on 🔉)