Engineered and Created by Deyafa Arsetya for the Next Byte Hacks V3 International Hackathon.
Traditional urban centers are built like impermeable concrete basins. Whenever severe rainfall or monsoon season hits, stormwater has nowhere to soak into the earth, resulting in devastating flash flooding, overburdened sewer systems, and catastrophic property damage.
Yet, when urban planners and civic engineers try to evaluate modern "Sponge-City" green infrastructure retrofits (like biopore tree planting, rain gardens, and permeable pavements), they are often forced to rely on heavy, expensive desktop software or complicated cloud GIS pipelines that take hours to configure.
I created HydroGrid to change that. HydroGrid is a blazing-fast, interactive web lab that empowers anyone—from student researchers to city architects—to visually simulate storm runoff and water infiltration in real-time right inside their web browser.
In a hackathon landscape dominated by simple wrappers over cloud chat prompts and heavy database setups, HydroGrid focuses directly on fundamental algorithms, mathematical physics, and complete client-side reliability:
- Custom Cellular Automata Engine: Calculates fluid dispersion using Von Neumann neighborhood grid physics directly inside your browser memory at smooth framerates.
- Zero Cloud Infrastructure: No required backend accounts, zero server database calls, and zero hosting costs. HydroGrid operates independently and can run completely offline.
- Synthesized Audio Feedback: Employs the native Web Audio API to mathematically generate ambient acoustic rainfall soundwaves and tactile UI interaction cues without external audio files.
- Instant Executive PDF Generator: Creates comprehensive, certified municipal assessment reports on the fly inside the client window for quick stakeholder presentations.
- Benchmark City Profiles: Toggle effortlessly between Legacy Urban Core (1980s Concrete Design), Sponge-City Green Retrofit, and Estuarine Delta Levees to compare baseline absorption performance.
- Infrastructure Palette: Drag, paint, and remodel the neighborhood grid using functional tiles (High-Density Towers, Asphalt Roadways, Deep Biopore Forests, Rain Gardens, Permeable Brick Paving, and Reinforced Levees).
- Real-Time Storm Modeling: Trigger localized cloudbursts or severe monsoons and observe live telemetry charting surface flooding rates versus ecological ground retention.
- Municipal Assessment Export: Generate an instant, formatted printable policy PDF detailing estimated asset value preservation and localized flood prevention metrics.
- Author: Deyafa Arsetya (@yaf7)
- Event: Next Byte Hacks V3 International Hackathon (2026)
- Status: Complete & Production-Ready