Explore an interactive WebGL ripple tank
Water Ripple Simulator, also called Ripple Tank, turns the entire play area into a responsive water surface. A click produces a circular disturbance, a drag can create a continuous trail, and several disturbances form crossing patterns as their waves travel across the tank. The result is useful both as a relaxing visual experiment and as an accessible introduction to wave behaviour. Instead of playing a fixed animation, the simulator responds to where, when, and how strongly you interact.
The surface is rendered with WebGL2 so the changing height field can affect lighting, refraction, reflections, sun glint, depth colour, and caustic patterns in real time. Five supplied scene textures place the water above pool tiles, natural sand, river stones, limestone shells, or dark slate. You can also upload a custom image as the backdrop and watch the simulated water distort it.
Five instruments create different experiments
Drop
Drop creates a focused circular impact. Click once for a clean ring, click repeatedly to generate interference, or double-click for a stronger disturbance. Brush size changes the width of the impact and Force controls its amplitude. This is the simplest instrument for comparing isolated waves because each click has a clear center and start time.
Stream
Stream draws a connected path of disturbances while you drag. It is useful for making wakes, curves, letters, and broad moving bands instead of separate rings. Slow strokes leave an easy-to-follow wave path, while quick strokes create tighter overlapping patterns. Hover wake can also generate small ripples that follow the pointer before you press.
Pour and traditional color mixing
Pour adds coloured liquid to the active region while also disturbing the surface. Choose red, blue, or yellow as traditional paint primaries. When Educational Purpose is enabled, equal primary amounts demonstrate familiar RYB results: red and yellow form orange, yellow and blue form green, blue and red form purple, and all three form brown. The current-mix display reports the combination, while Clear mixed liquid removes pigment without resetting every wave or wall.
When Educational Purpose is disabled, the amount poured matters, so unequal proportions create colour-biased mixtures. Colours mix spatially where poured regions meet rather than changing the entire tank at once. This makes the tool useful for discussing the difference between ideal classroom colour rules and gradual visual mixing across a moving surface.
Wall and Erase
Wall paints solid ridges into the tank. Incoming waves reflect from those barriers, making it possible to build channels, corners, islands, narrow openings, or simple obstacle courses. The wall colour is adjustable, and the Erase instrument removes selected wall areas. Right-clicking also erases walls quickly. Undo restores recent edits, while the Walls button clears barriers without calming the water or removing coloured liquid.
Control fluid dynamics
Wave speed changes how quickly a disturbance travels across the tank. Energy retention controls how long motion survives before the surface settles; lower values damp waves quickly, while higher values allow reflections and interference to remain visible for longer. Breeze adds gentle, distributed disturbances that keep the surface from becoming perfectly still. Rain creates impacts at random positions, ranging from occasional drops to a busy shower.
Simulation resolution offers Lite, Fast, Balanced, High, and Ultra options. Higher settings preserve finer wave details but require more graphics processing. Balanced is a practical default for most devices, while Lite or Fast can improve responsiveness on older laptops and phones. The statistics display reports frame rate, simulation dimensions, and the number of generated drops so performance changes are easy to observe.
Pause freezes the evolving simulation without removing its current state. Calm reduces the active wave field so a new trial can begin from still water. Those controls are useful for demonstrations: build an arrangement, pause to explain it, resume to observe the result, and calm the tank before changing one variable.
Adjust optics and surface appearance
The Optics controls change how light reveals the wave field. Sun azimuth rotates the lighting direction, while Sun height moves the light from a low grazing angle to a more overhead position. Refraction controls how strongly the backdrop bends through the moving surface. Sun glint adds bright directional highlights, Caustics strengthens focused light patterns, and Depth tint increases the contribution of the selected water colour.
These settings show why the same wave geometry can look very different under different lighting. Low-angle light may emphasize long ridges, stronger caustics can reveal small focusing patterns, and heavier refraction makes the backdrop appear more distorted. Design and media students can use these controls to study how lighting and material settings affect the readability and mood of an animated surface.
Experiments for physics and science students
Interference and superposition
Place two equal drops a short distance apart and watch the circular fronts overlap. Add both drops at nearly the same time for a more symmetrical pattern, then repeat with a delay between them. Students can describe regions where the combined surface appears stronger or weaker and connect the observation to the idea that overlapping waves add together.
Reflection and barriers
Draw a straight wall, place a drop in front of it, and compare the incoming and reflected patterns. Replace the straight barrier with a corner, curved boundary, channel, or narrow gap. These trials can introduce reflection, confinement, and the effect of obstacle geometry. A screenshot taken at the same elapsed time after each drop makes the results easier to compare in a report.
Damping and wave speed
Keep the instrument, force, brush size, and scene unchanged while testing several Energy retention settings. Time how long the surface remains visibly active or count how many reflections can be seen before the pattern fades. Then repeat while changing Wave speed. This separates how fast a wave travels from how quickly its energy disappears.
Rain and random forcing
Rain is useful for comparing controlled and random inputs. A single manual drop has a known location, while rain continuously introduces impacts across the tank. Students can discuss why a surface under sustained random forcing reaches a busy changing state instead of returning to calm. Breeze provides a gentler version of the same idea.
Useful for art, colour, and design projects
The liquid tools can support introductory colour lessons. Students can predict the result of two primaries, perform the mix, and capture the outcome. Turning Educational Purpose off creates an opportunity to discuss proportions and why real mixtures are not always represented by one fixed textbook colour. The tool uses a traditional RYB-style educational model, which is different from additive RGB light mixing and from the complex pigment behaviour of physical paints.
Visual-design projects can combine a custom backdrop with controlled waves and optics. A logo, photograph, texture, or illustration can be loaded locally, then distorted with refraction and highlighted with caustics. Different scenes can be used to compare material mood: bright pool tiles feel clean and architectural, sand and shells suggest shallow coastal water, river stones create a natural stream bed, and dark slate supports a dramatic low-light composition.
Ideas for computing and graphics projects
Ripple Tank provides a practical example of a real-time browser simulation. Computing students can identify the separate systems involved: pointer input, simulation textures, shader passes, ping-pong framebuffers, procedural audio, scene texture loading, responsive controls, undo snapshots, image export, and MediaRecorder output. A project report can explain how the height field is updated separately from the final shaded image.
Performance experiments can compare frame rate at each simulation resolution. Students can record the reported FPS, identify the point where a device begins to struggle, and discuss the relationship between grid dimensions, pixel processing, and visual detail. This is a useful introduction to performance budgets without requiring students to build a complete fluid solver first.
Capture images and video for reports
Snapshot downloads the WebGL play area as a PNG. Recording captures the animated canvas and procedural water audio, then downloads the result when recording stops. Compatible browsers save MP4; other browsers may use WebM. Because the controls are HTML overlays rather than part of the WebGL canvas, captures stay focused on the water scene.
These exports can be used in presentations, lab reflections, design portfolios, lesson materials, animation studies, and project documentation. A useful workflow is to calm the water, set the scene and optics, perform one repeatable interaction, then capture at a planned moment. Record the settings alongside the media so another student can reproduce the trial.
Controls for focused use
The control panel can be hidden, and Zen mode removes interface distractions for a clean water view. Fullscreen expands the simulator, Sound toggles procedural water effects, and keyboard shortcuts provide quick access to pause, calm, fullscreen, sound, snapshot, panel visibility, Zen mode, undo, and scene presets. On smaller screens the controls become a bottom panel that can be dismissed and restored with a floating button.
Understanding the model’s limits
Ripple Tank is an educational and creative visualization, not calibrated laboratory equipment or a full computational fluid dynamics system. Its waves, colour transport, walls, lighting, and rain are designed to be responsive and visually understandable in a web browser. Measurements taken from the screen should not be presented as real-world values without independent validation.
Used with that limitation in mind, the simulator is valuable for forming hypotheses, comparing controlled settings, demonstrating wave ideas, practising colour relationships, studying interactive graphics, and producing clear visual material. It makes otherwise abstract concepts visible and repeatable while remaining approachable enough to explore without specialized equipment.