Sanchaay

• 

  THE LOGIN PAGE

• 

  Home page

• 

  Impact Page-AQI

• 

  Tracker Page-to track co2 emissions being saved

• 

  AI prediction of Co2 saved

• 

  Gamified Missions provided by team Sanchaay every week also daily

• 

  Learning module

• 

  Glimpse of one of learning tracks

• 

  Quiz for rankings

• 

  Robust community section like X

• 

  AI helper which is customized for eco friendly answers

🌱 Inspiration

The world isn't short on climate awareness — it's short on climate action.
Eco-Anxiety is paralyzing the very people who care most. Fear and guilt weren't working.
So we asked: what if saving the planet felt like playing an MMO? That question became Sanchaay.

---

What it does

Sanchaay is a gamified sustainability platform where daily eco-actions earn you XP, badges, and levels — from Seedling to Forest Guardian.

• EcoBot — AI coach powered by Google Gemini, reads your stats, gives personalized advice
• Real-time charts — visualize your CO2 savings as they grow
• Micro-learning — bite-sized climate science modules
• Daily missions — keep the habit alive

🌐 Try it live

---

How we built it

Built as a React 18 + TypeScript SPA on Vite, styled with a custom Neo-Brutalist design system in Tailwind CSS.

AI Integration: Google Gemini 1.5 Flash with dynamic prompt injection — feeding real-time user state (level, streak, badges) into every call.

The XP leveling curve:

$$XP_{next} = 100 \times L^{1.5}$$

where \( L \) is the current level — rewarding early wins while scaling challenge over time.

const calculateXP = (level: number): number => {
  return Math.floor(100 * Math.pow(level, 1.5));
};

---

Challenges we ran into

Hallucination vs. Persona — Keeping EcoBot optimistic yet scientifically accurate required aggressive prompt engineering.

State Sync Loops — XP + badge logic caused React useEffect infinite loops. Solved with a custom optimized sync hook.

Neo-Brutalism at Scale — Hard shadows fight standard responsive patterns. Required precise CSS variable control.

---

Accomplishments we're proud of

• Zero-latency interactions — every action and level-up feels instant
• EcoBot's personality — feels like a supportive friend, not a chatbot
• Dynamic leveling engine — badges unlock based on real aggregate user data

---

What we learned

LLMs become exponentially more useful when grounded in structured app state.

We mastered prompt engineering, Neo-Brutalist UI craft, and how tiny feedback loops — a progress bar filling, a badge popping — have outsized effects on motivation.

---

What's next

• Supabase for multiplayer leaderboards and Guild competitions
• React Native mobile app for on-the-go tracking
• Computer vision to auto-verify recycling via camera snap
• Brand partnerships — redeem XP for real sustainable product discounts

Built With

• autoprefixer
• client-side-rendering
• css3-variables
• esbuild
• express.js
• framer-motion
• git
• github
• google-gemini-1.5-flash-api
• gpu-acceleration
• html5
• json
• localstorage-api
• lucide-icons
• markdown
• mongodb
• mongoose
• node.js
• npm
• openrouter-api
• postcss
• react-18
• react-context-api
• react-hooks
• react-router
• recharts
• responsive-design
• semantic-html5
• single-page-application
• tailwind-css
• typescript
• vercel
• vite
• wai-aria-standards