llloud

Inspiration Cities are louder than ever. In New York City, constant construction, screeching subway curves, sirens, and honking dominate the sensory landscape. Standard navigation tools like Google Maps or Apple Maps optimize strictly for time and distance, frequently dragging pedestrians through the most chaotic avenues and high-decibel corridors.

LLLoud was inspired by a simple question: What if navigation apps optimized for peace of mind instead of just speed? We wanted to build a "quiet navigator" that empowers urban walkers to claim their commute back, routing around noise hotspots, active construction, and traffic-clogged corridors to find a serene walk home.

What it does LLLoud is a smart, interactive pedestrian routing and noise-monitoring web application designed for NYC.

Dual-Route Navigation: Offers a clean, high-contrast choice between the Fastest Commute (direct via main avenues with higher noise exposure) and the Avoid Noise route (which aggressively detours around noise zones). Live Decibel Monitoring: Accesses the user’s microphone using the Web Audio API for real-time local decibel monitoring while walking. Dynamic Noise Heatmap: Renders an interactive map featuring "Quiet Havens" (parks and pedestrian zones) alongside real-time 311 noise complaint clusters, active construction reports, and user-submitted noise warnings. Interactive Navigation HUD: A mobile-responsive navigation mode with turn-by-turn guidance, live location simulation, and a decibel elevation profile chart showing the noise level landscape along your path.

How we built it Frontend Core: Built with React, TypeScript, and Vite for a fast, responsive single-page application. Interactive Maps: Powered by Leaflet. Routing Engine: Built on top of the Valhalla Routing Engine API, dynamically generating pedestrian routes. We designed a custom routing algorithm to inject detour waypoints around detected noise hazards along the path. Acoustic Processing: Leveraged the browser's Web Audio API to analyze real-time audio frequencies, calculate sound pressure levels (SPL), and display live decibel readings.

Challenges we ran into Valhalla Routing Preferences: Valhalla naturally prefers routing pedestrians through pedestrian plazas and parks. While usually great, this occasionally caused conflicts where the routing engine would force a detour right back into a noisy main street to satisfy secondary path options. We solved this by streamlining the app to compare only the two most distinct paths (Fastest and Avoid Noise), allowing the avoidance algorithm to choose the absolute best detour without constraint. Leaflet Tile Styling & Browser Rendering: Applying complex CSS filters to render raster map tiles in a custom style often caused GPU sub-pixel blur and yellow color casts. We iterated on non-inverted SVG/CSS filters to achieve a washed-out white backdrop with sharp, high-contrast street strokes. Multi-Source Data Merging: Combining historic NYC 311 complaints, real-time user-logged noise logs, and community reports into a single, cohesive spatial cost function for routing calculations.

Accomplishments that we're proud of

Dynamic Detours: Successfully implementing a path-hazards collision algorithm that automatically generates perpendicular detour coordinates to guide pedestrians around noise zones. Legible Design Aesthetic: Achieving a premium, high-visibility user interface that feels native to mobile screens and is easy to read while walking on a bright sunny day. Real-time Navigation HUD: Building a fully interactive navigation simulator that projects turn-by-turn steps and lets users trace decibel variations along their route.

What we learned

Spatial Geography & Bounding Boxes: Managing custom geo-coordinate boxes to find, filter, and weigh noise hazards near the user's route. Simplifying the User Experience: Initially, we had three route options (Fastest, Quietest, Avoid-Noise). We realized this diluted the interface and compromised the routing logic. By stripping it down to two clear choices (Fastest vs. Avoid Noise), we made the product much more intuitive and highly performant.

What's next for llloud

Crowdsourced Audio Mapping: Implementing background passive audio gathering (with opt-in privacy) to build a community-driven, block-by-block live noise map of the city. Machine Learning Noise Predictions: Training models on historical 311 complaints, traffic patterns, and construction schedules to predict street noise levels based on the time of day. Wearable Integration: Bringing haptic turn-by-turn alerts to smartwatches, allowing walkers to navigate quiet paths strictly through wrist vibration prompts without looking at their screens.