• 

  Landing page

• 

  AI-Powered Safety Map

• 

  Live Safety Map with filters for a zone

• 

  3-Click Incident Reporting

• 

  Step 1

• 

  Step 2

• 

  Step 3

• 

  Adopt-a-Street Community Program

• 

  Corporate Partnership Portal

CivicPaws

AI-Powered Platform for Human-Animal Coexistence

Inspiration

India's streets are shared spaces — and shared spaces need shared systems. As cities grow, encounters between humans and stray animals grow with them: road accidents, bite incidents, animals in distress, delayed rescues. Today, reporting one of these incidents means a scattered phone call, a Facebook post, or nothing at all — because there's no single place a citizen, an NGO, and a municipal body can all see the same problem at the same time.

We asked a simple question: what if reporting a stray-animal emergency was as easy and as trustworthy as ordering food online? CivicPaws is our answer — an AI layer sitting on top of civic infrastructure that already should exist.

What It Does

CivicPaws is a working prototype of the full citizen-reporting experience: report a human-animal conflict in seconds, see it reflected on a live conflict map, and get a preview of the AI-assisted guidance we're building toward — all wrapped in a clean, production-ready interface.

• One-tap incident reporting — real browser geolocation auto-attached, done in seconds
• Live conflict map view — a visual, real-time-feeling picture of active cases across a city
• AI-guided assistant (concept demo) — the interface shows how AI triage and safety guidance will surface to a reporter once connected to a live model
• "Adopt a street" community flow — lets citizens commit to keeping an eye on a specific area, reinforcing shared responsibility
• Fully responsive, accessible UI — built with a proper component system so it's ready to plug into real data on day one

How We Built It

We focused our hackathon time on nailing the user experience end-to-end, built on a modern, production-grade frontend foundation:

Every core user flow — reporting, viewing the map, the AI-assistant interface, and the community "adopt a street" feature — is fully clickable and demoable end-to-end. Rather than wiring a backend under time pressure, we prioritized getting the interaction design, component architecture, and information flow exactly right, so the next step is connecting real services behind an interface that's already built to receive them.

Challenges We Ran Into

• Designing a reporting flow simple enough that a panicked bystander can complete it in seconds
• Building a map experience that feels live and geospatial without a mapping API in the time we had
• Structuring our component system and mock data so that plugging in a real backend later requires minimal rework
• Working with the browser's native geolocation reliably across devices
• Deciding what to fully build versus what to demo as a clear, well-designed concept, given hackathon time constraints

We prioritized ruthlessly: rather than half-build a backend and an AI integration under time pressure, we chose to fully build the parts of the experience a citizen actually touches, and be upfront about what's simulated versus live.

Accomplishments We're Proud Of

• A fully clickable, production-quality UI prototype covering the entire citizen journey — not just static slides
• A clean, scalable component architecture (React + TypeScript + shadcn/ui) that's genuinely ready to connect to real APIs
• An interface simple enough for any citizen, useful enough for an NGO caseworker
• A project that pairs directly with UN Sustainable Development Goals around sustainable cities and animal welfare — impact judges can point to beyond the demo

What We Learned

• How to design an AI-assisted experience so the interaction feels actionable, not just impressive, even before the model is wired in
• The real complexity of designing for geospatial, real-time civic data — even at the interface level
• How to build for a user under stress — the reporting flow had to be foolproof
• How to move fast as a team under a hard deadline, and where to draw the line between "build it" and "design it clearly"

What's Next for CivicPaws

• Real backend and database — Supabase or a custom Node.js/Express + database layer to persist reports live
• Live AI triage — connect an LLM (OpenAI, Gemini, or Claude) to actually classify severity and generate guidance
• Real mapping integration — Google Maps, Mapbox, or Leaflet, replacing the current visual placeholder with live pins
• User authentication — real sign-in for citizens, NGOs, and municipal accounts, with role-based access
• Predictive hotspot modeling — forecast conflict zones before they escalate
• Mobile-first app — for reporting where it actually happens: on the street
• Direct integration with municipal bodies and registered animal welfare NGOs
• Image-based AI detection — auto-classify species, injury, and urgency from a photo
• Policy-facing dashboards — giving urban planners the data to fix hotspots for good

CivicPaws is a first step toward AI as civic infrastructure — a fully-designed foundation ready to turn every phone into a sensor for a safer, more compassionate city, for humans and animals alike.

Built With

• css3
• figma
• geolocation-api
• github
• radix-ui
• react
• shadcn-ui
• tailwindcss
• typescript
• vite