Tushar Sharma

Posted on Oct 9 AI-assisted

SkyDrift ☁️ — Look Up & Touch Grass: AI-Powered Cloud-Gazing Companion

#devchallenge #hf26challenge #flutter #nestjs

Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass Submission 🌿

This is a submission for the Hacktoberfest 2026 Open-Source AI Challenge Week 1: Touch Grass 🌿

🌿 Why SkyDrift? (The "Touch Grass" Fit)

As developers, we spend entire days staring at IDEs, logs, and glowing screens. It is easy to forget there is an entire physical world right above us.

For the Touch Grass challenge, I built SkyDrift — an open-source mobile companion designed to give you an intentional reason to step away from your desk, head outside, and look straight up.

Most apps are built to maximize screen time and keep you scrolling. SkyDrift does the opposite:

You step outside, take a 5-second photo of the sky, and read the brief creative insight.
The interaction takes less than 30 seconds, and then you put your phone away to enjoy the outdoors.

⏳ Note on First Load: The backend runs on Render's free tier. If the service has been idle, please allow 30–50 seconds on the very first upload while the instance wakes up. Subsequent requests run instantly!

✨ Features Delivered

📸 Camera & Gallery Capture: Snap a fresh sky photo in the moment or pick one from your camera roll.
🦄 Cloud Shape Spotter (Pareidolia): Discovers playful shapes, animals, and whimsical forms floating in the clouds.
☁️ Everyday Cloud Labels: Practical, plain-English labels (Fair-weather puffs, High wisps, Thundercloud, Low grey sheet) instead of dense meteorological classifications.
🌤️ Sky-Based Weather Outlook: A quick 2–4 hour outdoor weather outlook derived directly from the cloud formation in your photo.
🖼️ Drift Gallery: A persistent archive of all your past sky captures and readings.
🔍 Full-Screen Photo View: Expand and inspect your high-resolution sky captures in full detail.
⚡ Dual Environment Flavors: Clean separation between development (dev hitting local Docker) and production (prod hitting live cloud services).

📱 App Walkthrough & Screenshots

🏠 Home	📸 Capture & Upload	🔍 Cloud Reading	🖼️ Drift Gallery

🏗️ System Architecture

SkyDrift runs on a clean full-stack architecture powered completely by 100% free, reliable services (zero credit cards required):

+-------------------------------------------------------+
|                 Flutter Mobile App                    |
|          (Clean Architecture + BLoC + Dio)            |
+---------------------------+---------------------------+
                            |
                            | POST /api/drift/analyze (Multipart)
                            v
+-------------------------------------------------------+
|                 NestJS Backend API                    |
|               (Hosted on Render Docker)               |
+-------------+---------------------------+-------------+
              |                           |
              v                           v
+---------------------------+ +-------------------------+
|     Google Gemini API     | |     Cloudinary CDN      |
|   (Flash-Lite Vision AI)  | |  (Optimized WebP Media) |
+---------------------------+ +-------------------------+
              |                           |
              +-------------+-------------+
                            |
                            v
              +-------------------------+
              |     Neon PostgreSQL     |
              |  (Serverless DB Pooler) |
              +-------------------------+

🛠️ The Tech Stack

📱 Frontend (Mobile)

Framework: Flutter (Dart 3)
Architecture: Clean Architecture (presentation, application, domain, infrastructure)
State Management: flutter_bloc & bloc
Code Generation & DI: freezed, json_serializable, injectable, and get_it
Networking: dio and retrofit with dynamic flavor configuration
CI/CD: Automated GitHub Actions pipeline building and releasing production APKs on every tagged release

⚙️ Backend (API)

Framework: NestJS (TypeScript) with a modular architecture and TypeORM
Vision Engine: Google Gemini API (gemini-flash-lite-latest) configured for structured JSON output
Database: Serverless PostgreSQL on Neon (ap-southeast-1 pooler endpoint with SSL)
Image Storage: Cloudinary streaming media pipeline (WebP format)
Hosting: Render (Docker Web Service) paired with a health-check keep-alive cron job

💡 What Broke & Lessons Learned

AI Demand Spikes & Fallback Traps: Early on, heavy load on the vision API caused 503 errors that were initially masked by fallback mocks. Switching to gemini-flash-lite-latest with strict JSON mode (responseMimeType: 'application/json') eliminated parsing crashes and drastically reduced latency.
Third-Party API Permissions: A 403 Forbidden from Cloudinary halted uploads during production testing. It turned out brand-new accounts require explicit email confirmation before API keys unlock. Adding a clear startup credential validator in NestJS made sure misconfigurations surface immediately in server logs.
Keeping Free Tiers Awake: Free Render containers sleep after 15 minutes of inactivity. Rather than letting users suffer a 50-second cold boot every time they step outside, a free external cron ping to GET /api/health keeps the container warm and ready.

🔓 Why Does Open Innovation Matter?

Democratizing Outdoor Wellness: Mindfulness tools shouldn't be locked behind expensive subscription paywalls. By building with open tooling and generous free tiers, SkyDrift demonstrates that high-quality, full-stack mobile apps can be built and deployed by anyone with zero budget.
Transparent AI Observations: Cloud pareidolia is creative and subjective. Open prompts and accessible model interfaces mean users can inspect exactly how the AI derives its predictions and everyday cloud names, without black-box lock-in.
Community-Driven Extensions: Because the Flutter app follows strict Clean Architecture and the NestJS backend uses standard OpenAPI/Swagger-ready modules, contributors can easily plug in new sensors, alternative vision models, or community galleries.

🎁 Prize Categories

☁️ Best Use of Render: The entire backend runs as a multi-stage Docker container deployed automatically on git push to Render's Web Service, orchestrated alongside serverless PostgreSQL and keeping zero-downtime availability.
🧠 Best Use of Gemma / Google AI: Powered by Google's Gemini Vision API with tailored prompt contracts that replace Latin jargon with relatable everyday English cloud taxonomy and structured pareidolia observations.

📦 Source Code & Download

📱 Mobile App Repository: github.com/TusharSharmaIN/skydrift-app
⚙️ Backend Repository: github.com/TusharSharmaIN/skydrift-backend
📥 Android APK: Download Latest Release

Take 5 minutes today. Step away from your terminal, head outside, and watch the clouds drift. ☁️🌱

DEV Community