InspirationInspiration
Floods are one of the most dangerous natural disasters affecting many communities. We wanted to build something simple that helps people quickly understand what to do in emergency situations without needing technical knowledge.
What it does
FloodSafe is an interactive awareness website that:
Shows safety tips for before, during, and after floods Provides emergency checklists users can track Displays simulated weather and flood alerts Tracks preparedness progress Works instantly in the browser without installation How we built it
We built the project using:
HTML for structure CSS for modern UI design and layout JavaScript for interactivity like alerts, checklist saving, and progress tracking LocalStorage to save user checklist data even after refreshing Challenges we ran into Designing a simple UI that still looks professional Managing checklist saving and progress updates Keeping everything in one file while maintaining clean structure Making the experience feel realistic but still beginner-friendly What we learned
We learned how to:
Combine frontend technologies into a real project Use JavaScript for interactive features Store data in the browser using LocalStorage Improve UI design for better user experience What’s next
In the future, we plan to:
Add real weather API integration Include live flood alerts Add map-based emergency zones Make it mobile app friendly (PWA version)
What it does
How I built it
Challenges I ran into
Accomplishments that I'm proud of
What I learned
What's next for Untitled
Built With
- css3
- html5
- javascript
- responsive
- web
