EcoTrace

screenshot of the page

Inspiration

Environmental impact assessments have traditionally been expensive, time-consuming, and inaccessible to most people. Small businesses, startups, and individual creators often proceed with projects without understanding their true environmental cost simply because they can't afford professional consultants or wait weeks for reports. We were inspired by the question: What if anyone could understand their project's environmental footprint in seconds? The rise of AI made this vision possible. By combining intelligent language models with environmental science principles, we set out to democratize sustainability analysis and put powerful insights in everyone's hands.

What it does

EcoTrace is a web-based tool that provides instant, AI-powered environmental impact analysis for any project. Users input their project details type, size, location, materials, energy sources, and a description and receive a comprehensive breakdown including:

CO₂ Footprint Estimate (tons/year)
Energy Usage Projection (MWh/year)
Sustainability Risk Rating (Low / Medium / High)
Material Impact Distribution (visual pie chart)
Energy Source Analysis (comparative bar chart) The AI goes beyond static calculations it interprets project descriptions contextually. For example, it recognizes eco-friendly practices like "reclaimed wood" or flags high-impact choices like "coal-powered grid" to deliver nuanced, realistic estimates.

How we built it

We built EcoTrace using a modern web stack:

Frontend: React 18 with TypeScript for type safety and maintainability
Build Tool: Vite for fast development and optimized production builds
Styling: Tailwind CSS utilities for responsive, dark-mode-ready design
Data Visualization: Recharts for interactive pie charts, bar charts, and a custom gauge component
AI Integration: Perplexity AI (sonar-pro model) to analyze project descriptions and generate intelligent impact estimates
Deployment: Vercel for instant, global deployments The architecture separates concerns cleanly the form collects user input, sends it to the AI for analysis, and the results are visualized in real-time. We also built a fallback system that uses local calculations if the API is unavailable, ensuring the app always works.

Challenges we ran into

AI Response Parsing: The AI sometimes returned responses with Markdown formatting or extra text. We had to implement robust parsing to extract clean JSON from varied response formats.
Dark Mode Consistency: Ensuring all UI elements especially info banners and charts remained visible and aesthetically pleasing in dark mode required careful attention to color contrast and opacity values.

3.API Key Security: Since this is a client-side app, we had to balance ease of use with security. We implemented environment variables and .gitignore best practices, while acknowledging the limitations of frontend-only API key handling.

Responsive Design: Making the form, results, and hero section look great on both desktop and mobile required iterative testing and layout adjustments.

Accomplishments that we're proud of

Seamless AI Integration: The Perplexity AI integration feels natural users describe their project in plain English, and the AI understands context to provide meaningful estimates.
Beautiful, Functional UI: The interface is visually polished with gradient accents, smooth transitions, and a professional feel that doesn't sacrifice usability.
Instant Value: Users get actionable insights in seconds, not weeks. This dramatically lowers the barrier to understanding environmental impact.
Robust Fallback System: Even without AI, the app provides useful estimates using our built-in calculation engine, ensuring reliability.

What's next for EcoTrace

We have an exciting roadmap ahead:

PDF Export: Allow users to download detailed reports for stakeholders and documentation
AI Recommendations: Not just analysis, but actionable suggestions on how to reduce environmental impact
Comparison Mode: Compare multiple project configurations side-by-side to see which choices are more sustainable
Industry Benchmarks: Show how a project compares to industry averages
Multi-language Support: Reach users globally with localized interfaces
Backend API: Move AI calls to a secure backend to protect API keys and enable user accounts