Inspiration

Ryan grew up moving between two of the most seismically active places on earth. Born in Japan, raised in Taiwan, he didn't learn about earthquakes from a textbook — he felt them. He was in Japan during the 2011 Tōhoku earthquake, one of the most powerful ever recorded, and watched a country that had spent decades preparing still get brought to its knees. Back in Taiwan, severe earthquakes weren't rare events — they were part of life. He knew the drill: get under the desk, brace, wait.

But here's what stayed with him. At school, there were drills. There were classes. There were posters on the wall and teachers who walked you through exactly what to do. The moment you walked out the front door, all of that disappeared. Your apartment had nothing. Your office had nothing. The restaurant you were eating at had nothing. Society had decided that earthquake preparedness stopped at the school gate — and that you'd somehow figure out the rest on your own.

The hard truth Ryan kept coming back to is that people only truly understand the importance of earthquake preparedness after they've lived through a disaster. Not before. And the numbers prove it:

  • The 2011 Tōhoku disaster — which Ryan lived through — caused $235B in economic losses, the costliest natural disaster in recorded history at the time (Swiss Re)
  • After the 1994 Northridge earthquake, demand for home safety products surged overnight — people only acted after $50B in damage and 57 deaths, not before
  • FEMA's ShakeOut scenario projects that a M7.8 on the San Andreas Fault would cause 1,800 deaths, 50,000 injuries, and $200B in damage — with a significant share of injuries classified as preventable with correct in-building response (USGS/FEMA)
  • The USGS estimates a 60% probability of a magnitude 6.7 or greater earthquake striking greater Los Angeles within the next 30 years (USGS Uniform California Earthquake Rupture Forecast)

The drill you did in third grade doesn't come back to you when the ground is actually moving. The generic "drop, cover, hold on" poster doesn't tell you which way to run in your specific building, or which shelf is going to fall on you, or whether the exit behind you is safer than the window in front of you.

When we got to UCSD — sitting on top of some of the most active fault lines in the country — we kept noticing the same gap from a completely different angle: the person inside the building gets generic advice, and their insurer uses equally generic maps to set their premium. Neither side is looking at the specific building. Just averages. Just guesses. Over 10 million people live and work in the greater Los Angeles area alone, in buildings that have never been assessed at the address level for seismic risk.

We built Quarte to change that.

What it does

Quarte takes the details of an earthquake (magnitude, epicenter, depth) and predicts how hard the shaking will hit a specific building at a specific address. Then it shows that one answer in two different ways.

For a regular person, it turns into a cinematic globe that dives into a 3D map, drops them on top of the chosen building, lets them step inside in a 360° view, and walks them through a gamified escape simulator where the screen actually shakes, the most dangerous things in the room get spotlighted one at a time, and a survival rate goes up or down based on the choices they make.

For an insurer, the same prediction becomes a risk tier, a 20-year financial projection, and a hazard checklist for the building with mitigation costs and the premium impact of fixing each item.

There's also a separate Emergency view — a scroll-driven, AR-style "Drop · Cover · Hold" cinematic that lays out the action sequence in plain language, designed to be glanceable in the first seconds of a real shake.

For the hackathon demo we anchored everything on a single classroom in HSS at UCSD with an M6.5 Salton Sea scenario, but the pipeline itself is address-driven — the model takes any latitude/longitude and any earthquake parameters, so swapping in a new building is a configuration change, not a rebuild.

Why the public needs this

The household preparedness gap is not a minor oversight — it is a systemic failure with measurable consequences:

  • Only 13% of California homeowners carry earthquake insurance, meaning the vast majority have no financial safety net when a quake hits (California Department of Insurance, 2023) — largely because risk feels abstract and untethered to their actual home
  • The 2023 Turkey–Syria earthquakes killed over 50,000 people, with post-disaster analysis pointing to the catastrophic cost of populations having no building-specific knowledge of how to respond in the critical first seconds
  • Research consistently shows that the first 8–10 seconds of an earthquake are the decisive window — trained individuals who know their specific environment make correct decisions; untrained individuals freeze or move toward exits that become lethal during shaking
  • FEMA's own ShakeOut projections show that improving in-building response behavior at scale is one of the highest-leverage interventions available for reducing earthquake casualties in urban areas

Generic advice saves some lives. Address-level, building-specific, gamified training saves far more.

Why enterprise and insurers need this

The insurance industry's earthquake problem is not a data problem — it is a resolution problem. Current tools price risk at the ZIP code or census tract level. Quarte prices it at the address level, trained on physics-based simulations from Scripps. The financial consequences of this gap are enormous:

  • Earthquake insurance penetration in California is only 13% — the lowest of any major natural catastrophe peril relative to exposure (California Department of Insurance, 2023)
  • The insurance industry absorbed $15.3B in insured losses from the 1994 Northridge quake, while total economic losses reached $50B — the $35B gap represents risk that was either uninsured or catastrophically mispriced (Swiss Re, Munich Re)
  • A 2022 Swiss Re sigma report estimated the global earthquake protection gap at roughly $280B per year — the largest uninsured natural catastrophe exposure on earth
  • CoreLogic estimates that a repeat of the 1906 San Francisco earthquake today would generate over $220B in insured losses — and current industry models cannot meaningfully distinguish risk between two adjacent buildings on the same block
  • The National Institute of Building Sciences found that every $1 invested in pre-disaster mitigation saves an average of $6 in post-disaster recovery costs — a return that Quarte's per-building hazard checklist is designed to unlock for both owners and their insurers
  • FEMA's P-58 loss estimation methodology documents that targeted structural and non-structural retrofits — exactly the type Quarte flags — can reduce expected annual losses by 20–50% for wood-frame and soft-story buildings

