Warehouse Digital Twin — Interactive 3D Simulation
Interactive 3D Warehouse Digital Twin built with React Three Fiber, FastAPI, WebSockets and MQTT. Features autonomous AGV simulation, collision detection, and live inventory management.
Project Overview
A Warehouse Digital Twin is a real-time, interactive 3D simulation that mirrors the state and behavior of a physical warehouse floor. This project explores how modern web technologies — specifically React Three Fiber and the Three.js ecosystem — have made it feasible to build production-grade spatial simulations directly in the browser. The simulation features autonomous forklift agents navigating a 3D grid using Manhattan Movement logic, which models the constrained movement patterns of real Automated Guided Vehicles (AGVs). Each agent has awareness of other agents and static obstacles (shelves), with a collision detection system that halts operations in real time when safety thresholds are breached — directly mirroring the proximity sensors and emergency stop protocols found in real smart warehouse systems. The backend is a Python FastAPI server that manages simulation state: AGV positions, inventory levels, movement queues, and collision events. Real-time communication between frontend and backend runs over WebSockets and MQTT — the same protocol stack used in industrial IoT deployments — making the architecture representative of genuine production systems. The 3D shelves are interactive: clicking any shelf opens a React UI overlay displaying live stock data, item counts, and location metadata. This demonstrates how a Digital Twin serves not just as a visualization tool but as an operational interface for warehouse staff and managers. The project demonstrates the convergence of web development, IoT communication protocols, and industrial automation concepts — showing that accessible 3D tooling like drei and React Three Fiber can now support use cases that previously required specialized industrial software.
The Challenge
Traditional warehouse management relies on static dashboards and 2D floor plans that cannot capture the dynamic, real-time complexity of modern automated warehouse operations. Managers lack a live, spatial understanding of how AGVs move, where collisions could occur, and how inventory flows through the floor — making it difficult to optimize layouts, test safety protocols, or train staff before physical deployment.
The Solution
Built an interactive 3D Digital Twin of a warehouse floor using React Three Fiber for real-time 3D visualization, connected to a Python FastAPI backend via WebSockets and MQTT. The simulation runs autonomous forklift agents with pathfinding logic, live collision detection, and obstacle avoidance — creating a "living" replica of warehouse operations that can be monitored, interacted with, and used to test scenarios without physical risk.
Key Features
Technologies Used
Project Impact
Demonstrates real AGV safety protocols — collision detection and emergency stop — in a browser-based simulation
Full-stack real-time architecture using WebSockets + MQTT mirrors production industrial IoT deployments
Interactive inventory interface shows Digital Twin potential as an operational management tool
Pathfinding algorithm handles dynamic obstacle avoidance in a live 3D environment
Accessible 3D web stack (React Three Fiber) proves viability for industrial simulation use cases