Resonance Lab is an interactive, real-time Chladni Plate Simulator that visualizes acoustic resonance patterns. By simulating the physics of sand particles on a vibrating plate, it creates mesmerizing, complex geometric patterns known as Chladni figures.
This project was vibe coded in March 2026 using Gemini 3.1 Pro Preview.
- Real-time Physics Simulation: Accurately models the behavior of particles on a vibrating surface.
- Interactive Controls: Adjust frequency, amplitude, and kick strength in real-time.
- Visual Effects: Features like "Velocity Glow" and "Motion Blur" for stunning visual feedback.
- Audio Synthesis: Generates synchronized audio tones based on the current frequency.
- Shareable States: Settings are encoded in the URL, allowing you to easily share specific patterns with others.
- Keyboard Shortcuts: Quick access to essential controls for a seamless experience.
A- Activate/Deactivate systemSpacebar- Trigger a manual kickP- Play/Pause automatic kick tempoM- Mute/Unmute sound+/=- Increase frequency-/_- Decrease frequencyH- Hide/Show control panel
The simulation calculates the displacement of a 2D plate at a given frequency and amplitude. Particles (representing sand) are then moved according to the gradient of this displacement, causing them to collect at the nodal lines (areas of zero vibration).
This project is built using React, TypeScript, and the HTML5 Canvas API for high-performance rendering.
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run buildCreated by @escaroda / @callsomeoneyoulove.