Skip to content
All projects
Product Engineering

EcoSphere

I built a twelve-route campus sustainability platform in Next.js 15 and React 19: issue reporting with photos, a Kanban tracking board, sustainability dashboards, an admin command centre and a gamified rewards layer. The features labelled AI are a deterministic offline simulation, not a model, and the repository says so.

Pipeline06 stages
  1. 01
    Issue reported with photo
  2. 02
    Zod schema validation
  3. 03
    Deterministic simulation engine
  4. 04
    Severity + department routing
  5. 05
    Kanban tracking board
  6. 06
    Admin and sustainability dashboards
Schematic, not a screenshot

01Problem

Campus sustainability issues get reported through scattered channels and nobody can see what happened next. This is a product prototype for what a single reporting, tracking and reporting-back surface would look like.

02Implementation

  • Twelve App Router routes covering dashboard, reporting, issue tracking with per-ticket detail, sustainability metrics, admin centre, waste scanner, predictions, rewards, notifications, profile and settings.
  • Global client state through a provider holding issues, eco points, notifications and toasts over seeded mock data.
  • Forms built with React Hook Form and Zod validation, charts with Recharts, transitions with Framer Motion.
  • A deterministic simulation engine in lib/ai-engine.ts: a seeded xorshift generator hashed from the input, so the same issue or image always produces the same analysis, with replies assembled from phrase pools rather than returned by a model.
  • Photo uploads read client-side through FileReader, so nothing is transmitted anywhere.

03Models

No machine learning model
The AI-labelled features are produced by a deterministic offline simulation engine in lib/ai-engine.ts. There is no trained model, no inference and no external API call anywhere in this project.

04Input data

Seeded mock data held in client-side React state. There is no backend, no database and no persistence: a refresh resets the application.

05Results

Runs as a complete frontend prototype. All twelve routes work against seeded state and the simulation engine returns consistent analyses for the same input. There is no authentication, backend, persistence or machine learning model.

This is a product engineering project, not an ML one. Its AI-styled features are simulated by design, so there are no model metrics to report and none are implied.

06Decisions

  • Made the simulation engine deterministic, seeded from a hash of the input, so the same report or image always yields the same analysis and demos stay reproducible.
  • Documented the simulated AI prominently in the repository README rather than presenting generated text as model output.

07Stack

TypeScriptNext.js 15React 19Tailwind CSSRechartsReact Hook FormZodFramer Motion

08Visuals

ECOSPHEREPENDINGASSIGNEDIN PROGRESSRESOLVEDPROTOTYPE INTERFACE · SEEDED DATA · SIMULATED ANALYSIS
Illustrative visualization — a diagram of the technique, not a screenshot or a real output

Screenshots of the running project will replace this once they are available.