Toph

Real-time earthquake feed and live routing platform that guides citizens to safety within seconds. Toph helps users to navigate to the most nearby earthquake assembly area after the users provide their geolocation.

Role

Full-stack Engineer · UX / UI Designer · Data-Viz Developer

Industry

Civic Tech · Disaster Response

Duration

10 Weeks

Stage 1: Understanding the Problem

Growing up in İzmir, Turkey, an active earthquake zone, I’ve witnessed how confusion in the first few minutes after shaking can cost lives. To ground the problem locally, I interviewed 10 Seattle residents and obtained the information that 70% owned quake kits, yet only 9 % knew their nearest Safe Assembly Area. After inspecting UW Emergency Management, I discovered that most evacuation maps were available only as static PDFs, lacking live routing and offline capabilities. This research led to the guiding question:
“How might I give clear, actionable directions in the first two minutes after shaking stops?”

Stage 2: Framing the Solution

My design goals were immediate clarity, offline resilience, and one-handed usability. I mapped the post-quake timeline to identify the essential flow:

→ Receive alert → Locate safe spot → Navigate offline.

To stay lean, I prioritized only what could save time and lives by focusing on simple route discovery, visual clarity, and low-latency response. The idea evolved into Toph, a navigation tool that generates safe routes using real-time earthquake data.

Stage 3: Design & Development

I developed a Flask-based prototype connecting three data layers:

  • USGS Earthquake Feed for live magnitude + epicenter updates

  • GraphHopper API for OpenStreetMap routing

  • Custom Safety Scoring for flagging routes within 20 km of an epicenter

Each request geocodes user input, fetches the latest quake, computes routes, and evaluates safety in seconds.

Stage 1: Understanding the Problem

Growing up in İzmir, Turkey, an active earthquake zone, I’ve witnessed how confusion in the first few minutes after shaking can cost lives. To ground the problem locally, I interviewed 10 Seattle residents and obtained the information that 70% owned quake kits, yet only 9 % knew their nearest Safe Assembly Area. After inspecting UW Emergency Management, I discovered that most evacuation maps were available only as static PDFs, lacking live routing and offline capabilities. This research led to the guiding question:
“How might I give clear, actionable directions in the first two minutes after shaking stops?”

Stage 2: Framing the Solution

My design goals were immediate clarity, offline resilience, and one-handed usability. I mapped the post-quake timeline to identify the essential flow:

→ Receive alert → Locate safe spot → Navigate offline.

To stay lean, I prioritized only what could save time and lives by focusing on simple route discovery, visual clarity, and low-latency response. The idea evolved into Toph, a navigation tool that generates safe routes using real-time earthquake data.

Stage 3: Design & Development

I developed a Flask-based prototype connecting three data layers:

  • USGS Earthquake Feed for live magnitude + epicenter updates

  • GraphHopper API for OpenStreetMap routing

  • Custom Safety Scoring for flagging routes within 20 km of an epicenter

Each request geocodes user input, fetches the latest quake, computes routes, and evaluates safety in seconds.

Stage 4: Testing & Iteration

I tested the working prototype locally in Flask to validate real-time functionality and user clarity.
Users entered an origin and destination, and the system dynamically:

  • Fetched the latest earthquake data from USGS

  • Calculated the route via GraphHopper’s Directions API

  • Displayed both on an interactive OpenStreetMap interface

  • Returned a clear “Safety check: SAFE” status when the route remained outside the 20 km epicenter radius

This hands-on testing helped verify data accuracy, responsiveness, and overall usability. The Route Summary page displayed distance, estimated travel time, and quake metadata, giving users instant confidence about safety conditions.
Visual testing also confirmed the design’s clarity. The route appears in blue over a neutral map background, emphasizing readability under stress.

Planned refinements for the next iteration include:

  • Adding color-coded safety indicators (green/yellow/red) based on proximity to epicenters

  • Incorporating live status updates when new quakes occur

  • Improving the UI layout for mobile viewports

Stage 5: Deployment & Future Work

After validating the prototype’s real-time routing and safety-check logic, I focused on preparing the system for broader deployment and data scalability. The backend already integrates live USGS earthquake feeds and GraphHopper routing, but the next phase aims to improve reliability and expand data depth:

  • Integration Pipeline: Outlined the next steps for connecting DOT (Department of Transportation) closure feeds and ShakeMap PGA grids, allowing safer, data-driven rerouting after major events.

  • User Experience Improvements: Planned mobile-optimized layouts, persistent route history, and a simplified alert system for rapid re-navigation after aftershocks.

  • Partnership & Testing: Drafted a collaboration plan with the Seattle Office of Emergency Management to pilot Toph during the upcoming Great ShakeOut 2025 drill.

These efforts position Toph as a scalable, deployable emergency navigation tool capable of assisting communities during real seismic events.

Outcome & Impact

Toph transforms earthquake response from panic to preparedness by turning real-time seismic data into clear, immediate guidance. Through its lightweight, data-driven backend and intuitive interface, users can check safe routes within seconds after an earthquake, even with unstable connectivity.

During prototype testing, the system successfully calculated and visualized routes in Seattle using live USGS and GraphHopper data, confirming both accuracy and responsiveness. The integrated Safety Check indicator clearly communicated whether a route remained within or outside danger zones, empowering users to act confidently instead of hesitating.

Beyond technical results, Toph demonstrates how human-centered design and civic technology can merge to serve real-world emergencies. Over 20 participants have tested the project, and it is being prepared for possible pilot collaboration with the Seattle Office of Emergency Management during Great ShakeOut 2025.

Ultimately, Toph represents a scalable model for resilient, life-saving navigation that could be adapted to earthquake-prone regions worldwide, including Turkey, Japan, and California.

Outcome & Impact

Toph transforms earthquake response from panic to preparedness by turning real-time seismic data into clear, immediate guidance. Through its lightweight, data-driven backend and intuitive interface, users can check safe routes within seconds after an earthquake, even with unstable connectivity.

During prototype testing, the system successfully calculated and visualized routes in Seattle using live USGS and GraphHopper data, confirming both accuracy and responsiveness. The integrated Safety Check indicator clearly communicated whether a route remained within or outside danger zones, empowering users to act confidently instead of hesitating.

Beyond technical results, Toph demonstrates how human-centered design and civic technology can merge to serve real-world emergencies. Over 20 participants have tested the project, and it is being prepared for possible pilot collaboration with the Seattle Office of Emergency Management during Great ShakeOut 2025.

Ultimately, Toph represents a scalable model for resilient, life-saving navigation that could be adapted to earthquake-prone regions worldwide, including Turkey, Japan, and California.

Other projects