A real-time sustainability operations dashboard for AI data centers — built to make the human cost of every infrastructure decision impossible to ignore.
AI data centers are optimized for uptime and throughput. The water drawn from drought-stricken communities, the carbon emitted during peak grid hours, and the users quietly dropped during capacity crunches remain invisible to the people making operational decisions. Sustainability is treated as a report generated after the fact, not a gate that must be cleared before acting.
AI Factory Digital Twin changes that. Every operational change requires the operator to explicitly acknowledge its community water impact, carbon cost, and end-user effect — before the action commits. Every acknowledgment is permanently logged.
Simulates a 240-GPU data center in Oregon across five interdependent infrastructure layers, updating every 2 seconds via WebSocket:
- Power — grid draw, PUE, carbon intensity
- Cooling — cooling efficiency, water consumption, tower load
- GPU Fleet — utilization, thermal state, hardware health
- Workload — job queue, priority tiers, SLA compliance
- Local Environment — community water stress, grid stress, local air quality
Every operational lever triggers a mandatory Ethical Tradeoff Acknowledgment Modal that quantifies the sustainability and community consequences before the change is applied. There is no way to skip it. The full text of what the operator saw and acknowledged is captured in an append-only audit log, exportable at any time.
| Layer | Technologies |
|---|---|
| Frontend | React, TypeScript, Vite, Tailwind CSS, Framer Motion |
| 3D Visualization | React Three Fiber, Three.js |
| State Management | Zustand (WebSocket-driven) |
| Backend | Node.js, Express, WebSocket (ws) |
| Simulation Engine | Deterministic tick loop (2s), layer dependency propagation |
| Shared Types | TypeScript monorepo (packages/shared) |
| Deployment | AWS EC2 (backend), S3 + CloudFront (frontend) |
- Node.js ≥ 18
- npm ≥ 9
# From the repo root
npm install# Terminal 1 — backend simulation engine + REST API + WebSocket
npm run dev --workspace=packages/backend
# Terminal 2 — frontend dashboard
npm run dev --workspace=packages/frontend- Backend:
http://localhost:3001 - Frontend:
http://localhost:5173 - WebSocket connects automatically on frontend load.
- Watch live metrics update every 2 seconds across the 3D scene and top bar.
- Expand a layer card in the sidebar to see its detailed metrics.
- Open the Action Panel to adjust operational levers (cooling setpoint, GPU power cap, job scheduling priority, etc.).
- Before any change commits, the Ethical Tradeoff Acknowledgment Modal will appear — read it, then acknowledge to proceed.
- Activate a Scenario (e.g., Water Scarcity, Grid Stress Event) to inject a crisis and observe how it cascades across layers.
- Review the Audit Log to see every action taken with its full tradeoff context.
Video walkthrough:
packages/
shared/ — TypeScript interfaces, constants, pure metric formulas
backend/ — Simulation engine, Express REST API, WebSocket server
frontend/ — React UI, Zustand store, React Three Fiber 3D scene
docs/ — Architecture, PRD, design guidelines, integration contract
- ShiftSC AI Ethics Hackathon — built for this event
- React Three Fiber — Three.js renderer for React
- Zustand — lightweight state management
- NVIDIA DCGM — GPU telemetry API (future integration target)
- WattTime API — real-time grid carbon intensity (future integration target)
- US Drought Monitor — community water stress data source (future integration target)
Built with intention at ShiftSC 2025.