Inspiration
This project was deeply inspired by our own journeys, and the journeys of people around us, navigating life in the United States for the first time. We experienced firsthand how overwhelming it can be to understand a completely new financial system. Simple but critical steps, like understanding insurance or even opening the right bank account, often felt confusing, fragmented, and stressful.
We saw the same struggles again and again: people didn’t know where to start, what to trust, or what steps to take first.
We kept asking ourselves: What if there was a single, reliable starting point, a guide that simplified these early financial decisions and made the transition smoother?
That’s where the idea was born. We wanted to create a one-stop financial literacy solution that reduces stress, removes guesswork, and helps newcomers feel confident. We want the first steps in the U.S. shouldn’t feel overwhelming, they should feel exciting.
What it does
Shock Simulator is a visual guide where a character named Safi walks you through scenarios that actually happen to immigrants. Your car gets rear-ended. Your apartment floods at 2 AM. Someone steals your laptop while you're in class. You land in the ER without health coverage. You choose whether you have insurance or not, and the financial damage ticks up one item at a time: $500 fine, $2,800 repair, license suspended, can't drive to work. The point is making you feel the cost, because reading a number doesn't do it.
Policy Decoder lets you upload any insurance document, photo or PDF. The app scans it with AI, then shows a health score gauge (0-100), a shield diagram showing covered vs uncovered categories, and your deductible translated into real things ("$500 = 2 weeks of groceries"). Coverage gaps show up as warning cards with actual scenarios: "If your apartment floods, you'd pay $3,100 out of pocket." We built this because even people who have insurance often don't know what it actually covers.
Claim Coach is for when something already went wrong. You pick what happened (car accident, theft, flood, fire, weather, medical emergency) or describe it in your own words, typed or spoken using ElevenLabs voice input. You get a visual step-by-step timeline with urgency badges, expandable steps, an evidence collector that opens your phone camera, document checklists, and DO/DON'T cards. The first DON'T: "Don't say it was your fault." Immigrants say this all the time because they're trying to be polite. It can destroy their claim.
Coverage Finder shows apartments near you on an interactive map with renter's insurance estimates. Pulls FEMA disaster history for your ZIP code so you know what risks are real in your area. Has a big bold callout: "You do NOT need an SSN for auto insurance in Arizona." Then gives you a 30-day plan: get your ITIN, open a bank account, get auto insurance, get renter's insurance. Checkboxes. Progress bar. Done.
Newcomer Guide adapts a first-timer checklist based on your visa type (F-1, H-1B, J-1, O-1). Week-by-week tasks with required documents, resource links, and Google Maps integration to find nearby offices. Progress tracked across sessions.
After onboarding, the Dashboard shows your deadlines, next actions, and a coverage readiness score based on visa status, location, and SSN status.
Everything is fully bilingual (English and Spanish) and ships with 8 accessibility settings including color-blind filters, high contrast, reduced motion, screen reader optimization, and adjustable voice output speed.
How we built it
Next.js 16, React 19, TypeScript, Tailwind CSS 4. The simulator is a state machine. Each scenario is a tree of dialogue nodes with branching paths. We wrote 60 nodes across 4 scenarios (car accident, apartment flood, theft, ER visit). Safi renders with 6 emotion states (neutral, happy, worried, shocked, hurt, celebrating) that swap based on what's happening in the story. Text types out at 30ms per character. We spent a lot of time on the damage reveal animation because the whole point is making people watch their money disappear, item by item, before they can tap "Next."
Policy decoder hits OpenRouter's API with the uploaded document and a structured prompt that returns clean JSON. We render the results through custom components: a radial SVG gauge that animates with stroke-dashoffset, a shield-shaped coverage diagram, and gap warning cards. There's a scanning line that sweeps across the document during processing, which makes the AI feel like it's actually reading page by page.
Claim guide content is fully authored per incident type with complete bilingual templates. AI kicks in when someone describes their situation in free text instead of picking a category, classifying the incident and generating a tailored response. Map uses Leaflet with OpenStreetMap tiles. FEMA data comes from their open API. Insurance costs and state rules cover AZ, CA, TX, and NY.
Voice input uses ElevenLabs' Scribe v2 for speech-to-text, with MediaRecorder handling audio capture with echo cancellation and noise suppression. Text-to-speech also runs through ElevenLabs. Spanish support uses next-intl with full translation files for every screen.
Accessibility is a React context provider with 8 configurable settings. Color-blind modes use embedded SVG filters applied at the document level. Reduced motion adapts every animation globally so the experience stays complete without any motion.
Challenges we ran into
Simulator timing was harder than expected. The first version just dumped text on screen and showed a total. Felt like reading a spreadsheet. We had to figure out the right pause before revealing each damage item, how fast text should type out (30ms landed well), and when to let users skip ahead. Small timing changes completely changed how the scenarios felt. We also built a full reduced-motion path so users who need it still get the complete experience.
Scoping was the other big one. We had a long list of features that sounded good but didn't connect to the problem. Community forums, gamification points, a full budget tracker. We kept asking: "Does this help someone understand insurance or get covered?" If not, we cut it.
Accomplishments we're proud of
The Shock Simulator actually makes people uncomfortable, in a good way. During testing, watching the damage items tick up one by one made people say "okay, I get it" in a way that no infographic ever did. That reaction was the whole reason we built it.
Policy Decoder turns a document most people never read into something they can understand in 30 seconds. The health gauge, the shield diagram, the "your deductible in real life" comparison. We took insurance language and made it readable.
The entire app works in Spanish. Not just labels. AI responses, claim guides, simulator dialogues, the accessibility menu. Every string goes through next-intl. Localization was built in from day one, not bolted on at the end.
Eight accessibility settings that all work together. You can run high contrast + color-blind mode + large text + Spanish + reduced motion at the same time and nothing breaks. We structured the provider architecture around this from the start, which is the only reason it works.
Every feature works regardless of network conditions or API availability. The simulator, claim guides, coverage finder, policy decoder all function in any environment. If a request fails, the experience doesn't fall apart.
What we learned
Insurance literacy is hard to teach. People tune out when you list coverage types. They engage when you show them losing $4,200 because they didn't have renter's insurance. We probably should have known that going in, but seeing the difference in testing was striking.
Building accessibility into the architecture from day one saved us a lot of time. Every new component automatically respected user settings without extra work. We almost didn't do it this way, and I'm glad we did.
The features we cut would have taken weeks. Community forums, gamification, budget tracking. All reasonable ideas that had nothing to do with what we were actually building.
What's next for FirstCover
We have 4 story scenarios with 60 nodes right now. Health insurance confusion, identity theft, and "my landlord says I don't need renter's insurance" are the next ones we want to build.
Expanding insurance data to all 50 states (currently AZ, CA, TX, NY). Adding Mandarin, Hindi, Arabic, and Tagalog. Connecting users with State Farm agents who speak their language and understand visa-specific needs. Push notifications for insurance task deadlines. Full PWA offline mode so the educational content works without connectivity.
Built With
- css
- elevenlabs
- leaflet.js
- next.js
- openrouter
- openstreetmap
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.