SF Garbage Reporter

Scan. Locate. Report. A QR-powered web app that lets anyone instantly report garbage to San Francisco 311 using just their phone’s GPS—no app, no typing, no hassle.

Comment

Inspiration

Walking through San Francisco, we kept seeing overflowing trash bins, illegal dumping, and waste scattered across sidewalks. The city's 311 service exists, but it’s buried behind slow apps or confusing forms. We thought: what if reporting garbage was as easy as scanning a QR code? No app installs, no logins—just one tap to notify the city. That's how SF Garbage Reporter was born.

What it does

SF Garbage Reporter is a zero-friction, mobile-friendly web app that lets anyone report garbage in seconds by scanning a QR code. Here’s how it works:

  • Scan a QR code placed on a trash bin, lamppost, or wall
  • The browser opens a page asking for GPS location
  • The app sends a 311 garbage report with your location to San Francisco’s Open311 API
  • You see an instant confirmation—no forms, no downloads, no typing

How we built it

  • Frontend: Static HTML/JS web page using the Geolocation API
  • Backend: Node.js (Express) server that receives GPS data and sends reports to SF's Open311 endpoint
  • Hosting: Vercel (frontend) + Railway (backend)
  • API: Integrated with the San Francisco Open311 API for real-time report submission
  • QR Codes: All QR codes point to the same /report URL—universal and scalable
  • Design focus: Mobile-first, ultra-fast load times, and high accessibility

Challenges we ran into

  • GPS permissions are tricky—users can deny them, so we had to handle that gracefully
  • Open311 documentation was a bit sparse and inconsistent; we had to dig into real API responses
  • Civic data compliance: We had to design the app to avoid collecting any personally identifiable information (PII)
  • Making the experience feel native and instant while being just a webpage

Accomplishments that we're proud of

  • Users can submit garbage reports in under 10 seconds from a QR scan
  • Fully working MVP using zero user input
  • Seamless integration with the city’s Open311 system
  • Designed with privacy-first principles—no data stored, no accounts, no tracking
  • QR codes work anywhere in the city (universal link)

What we learned

  • How powerful browser-based APIs (like navigator.geolocation) can be in civic tech
  • Open311 standards vary a lot between cities—we need good adapter patterns
  • Civic interfaces must be built for non-technical users: fewer taps = higher impact
  • Simple tech + real-world friction removal = massive usability win

What's next for SF Garbage Reporter

  • 📸 Photo support: Let users attach optional pictures of the garbage
  • 🌍 City expansion: Add adapters for more cities using Open311
  • 💬 Multi-language support: Translate the app into Spanish, Chinese, and Tagalog
  • 💡 Offline-first mode: Queue reports until the user regains signal
  • 🧠 AI deduplication: Prevent redundant reports via spatial clustering
Share this project:

Updates