# Jelly Sheet: Interactive Web Physics Simulation

A technical exploration of fluid motion and interactive web-based physics rendering.

- **Source:** [Hacker News: Front Page](https://brifing.si/source/b07aa772-b1a0-4a76-aa18-719c6f9e2dde)
- **Published:** 2026-11-04
- **Topic:** [Software & Engineering](https://brifing.si/c/engineering)
- **Original article:** <https://mrdoob.github.io/codevember-2026/01/>
- **On Brifing:** https://brifing.si/s/67935e49-4157-490f-a5b9-90760b0fbc9f

## Interactive Physics Demonstration

The Jelly Sheet project, hosted on the Codevember 2026 repository, showcases a dynamic physics simulation within a browser environment. Developed by Mr.doob, the project focuses on fluid-like geometry manipulation. It provides a real-time interactive experience that highlights advanced rendering capabilities, allowing users to engage directly with the simulated physical properties of the sheet.

## Codevember Event Context

Codevember serves as a platform for developers to push the boundaries of creative coding throughout the month of November. This specific entry, labeled as the first project of the series, emphasizes the intersection of aesthetic design and functional engineering. It demonstrates how lightweight web technologies can handle complex mathematical models for visual output.

## Technical Rendering Framework

The simulation utilizes browser-native rendering techniques to achieve its jelly-like behavior. By manipulating vertex data in real-time, the project achieves a high degree of responsiveness to user input. This approach avoids heavy external dependencies, relying instead on efficient JavaScript execution to maintain a smooth frame rate during the interactive physics calculations.

## Geometry and Material Properties

The core of the Jelly Sheet involves a grid-based mesh that responds to cursor interactions. Each point within the sheet is governed by spring-like constraints, creating the characteristic wobbling effect. These parameters are tuned to simulate low-friction surfaces, ensuring that the visual feedback remains consistent with the intended fluid-like physical behavior of the object.

## User Interaction Mechanics

Interaction is facilitated through mouse or touch events that exert force on the mesh vertices. As the user moves their cursor across the screen, the sheet deforms in response to the applied vectors. This direct manipulation highlights the precision of the underlying physics engine in calculating displacement and restoring forces for every frame.

## Performance Considerations

Maintaining performance in browser-based physics requires careful management of the update loop. The Jelly Sheet implementation minimizes overhead by optimizing the calculation of vertex positions. By limiting the complexity of the mesh grid, the simulation remains performant across various devices, demonstrating the viability of complex visual effects in standard web browsers.

## Design and Engineering Synergy

This project exemplifies the synergy between design-led creative coding and robust engineering practices. While the visual output is purely aesthetic, the underlying logic requires a solid understanding of vector math and coordinate systems. It serves as a practical case study for developers looking to integrate interactive physics into modern web-based user interfaces.

## Impact on Web Animation

The Jelly Sheet project underscores the evolving potential of the web as a medium for high-fidelity interactive experiences. By leveraging browser capabilities, such experiments push the limits of what is possible without specialized plugins. It remains a reference point for developers aiming to implement fluid, responsive, and physically accurate animations in projects.

## Sources covering this story

- https://mrdoob.github.io/codevember-2026/01/ — 

---

_Summary written by Brifing from the original reporting. Copyright in the original article belongs to its publisher; read the full piece at the link above._
