Have you ever been completely lost trying to find your seat in a massive 80,000-seat stadium? Or missed a crucial moment because you were stuck in a long food queue?
I set out to solve this problem by designing and prototyping a Smart Stadium Experience System — an intelligent digital assistant that improves navigation, reduces waiting times, and enhances overall event experience.
Problem Statement
Large-scale venues often face challenges such as:
- Crowd congestion
- Long queues at food stalls and entry gates
- Difficulty in navigation
- Lack of real-time updates
These issues negatively impact user experience and safety.
Solution Overview
The solution is a smart, real-time assistant system that:
- Monitors crowd density
- Predicts waiting times
- Suggests optimized routes
- Sends real-time alerts
It acts as a personal guide inside the stadium, helping users make smarter decisions.
Architecture: React + Vite
The frontend is built using React with Vite for fast performance and smooth development.
Core Interfaces:
-
Attendee Navigation App
- Find seats and facilities
- View crowd density
- Get optimized routes
-
Admin Dashboard
- Monitor crowd activity
- Trigger emergency alerts
- Broadcast announcements
To simulate real-time behavior, I created a SimulatorContext using React Context API, which updates crowd density and queue times every few seconds.
Decision-Making Logic
The system uses rule-based intelligent logic:
- If crowd density exceeds a threshold → suggest alternate routes
- If waiting time is high → recommend nearby stalls
- If emergency occurs → guide users to safest exits This ensures dynamic and context-aware assistance.
Key Features
- AI-based crowd monitoring (simulated data)
- Smart navigation with less crowded routes
- Real-time queue management
- Emergency guidance system
- Admin dashboard for control and monitoring
Dockerizing the Application
To deploy the application, I containerized it using Docker.
Since React apps are static after build, I used Nginx to serve the files efficiently.
Dockerfile
dockerfile
FROM node:22-alpine as builder
WORKDIR /app
COPY package.json package-lock.json* ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx:alpine
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /app/dist /usr/share/nginx/html
EXPOSE 8080
CMD ["nginx", "-g", "daemon off;"]
⚠️ Fixing React Routing with Nginx
React Router requires all routes to redirect to index.html. Without this, direct navigation causes 404 errors.
nginx.conf
server {
listen 8080;
server_name _;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
}
☁️ Deployment Challenge: Node Version Issue
During deployment on Google Cloud Run, I encountered a build error:
npm WARN EBADENGINE Unsupported engine
The issue was that Vite requires Node 20+, but my Docker image used Node 18.
Solution:
-Updated base image to node:22-alpine
-Rebuilt and redeployed successfully
## Google Services Used
This project integrates key Google services:
-Firebase (planned integration) for real-time data handling
-Google Maps API for navigation and route visualization
-Google Cloud Run for scalable container deployment
-Google Cloud Build for automated builds
🌐 Live Demo
👉 https://stadium-ai-assistant-455356131916.us-central1.run.app/
## How It Works
-User opens the app inside the stadium
-System fetches simulated real-time data
-Analyzes crowd and queue conditions
-Suggests optimal routes and actions
-Sends alerts and updates
## Challenges Faced
-Handling client-side routing with Nginx
-Docker configuration for React apps
-Node version compatibility issues
-Keeping the project lightweight
## Assumptions
-Data is simulated (no real sensors used)
-Users have internet access
-Google Maps approximates indoor navigation
-Prototype built for demonstration purposes
## Future Improvements
-Integration with Firebase Firestore
-Real IoT sensor data
-Advanced AI/ML prediction models
-Indoor positioning systems
## Conclusion
This project demonstrates how modern web technologies and cloud platforms can solve real-world problems in large-scale environments. By combining intelligent decision-making, real-time simulation, and cloud deployment, the Smart Stadium Assistant provides a scalable and practical solution for improving stadium experiences.
## Final Thoughts
-Building this project helped me understand:
-Real-time system design
-Cloud deployment using Google Cloud Run
-Practical use of AI logic in real-world applications
## Author
Meghana Anupoju
Top comments (0)