Scrappy

Inspiration

The inspiration for Scrappy came from a simple observation: children are naturally creative, but they often lack a tangible connection to the environmental impact of their daily choices. We noticed that in schools, recycling bins were often filled with items that could have been something more, or worse, items that didn't belong there at all.

We wanted to bridge the gap between "throwing things away" and "building a future." Our goal was to create an app that didn't just tell kids to recycle but showed them the magic hidden in their trash. By combining cutting-edge AI with gamification, we transformed a chore into a creative adventure.

What it does

Scrappy is a gamified recycling and environmental education app designed specifically for students and classrooms. It turns the act of recycling into an interactive, AI-driven adventure through two main modes:

Recycle Check: Students scan items to instantly identify materials, determine which bin they belong in, and see their real-time environmental impact (CO2, water, and energy saved).
Trash to Treasure: Using advanced AI, Scrappy suggests creative DIY craft projects based on the scanned "trash," providing step-by-step instructions and photorealistic previews.

Beyond scanning, Scrappy fosters community through Classroom Leaderboards, a visual Impact Garden that grows as you recycle, and a Trophy Room to showcase achievements. It even includes high-quality AI Voice Synthesis to read results and instructions aloud, ensuring the app is accessible to students of all reading levels.

How we built it

We built Scrappy using a modern, high-performance stack designed for scale and "wow" factor:

Frontend: Built with React Native and Expo, utilizing a custom design system with glassmorphism, vibrant gradients, and smooth micro-animations.
AI Integration:
- Google Gemini 2.5 Flash: Handles the heavy lifting of vision analysis and creative instruction generation.
- Google Nano Banana Pro: Generates photorealistic images of the suggested crafts.
- ElevenLabs API: Provides the "Sarah" voice for a friendly, human-like Text-to-Speech experience.
Backend: Supabase (PostgreSQL) manages our database, secure authentication, and image storage.

Challenges we ran into

MongoDB to Supabase

We initially started our development journey using MongoDB. However, we quickly realized that for a real-time, social-heavy app like Scrappy, we needed the robust relational power, built-in Authentication, and integrated Storage that Supabase provides. Completely pivoting our backend architecture mid-project was a massive challenge, but it was the right move for the app's stability.

ElevenLabs API

Integrating high-quality AI voices was more complex than expected. We faced significant hurdles managing the ElevenLabs API calls, specifically around:

Handling audio buffering.
Managing API rate limits.
Ensuring the voice synthesis felt "instant" and synced perfectly with the visual scan results.

Backend Connectivity

Connecting a complex React Native frontend to a live backend presented numerous issues. Ensuring that points, streaks, and leaderboards synced instantly across different devices while maintaining "Database Accuracy" required lots of debugging and coding.

Accomplishments that we're proud of

Built in 24 Hours: We are incredibly proud of having built a fully functional, feature-rich mobile application with a live backend and triple-AI integration in just 24 hours. This included a complete pivot of our database architecture halfway through the sprint.
Triple AI Integration: We successfully orchestrated three distinct AI models, Google Gemini 2.5 Flash (Vision/Logic), Google Nano Banana Pro (Image Gen), and ElevenLabs (TTS) into a single, seamless user flow that feels like a unified experience.
High-Quality Aesthetics: We built a premium, state-of-the-art interface featuring glassmorphism, dynamic animations, and a curated color palette that makes Scrappy feel like a top-tier App Store product.
Accessibility First: By integrating ElevenLabs' high-quality voice synthesis, we ensured that Scrappy is inclusive from day one. Younger students or those with visual impairments can fully participate in the green movement by hearing their impact and instructions read aloud.

What's next for Scrappy

AI Craft Verification: We want to use Gemini to "verify" finished crafts by having students take a photo of their creation, rewarding them with bonus "Master Maker" points.
The Scrappy Marketplace: A safe, school-only digital space where students can showcase their physical crafts and "trade" ideas.
Teacher Dashboard: Providing educators with tools to align Scrappy challenges with their science and environmental curriculum.