DEV Community

Saras Growth Space
Saras Growth Space

Posted on

What If Your Daily Habits Had a Carbon Score? I Built EcoTrack AI 🌱

DEV Weekend Challenge: Earth Day

This is a submission for Weekend Challenge: Earth Day Edition


What I Built

Most people understand climate change β€” but very few can see their personal impact in a meaningful way.

EcoTrack AI is a frontend-only React application that turns everyday lifestyle choices into a measurable carbon footprint and feedback system.

Users enter three simple inputs:

  • transport
  • food habits
  • daily energy usage

The system then computes a deterministic carbon score using real-world emission factors, compares it against global benchmarks, and generates rule-based sustainability recommendations.

But the core idea is not calculation.

It is behavior visibility.

EcoTrack AI is designed as a behavioral feedback system, where small daily actions become visible, comparable, and improvable over time.


Demo

The demo shows:

  • lifestyle input selection
  • simulated analysis flow
  • carbon score generation
  • comparison with global averages
  • personalized suggestions
  • weekly trend visualization
  • collective impact projection
  • feedback loop for behavior adjustment

How I Built It

EcoTrack AI was intentionally designed as a frontend-first behavioral simulation system, not a backend-driven AI product.

The goal was to build something explainable, transparent, and focused on user behavior feedback.

Key Design Decisions

1. Deterministic Carbon Engine
All emissions are calculated using predefined real-world factors for transport, food, and energy usage. This ensures full transparency and reproducibility.

2. Rule-Based Recommendation System
Suggestions are generated using explicit conditional logic tied directly to user inputs. No machine learning or external APIs are used.

3. Simulated Intelligence Layer (UX Choice)
A short loading sequence simulates β€œAI analysis”. This is not real AI β€” it is a deliberate UX decision to make the system feel responsive and intentional.

4. Behavior-Driven Architecture
Every component is designed around one idea:
πŸ‘‰ β€œHow does this change user behavior after seeing their result?”

5. Personalized Visualization System
Weekly trend data is generated based on user input, making insights feel contextual rather than static.


Technical Architecture

Built using React (Vite) with a modular component structure:

  • Centralized state management in App.jsx
  • Isolated carbon logic in carbonLogic.js
  • Component-driven UI for each stage of user journey
  • Recharts for visualization
  • Pure CSS design system with semantic color tokens

AI Usage Transparency

EcoTrack AI does not use real AI models.

All β€œAI-powered insights” are simulated using deterministic rule-based logic.

However, the architecture is intentionally designed to support future integration with LLM-based systems such as Google Gemini for contextual recommendations.

Development was accelerated using AI tools for component scaffolding and UI iteration.


Additional Notes

  • All carbon calculations are based on defined emission factors
  • No backend, APIs, or external services are used
  • System is fully explainable and runs entirely in the browser

EcoTrack AI is not a prediction tool.

It is a feedback system for behavior change.

Its purpose is simple:

Make impact visible β†’ make decisions conscious β†’ enable small, consistent change.

Because awareness alone doesn’t change behavior β€” feedback does.

Top comments (1)

Collapse
 
aibughunter profile image
AI Bug Slayer 🐞

A personal carbon score for daily habits is a powerful nudge for behavior change! Gamifying sustainability with AI-driven insights could genuinely shift how people think about their footprint.