FirstResponse

FirstResponse: Your AI guide when every second counts

Comment

Inspiration

In any humanitarian crisis, the most critical assets are time and reliable information. The inspiration for FirstResponse came from observing the chaos and misinformation that often spread during emergencies. Whether it's a natural disaster or a conflict, people need immediate, trustworthy answers: "How do I treat this injury?", "Do we have enough supplies?", "Which way is safe?", "Is this official notice real or fake?". My goal was to build a single, centralized toolkit that provides clarity in the midst of chaos, moving beyond theoretical solutions to create a practical, high-speed application that could genuinely aid first responders and civilians.

What it does

FirstResponse is an AI-powered, multi-tool web application designed for humanitarian survival and crisis management. After a secure login, users are presented with a dashboard containing four primary tools:

  1. First Aid Assistant: A user can ask any first aid question in plain language (e.g., "How to treat shrapnel wounds?") and receive immediate, step-by-step guidance. The AI's knowledge is grounded in trusted sources like WHO and military first aid manuals to ensure accuracy.
  2. Resource Rationing: This tool calculates an efficient distribution plan for vital supplies. Users input available resources (water, food, medicine), the number of people, and the duration, and receive a clear plan and a status report on whether supplies are adequate or critical.
  3. Safe Route Planner: This feature finds the safest travel path between two locations. It uses place names for intuitive input and displays the route on an interactive map with detailed turn-by-turn directions, distance, and estimated travel time.
  4. Flyer Scanner: To combat misinformation, this tool allows a user to upload an image of a flyer or poster. It uses OCR to extract the text and an AI model to analyze the content, providing a verdict on whether the information is verified or suspicious.

How I built it

The architecture of FirstResponse uses a modern, full-stack monorepo application to ensure both performance and scalability.

  • Backend: Python with FastAPI to build a robust and high-speed API.

    • AI & RAG: The core of the First Aid and Misinformation features is a Retrieval-Augmented Generation (RAG) pipeline built with LangChain. To meet the hackathon rules, this pipeline connects to the gpt-oss:20b model. It retrieves context from a curated set of documents (including WHO, Red Cross, and Army field manuals) to provide grounded, reliable answers.
    • Routing Engine: For the Safe Route feature, GraphHopper is used, a powerful open-source routing engine.
    • Map Generation: The backend uses the Folium library to generate a complete, interactive HTML map visualization of the route, which is then sent to the frontend.

  • Frontend: The user interface is a responsive single-page application built with React, TypeScript, and Vite.

    • UI/UX: I used Tailwind CSS and shadcn/ui components to create a clean, modern, and dark-themed interface that is intuitive and easy to navigate in high-stress situations.

Challenges I ran into

My journey was filled with significant technical challenges. Initially, the map service, built with osmnx in Python, was incredibly slow and memory-intensive, failing to process even city-sized maps on a standard machine. This forced me to pivot to a production-grade routing engine like GraphHopper, which came with its own learning curve for Docker integration.

On the frontend, I spent a great deal of time debugging react-leaflet. I faced a cascade of issues, from version conflicts between the library and React 18, to broken icon paths and CSS loading problems that resulted in the infamous "blank map screen." After multiple failed attempts, I made a strategic decision to simplify the architecture: instead of having the frontend render the map, I had the backend generate the complete map visualization using Folium and send it as HTML. This completely solved the problem and proved to be a much more robust solution.

Accomplishments that I'm proud of

I am incredibly proud of building a complete, functional, and deployed full-stack application that solves a real-world problem. Integrating multiple complex services—a Dockerized routing engine, a Python RAG pipeline with the OpenAI API, and a modern React UI—was a significant achievement. I am particularly proud of the final UI, which is not just functional but also aesthetically pleasing and user-friendly. Overcoming the numerous routing and map visualization challenges taught us a great deal about resilience and the importance of choosing the right architecture.

What I learned

This project was a deep dive into the realities of full-stack development and MLOps. I learned that for performance-critical tasks like routing, it's essential to use dedicated, specialized engines like GraphHopper over more general-purpose libraries. I gained invaluable experience in debugging frontend rendering issues, particularly the complexities of integrating third-party libraries like react-leaflet. Most importantly, I learned how to architect and deploy a modern monorepo application, managing environment variables and CORS policies to ensure our frontend and backend could communicate effectively in both development and production.

What's next for FirstResponse

FirstResponse has a strong foundation, and I see several exciting paths forward. The next steps would be to:

  1. Integrate Live Data: Incorporate real-time data feeds for traffic, weather conditions, and reported security incidents to make the Safe Route feature even more dynamic and reliable.
  2. Expand the Knowledge Base: Add more specialized manuals to the RAG pipeline's data source to cover a wider range of first aid and survival scenarios.
  3. Real-Time Collaboration: Add a feature for teams to share notes, mark locations on a shared map, and communicate securely.
  4. Offline Features: Provide certain critical features such as First-Aid help offline.

Built With

Share this project:

Updates