Ocean Disaster Management
Delivered frontend and integration for a real-time disaster reporting platform, connecting citizen workflows to dependable hazard response pipelines.
For the SIH 2025 Ocean Disaster Management Platform, I contributed across frontend delivery and backend integration to make real-time citizen reporting reliable under emergency conditions. I built and stabilized key React + TypeScript user flows including authentication, registration, dashboards, and reporting interfaces with reusable, responsive UI patterns.
Project At A Glance
Timeline
Nov 2025
Industry
GovTech · Public Safety
Contribution
Frontend delivery, dashboard and reporting UX, role-based access flows, and backend integration for emergency reporting
Collaboration
Project Visual
Ocean Disaster Management
Summary
What this project demanded.
For the SIH 2025 Ocean Disaster Management Platform, I contributed across frontend delivery and backend integration to make real-time citizen reporting reliable under emergency conditions. I built and stabilized key React + TypeScript user flows including authentication, registration, dashboards, and reporting interfaces with reusable, responsive UI patterns.
Role
Frontend Lead
Year
2025
Problem Space
The system had to convert urgent, high-variance field inputs into structured hazard data quickly and safely, while keeping APIs, payload contracts, and UI states consistent enough for deployment-grade reliability.
The system needed to work as a modern React + TypeScript application with strong routing, auth, API communication, and dashboard structure while still being adaptable for future mapping, offline capability, AI signal analysis, and multilingual support.
Capability 01
React 18
Capability 02
TypeScript
Capability 03
Vite
Capability 04
Axios
Mission
The platform had to help people act quickly during ocean-related emergencies.
The system was built as a mobile and web platform for real-time coastal hazard reporting. Citizens could submit text, photos, videos, and geotagged updates, while officials and analysts needed dashboards and role-based visibility to validate and respond.
01
Field realities
- Reports may come from stressed users in weak-network conditions
- Citizens need simple flows for urgent updates, not administrative complexity
- Officials and analysts need structured visibility into the same event stream from different perspectives
02
Delivery priorities
- Build a responsive React + TypeScript product with reusable UI and route structure
- Support role-based access, dashboard metrics, and report workflows through backend-connected screens
- Create foundations for real-time maps, AI signal scanning, multilingual support, and offline capability
Signal
3
Core user perspectives shaped into the product: citizens, officials, and analysts
Signal
multi
Support planned for text, photos, videos, mapping, and AI-powered signal review
Signal
1 base
A scalable React + TypeScript foundation for future disaster-response expansion
Insight
In emergency products, speed only matters if the interface is clear. Users should never have to wonder what the system accepted or what to do next.
Core Interaction Shifts
The product decisions that changed how the experience felt.
Shift 01
Deployment-Ready API Wiring
Updated critical integration layers before deployment so registration, report posting, and hazard updates mapped cleanly to backend endpoints.
Shift 02
Reliable Reporting Workflows
Helped implement and validate report/create-post style backend flows and ensured frontend types aligned with real response contracts.
Shift 03
Emergency-Friendly UX Execution
Improved responsive layouts, interaction consistency, and role-aware navigation so both citizens and officials could use the platform quickly in high-stress contexts.
Influence & Validation
What changed because of the work.
The platform advanced from isolated screens to a cohesive, deployment-ready system for fast reporting, structured hazard tracking, and response coordination.
Improved API contract consistency across frontend and backend for core reporting actions
Stronger resilience in validation/error handling for live usage conditions
Cleaner reusable UI structure for future expansion of disaster workflows