Inspiration

Commercial shipping is one of the leading causes of whale population decline—not through spills, but through sound. Underwater noise disrupts whale communication, navigation, and feeding. We wanted to give captains the tools to actually see their acoustic footprint and make smarter routing decisions in real time.

What it does

SonarPath generates three optimized sea routes between ports, automatically rerouting around NOAA Marine Sanctuaries. A live acoustic halo follows the ship as you drag it along the selected path, triggering alerts when it overlaps whale sightings or sanctuary boundaries. Slowing down reduces the noise radius, saves fuel, and unlocks green port discounts—making compliance financially rewarding.

How we built it

Frontend: React + TypeScript. Mapping & Spatial: ArcGIS JS API for spatial rendering and NOAA FeatureLayer for sanctuary boundaries. Routing: searoute-ts for ocean-aware pathfinding. Logic: Fuel costs use a physics-based speed model. AI: The Gemini API powers an on-demand AI captain advisor. Architecture: No backend—runs entirely in the browser.

Challenges we ran into

Our biggest hurdle was a "Routing Identity Crisis." We had to choose between a "smart" cloud-based router that knew exactly where land was but felt laggy, and a local "fast" router that was lightning-quick but "blind" to protected sanctuaries. We eventually built a hybrid solution: using fast local math for the dragging experience while constantly "nudging" the route further out to sea whenever our spatial checks detected a sanctuary overlap.

Mid-build, we also hit a developer’s nightmare: a major NOAA data source broke. Our map went blank because an official government endpoint went offline. We had to pivot instantly, hunting down a working mirror and rewiring our entire data pipeline under the hackathon clock. Balancing these technical pivots while keeping the UI responsive was a massive exercise in code optimization.

Accomplishments that we're proud of

The drag-to-navigate interaction feels surprisingly intuitive—watching the halo pulse and change color as you cross into a sanctuary or near a whale cluster makes the environmental impact tangible in a way raw data never could. We're also proud that slowing down is visibly cheaper, not just ethically better.

What we learned

Spatial reasoning in the browser is genuinely powerful with the right tools. We learned a lot about ArcGIS geometry operations, sea routing constraints, and how to model acoustic propagation simply but convincingly. We also learned that good UX can make compliance feel like a reward rather than a restriction.

What's next for SonarPath

Perfecting the Path: Our immediate priority is refining the routing algorithm. We plan to integrate a more robust Maritime Network Dataset to ensure every route perfectly hugs the coastline and navigates complex island chains without any "land-hopping."

Expanding the Scope: We want to move beyond single-voyage planning. We’re aiming to build a Fleet Management Dashboard that allows shipping operators to monitor the acoustic compliance, fuel savings, and port incentives of dozens of vessels simultaneously in real-time.

Deep-Sea Intelligence: We plan to integrate live AIS vessel tracking and historical whale migration data from OBIS, alongside dynamic weather and ocean current overlays, to make SonarPath the ultimate tool for modern, sustainable navigation.

Incentive Integration: We want to partner directly with actual green port incentive programs to automate the certification process, turning environmental data into instant financial rebates for shipping companies.

Built With

Share this project:

Updates