SafeSchool AI

Disaster Preparedness & Emergency Response Platform for Schools and Colleges

---

Problem

Schools and colleges rarely have an accessible, engaging way to teach disaster preparedness. Safety drills are infrequent, printed manuals go unread, and students have no real-time visibility into local weather hazards that could affect their campus — earthquakes, floods, fires, cyclones, and tsunamis remain abstract risks until disaster strikes.

Solution

SafeSchool AI is a single-page web application that turns disaster education into an interactive, gamified experience. It combines live weather intelligence, location-aware hazard mapping, bite-sized learning modules, scenario-based simulations, and an AI safety assistant into one authenticated platform for students, teachers, and administrators.

Development Timeline

SafeSchool AI was designed and built in iterative phases between December 2025 and February 2026, covering core architecture, the disaster-data integrations, the learning/simulation content library, and the gamification layer. The codebase is now being published and prepared for production deployment.

---

Key Features

Module	Description
Live Dashboard	Real-time weather conditions, active alerts, and quick stats pulled from the user's geolocation
Disaster Alerts	Auto-generated severity-ranked alerts (extreme heat, high wind, storms, flooding) derived from live weather data
Live Disaster Map	Interactive Leaflet/OpenStreetMap view with risk zones, shelters, and active alert overlays centered on the user
Learning Modules	50+ searchable, filterable lessons covering earthquakes, floods, fires, cyclones, tsunamis, first aid, and evacuation
Simulation Games	10 scored, multiple-choice emergency-response simulations with instant explanations, scores persisted to Supabase
AI Safety Assistant	LLM-backed (Claude) conversational guidance for disaster protocols, first aid, and live weather queries, with rule-based fallback
Teacher Resources	Curated guides, videos, and templates for classroom use
Achievements & Certificates	12-badge gamification system, unlocked dynamically from real progress data, with a downloadable Certificate of Completion
Authentication	Email/password auth via Supabase with protected routing

---

Architecture

flowchart TD
    User[Browser / Student or Teacher] -->|HTTPS| SPA[SafeSchool AI - React SPA]
    SPA -->|Auth + progress/activity data| Supabase[(Supabase Auth + Postgres)]
    SPA -->|Geolocation| Geo[Browser Geolocation API]
    Geo --> SPA
    SPA -->|Current weather| OpenMeteo[Open-Meteo API]
    SPA -->|Reverse geocoding| Nominatim[OpenStreetMap Nominatim]
    SPA -->|Map tiles| OSMTiles[OpenStreetMap Tile Server]
    SPA --> Modules[Learning Modules / Simulations / Achievements - persisted progress]
    SPA -->|chat messages| EdgeFn[Supabase Edge Function: ai-chat]
    EdgeFn -->|LLM guidance| Claude[Anthropic Claude API]
    EdgeFn -. fallback if unconfigured .-> SPA

Loading

See docs/architecture.md for a full breakdown.

---

Screenshots

Dashboard	Live Map	Learning Modules

Simulation Games	AI Safety Assistant	Achievements

---

Tech Stack

• Frontend: React 18, TypeScript, Vite, React Router v6
• UI: Tailwind CSS, shadcn/ui (Radix UI primitives), Framer Motion, Lucide icons
• State / Data: TanStack Query, React Hook Form, Zod
• Auth & Backend-as-a-Service: Supabase (email/password auth, session persistence, Postgres + RLS for activity tracking, Edge Functions)
• AI: Anthropic Claude API (LLM-backed safety assistant via Supabase Edge Function, with rule-based fallback)
• Maps: Leaflet + React-Leaflet, OpenStreetMap tiles
• Weather: Open-Meteo (no API key required), Nominatim reverse geocoding
• Testing: Vitest, Testing Library, Playwright (E2E)
• Tooling: ESLint, TypeScript-ESLint, PostCSS, Autoprefixer

---

Installation

# Clone the repository
git clone https://github.com/<your-username>/safeschool-ai.git
cd safeschool-ai

# Install dependencies
npm install

# Configure environment variables
cp .env.example .env.local
# then set VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY

# Start the dev server
npm run dev

Command	Description
npm run dev	Start local development server
npm run build	Production build
npm run preview	Preview production build
npm run lint	Run ESLint
npm run test	Run unit tests (Vitest)
npx playwright test	Run end-to-end tests

---

Deployment

SafeSchool AI builds to a static SPA and deploys to any static host (Vercel, Netlify, Cloudflare Pages). See docs/deployment.md for step-by-step instructions including Supabase project setup and environment variable configuration.

---

Future Roadmap

• LLM-powered AI Safety Assistant via Claude (Supabase Edge Function), with rule-based fallback
• Persist learning progress, quiz scores, and badges to Supabase
• Admin dashboard for school administrators to broadcast custom alerts
• Push notifications for severe weather alerts
• Multi-language support for regional deployments
• Offline-first PWA support for low-connectivity areas
• Integration with official government disaster alert APIs (NDMA, NWS, etc.)

---

License

Released under the MIT License.