City Air

💡 Inspiration

Most environmental apps focus exclusively on basic Air Quality Index (AQI), leaving citizens unaware of other critical urban environmental factors like noise, water runoff, thermal stress, land waste, light, and radiation. Even when data is available, it is often buried behind dense technical jargon, sensor raw units, and complex indices that average people cannot easily translate into daily decisions.

We built CityAir to democratize environmental intelligence 🌍. Our goal was to create a free, intuitive dashboard where anyone can type in any city in the world and instantly understand all 7 dimensions of urban pollution in simple, actionable language—available in both English and Urdu!

🚀 What It Does

CityAir is a unified urban pollution checker that breaks down citywide environmental health into clear, human terms:

• 📡 Live Data Tracking: Fetches real-time air quality metrics (PM2.5, PM10, O3, NO2, SO2, CO, and AQI) alongside ambient temperature, UV index, and "feels like" metrics via the Open-Meteo API.
• 🌐 All 7 Pollutions at a Glance: Evaluates Air 💨, Water 💧, Thermal 🔥, Land 🌱, Noise 🔊, Light 💡, and Radioactive ☢️ pollution on a normalized 0–100 scale.
• 🚬 Everyday Equivalencies: Converts complex PM2.5 exposure into intuitive daily comparisons, such as equivalent cigarettes smoked per day and multiples of the WHO daily guideline (15 µg/m³):

$$\text{Cigarettes/day} \approx \frac{[\text{PM}_{2.5}]}{22\ \mu\text{g/m}^3}$$

• ⏰ Smart Activity Timing: Pinpoints the best and worst windows of the day to go outdoors based on hourly AQI forecasts.
• 🤖 AI-Powered Diagnostics & Outlook: Leverages Google Gemini to synthesize multi-factor environmental risk scores, actionable daily safety advice, and a 5-year outlook.
• 🇵🇰 Bilingual Accessibility: Features a native Urdu interface toggle alongside English so local communities across South Asia can access vital public health data.
• 📄 Exportable Reports: Generates downloadable PDF summaries and shareable links for civic awareness.

🛠️ How We Built It

• 💻 Frontend & UX: Developed with Next.js, React, and Tailwind CSS, designed with a modern dark-mode UI, responsive cards, and dynamic bar/trend charts.
• 🌦️ Live Environmental Ingestion: Integrated the Open-Meteo Air Quality & Weather API for high-resolution, geocoded live ground observations without requiring restrictive paywalled API keys.
• 🧠 AI Analysis & Synthesis: Powered by Google Gemini API (gemini-1.5-flash), processing live weather and air quality readings alongside municipal geographic profiles to generate structured estimates, daily mitigation advice, and long-term forecasts.
• 🌐 Bilingual Localization: Implemented a full RTL (Right-to-Left) toggle for Urdu alongside standard English typography.
• 🚀 Hosting & Deployment: Deployed on Vercel with serverless edge functions handling API routes.

🧗 Challenges We Faced

1. 🏜️ Bridging Data Deserts: While air quality and weather data have global real-time sensor coverage, real-time ground sensors for noise, municipal runoff, and light pollution are rarely centralized or publicly queryable. Prompt engineering Gemini with structured municipal baselines, localized geospatial context, and explicit variance bounds was critical to producing reliable, realistic estimates.
2. ⚖️ Contextual Calibration: Making scientific figures meaningful without inciting panic required careful normalization across standard WHO air quality guidelines, sound pressure thresholds in decibels, and lux measurements.
3. ⚡ Low-Latency Synthesis: Orchestrating concurrent API calls across geolocation resolution, Open-Meteo live feeds, and Gemini inference while maintaining sub-second UI transitions required aggressive serverless route optimization and client-side caching.

📚 What We Learned

• 🎯 Humanizing Data Wins: Users connect far more effectively with intuitive comparisons (such as "equivalent cigarettes per day" or "best hours for outdoor exercise") than raw numbers like 48.2 µg/m³.
• 🤝 Multimodal Civic Tech Matters: Offering dual-language support (English and Urdu) significantly expands user accessibility in heavily affected urban centers across South Asia that endure severe seasonal smog.
• 🧩 Hybrid Data Architectures: Combining deterministic real-time telemetry (Open-Meteo) with probabilistic AI reasoning (Gemini) creates a resilient approach to filling urban sensor gaps.

🔮 What's Next for CityAir

• 🛰️ Integrating satellite imagery layers (Sentinel-5P / Copernicus) for hyper-local neighborhood heat maps.
• 👥 Adding crowd-sourced civic reporting to validate and update street-level litter, noise spikes, and water issues.
• 📲 Automated SMS/WhatsApp daily air-alert subscriptions for high-risk respiratory groups.

Built With

• google-gemini-api
• html5
• javascript
• next.js
• open-meteo-api
• react
• tailwind-css
• typescript
• vercel