For insurers, Quarte turns coarse ZIP-code guesswork into address-level certainty. For building owners, it turns abstract risk into a concrete, actionable, financially quantified checklist. For residents, it turns a generic poster into a personal survival plan.

One prediction. Two audiences. The same building finally seen clearly.

How we built it

We split the project into two halves that talk to each other.

Backend — a Python FastAPI service deployed on Render. It loads an XGBoost regressor we trained on Rekoske-style 3D ground-motion simulations from Scripps/UCSD plus USGS catalog rows, with physics-inspired features (epicentral distance, log-distance, an energy proxy, a depth factor, and a Vs30-based soil amplification term). It exposes endpoints for site PGV prediction, a heatmap grid, an insurance tier + premium multiplier, a 20-year financial projection, a per-building risk score, and a few precomputed demo scenarios so the UI never has to wait on a cold model.

Frontend — a Next.js 14 PWA (installable on a phone via next-pwa) deployed on Vercel, wrapping those answers in a visual story:

  • cobe + three.js globe that drops into a Google Maps base
  • deck.gl layers for extruded 3D buildings and the shaking heatmap
  • Pannellum 360° view of the building interior
  • CSS-keyframe shake in five intensity tiers + tinted flash overlay tied to magnitude
  • GSAP/ScrollTrigger for the emergency AR cinematic
  • Framer Motion for transitions
  • Google Gemini SDK for an in-app AI assistant
  • Enterprise portal: session-gated dashboard, building detail page, and risk-assessment hub powered by a recharts/shadcn-style chart wrapper

The backend lives on Render, the frontend lives on Vercel, and they hand off through a single shared API URL.

Challenges we ran into

  • The deck.gl 3D buildings kept drifting off their footprints during the globe-to-map dive because the Google Map and the deck overlay had slightly different ideas of where "here" was
  • Getting the Rekoske simulation outputs into a shape XGBoost could actually learn from took several passes — the PGV units were tiny floats that needed scaling, and the rows had to be matched against the right USGS event records before features made any sense
  • Deploying the backend broke a few times — wrong service root directory, forgetting to bind to the platform-supplied PORT, then running into Render's free-tier cold-start where the first request after idle takes almost a minute
  • Making the opening globe-to-map animation feel like one continuous motion instead of three clips stitched together took a lot of timing tweaks before it finally felt like a single dive
  • Every iframe, Pannellum viewer, and GSAP scroll trigger had to be re-checked on iOS Safari with safe-area insets, since elements kept getting hidden behind the browser chrome

Accomplishments that we're proud of

We got the whole thing working end to end — real data, real model, real deployed servers, real demo. You can click "Demo" on the homepage, watch the globe dive into a campus, search for a building, look around inside it in 360°, walk through a shaking simulation that actually scores your choices, and then jump to the enterprise side and see what that same earthquake would cost — without anything being faked in the middle.

The thing we're most proud of is that one prediction from our model drives two completely different experiences: the same PGV that tells a person which way to run also tells an insurer how to price a policy. We also built in a safety net of precomputed scenarios so that even if the backend is asleep on the free tier, the app still tells a clean story instead of breaking.

What we learned

The model itself is the easy part — the hard part is turning a number into something a person can actually feel and act on. A prediction of "the ground will shake at this PGV" means nothing until it becomes an arrow pointing at the exit or a dollar sign on a premium.

We also learned a ton about how the pieces of a modern web app fit together: how environment variables get baked into a Next.js build at compile time, why "the folder on my laptop" is not the same as the service root on Render, and why a Google Maps key needs an explicit referrer allowlist before any tile loads.

The bigger lesson was about audience — every time we stopped thinking about "the user" and started asking "who else might look at this and need a different cut of the same answer," the product got noticeably sharper.

What's next for Quarte

  • Wire up address search to auto-load any building and generate a 360° interior on demand
  • Plug into live USGS feeds and ShakeAlert so the map and emergency view update in real time instead of only running set scenarios
  • Close the loop between residents and insurers: when a building owner fixes a flagged hazard, their financial projection updates automatically to reward the fix
  • Expose the backend as a public API for insurance carriers, city emergency managers, and real-estate platforms
  • Expand beyond earthquakes to wildfire and flood, using the same core idea: one shared picture of the risk, shown two ways depending on who's looking

Quarte started as one classroom in HSS. It ends as infrastructure for every building in Southern California — and eventually, every fault line on earth.

Built With

  • axios
  • cobe
  • deck.gl
  • eslint
  • fastapi
  • framer-motion
  • github
  • google-gemini-api
  • google-maps-javascript-api
  • gsap
  • joblib
  • lucide
  • next-pwa
  • next.js
  • numpy
  • pandas
  • pannellum
  • postcss
  • pyarrow
  • python
  • radix-ui
  • react
  • react-pannellum
  • react-three-drei
  • react-three-fiber
  • recharts
  • rekoske-3d-ground-motion-simulations
  • render
  • scikit-learn
  • scrolltrigger
  • shadcn/ui
  • tailwind-css
  • three.js
  • typescript
  • usgs-earthquake-catalog
  • uvicorn
  • vercel
  • xgboost
Share this project:

Updates