🏟️ StadiumVerse AI

Smart Stadiums & Tournament Operations Platform

🏆 Built for PromptWars Challenge 4 — Smart Stadiums & Tournament Operations

StadiumVerse AI is a production-ready, full-stack web application that transforms how fans and operators interact with live sports venues. Featuring an AI-powered virtual assistant, interactive stadium maps, real-time crowd dashboards, digital ticket wallets, and emergency SOS systems — all wrapped in a stunning glassmorphic dark UI.

🚀 Live Demo · 📖 Documentation · 🐛 Report Bug · ✨ Request Feature

📸 Screenshots

🏠 Home Dashboard	📊 Crowd Operations

🎫 Schedule & Tickets	🗺️ Stadium Map

🏆 Fan Engagement Zone	🚗 Smart Parking

✨ Features

🤖 AI Chat Assistant

Powered by Google Gemini API with intelligent simulation fallback. Helps fans find food, navigate gates, book tickets, and report emergencies through natural conversation.

🗺️ Interactive Stadium Map

Custom SVG vector map of all 16 sectors (A1–D4), entrance gates, and amenity hotspots. Real-time color-coded occupancy overlays with zoom/pan controls.

📊 Live Crowd Dashboard

Real-time analytics including gate wait-times, attendance counters, security unit status, and a dynamic SVG area chart for match-day occupancy trends.

🎫 NFC Ticket Hub & Wallet

Virtual wallet with balance management. Buy tickets, select specific seats (with POV preview), and access digital NFC-style entry passes.

🚗 Smart Parking Locator

Interactive zone grids (Green/Red/Blue) with live spot availability. Click-to-reserve interface with QR parking pass generation.

🍔 Concessions & Restroom Finder

Live queue wait-times for food stalls. Full ordering cart flow (select → pay → track preparation → collect). WC occupancy + ADA accessibility logs.

🏆 Fan Engagement Zone

Match-day trivia with points rewarding wallet credits. Live audience voting polls with real-time animated bar charts.

🚨 Emergency SOS Beacon

Floating alert button for medical/security emergencies. Multi-stage dispatch simulator with real-time status log terminal.

♿ Accessibility (WCAG)

Dyslexic-friendly fonts, text zoom (3 levels), high-contrast mode, and click-to-speak TTS engine. Fully keyboard navigable.

🌍 Multi-language Support

Full internationalization with English, Spanish, French, and German translation support via React Context.

🏗️ Architecture

┌─────────────────────────────────────────────────────────────────────┐
│                        StadiumVerse AI                               │
│                                                                       │
│  ┌────────────┐   ┌──────────────────┐   ┌───────────────────────┐  │
│  │   Next.js  │   │   React Contexts  │   │     API Routes        │  │
│  │  App Router│ → │  Auth / Theme /   │ → │  /api/chat (Gemini)   │  │
│  │  (16 SSG)  │   │  Language / State │   │  POST  ─► Gemini API  │  │
│  └────────────┘   └──────────────────┘   └───────────────────────┘  │
│         │                                          │                  │
│  ┌──────▼──────┐   ┌──────────────────┐   ┌───────▼───────────────┐  │
│  │  Components │   │    lib/           │   │   Firebase            │  │
│  │  Navbar     │   │  firebase.ts      │   │   Auth (simulation    │  │
│  │  Footer     │   │  gemini.ts        │   │   fallback if no key) │  │
│  │  StadiumMap │   └──────────────────┘   └───────────────────────┘  │
│  │  AIChatBot  │                                                       │
│  │  SOSButton  │   ┌──────────────────────────────────────────────┐  │
│  │  Accessibility│  │          Tailwind CSS v4 (Glassmorphism)      │  │
│  └─────────────┘   │  Dark / Light / High-Contrast Themes          │  │
│                     └──────────────────────────────────────────────┘  │
└─────────────────────────────────────────────────────────────────────┘

🔄 CI/CD Workflow

┌──────────────┐     push/PR      ┌─────────────────────────────────┐
│   Developer  │ ───────────────► │        GitHub Actions CI         │
│   (Local)    │                  │                                   │
└──────────────┘                  │  1. ✅  Checkout Code            │
                                  │  2. 📦  Setup Node.js 20.x       │
                                  │  3. 🔒  Install Dependencies      │
                                  │  4. 🔍  Run ESLint                │
                                  │  5. 🔷  TypeScript Check          │
                                  │  6. 🏗️  Build (next build)        │
                                  │  7. 🎉  Report Success            │
                                  └──────────────┬──────────────────┘
                                                 │ on: main branch
                                  ┌──────────────▼──────────────────┐
                                  │          Vercel Deploy           │
                                  │   Auto-deploys on push to main   │
                                  │   Preview deployments on PRs     │
                                  └─────────────────────────────────┘

🛠️ Tech Stack

Category	Technology
Framework	Next.js 16 (App Router, TypeScript)
Styling	Tailwind CSS v4, Custom Glassmorphism Variables
Icons	Lucide React
AI / LLM	Google Gemini API (`@google/generative-ai`)
Auth & DB	Firebase Authentication + Firestore (+ Simulation Mode)
Deployment	Vercel (auto-configured)
CI/CD	GitHub Actions
Accessibility	WCAG 2.1 AA — High Contrast, TTS, Dyslexic Font
i18n	Custom React Context (EN / ES / FR / DE)

📂 Project Structure

stadium-verse-ai/
├── .github/
│   └── workflows/
│       └── ci.yml                  # GitHub Actions CI/CD Pipeline
├── src/
│   ├── app/
│   │   ├── api/chat/route.ts       # Gemini Chat API endpoint
│   │   ├── auth/page.tsx           # Login & Quick Demo accounts
│   │   ├── dashboard/page.tsx      # Live crowd heatmap & analytics
│   │   ├── schedule/page.tsx       # Matches, Tickets & POV Simulator
│   │   ├── parking/page.tsx        # Parking zone grid & reservations
│   │   ├── amenities/page.tsx      # Food ordering & restroom finder
│   │   ├── fan-zone/page.tsx       # Trivia games & audience polls
│   │   ├── admin/page.tsx          # Operations control room (Admin only)
│   │   ├── settings/page.tsx       # Wallet, theme & language settings
│   │   ├── about/page.tsx          # Project info & feature overview
│   │   ├── contact/page.tsx        # FAQ & support ticket form
│   │   ├── globals.css             # Theme variables & glassmorphism
│   │   ├── layout.tsx              # Root layout with context providers
│   │   └── page.tsx                # Home — live scores, widgets & maps
│   ├── components/
│   │   ├── Navbar.tsx              # Responsive nav + wallet + language
│   │   ├── Footer.tsx              # Live ops status widget
│   │   ├── AccessibilityToolbar.tsx# Font, zoom, contrast & TTS engine
│   │   ├── SOSButton.tsx           # Floating emergency dispatch beacon
│   │   ├── StadiumMap.tsx          # Interactive SVG arena map
│   │   └── AIChatBot.tsx           # Floating AI chat assistant
│   ├── context/
│   │   ├── AuthContext.tsx         # Auth state + wallet + tickets
│   │   ├── ThemeContext.tsx        # Dark / Light / High-Contrast themes
│   │   └── LanguageContext.tsx     # i18n translations (EN/ES/FR/DE)
│   └── lib/
│       ├── firebase.ts             # Firebase SDK initializer
│       └── gemini.ts               # Gemini AI helper + simulator
├── public/                         # Static assets
├── .env.example                    # Environment variables template
├── next.config.ts                  # Next.js configuration
├── tailwind.config.ts              # Tailwind CSS configuration
├── tsconfig.json                   # TypeScript configuration
└── README.md                       # This file

🚀 Getting Started

Prerequisites

Node.js v18 or higher
npm v9 or higher

1. Clone the Repository

git clone https://github.com/rishitha0208/stadium-verse-ai.git
cd stadium-verse-ai

2. Install Dependencies

npm install

3. Configure Environment Variables

cp .env.example .env.local

Then edit .env.local with your credentials:

# Google Gemini API (optional — app runs in simulation mode without it)
GEMINI_API_KEY=your_gemini_api_key_here

# Firebase (optional — app runs in simulation mode without it)
NEXT_PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_project.appspot.com
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
NEXT_PUBLIC_FIREBASE_APP_ID=your_app_id

ℹ️ Note: The app runs fully in Simulation Mode without any API keys. All features are interactive and functional without external services.

4. Run Development Server

npm run dev

Open http://localhost:3000 in your browser.

5. Build for Production

npm run build
npm start

🔑 Demo Accounts

The app auto-logs in with a demo fan account. You can also use quick-login buttons on the auth page:

Account	Email	Role
🙋 Fan Account	`fan@stadiumverse.ai`	Standard user
🛡️ Admin Account	`admin@stadiumverse.ai`	Full operations access

☁️ Deploy to Vercel

Click the button above or import the repo in Vercel dashboard.
Add your environment variables in the Vercel project settings.
Deploy — done! Vercel auto-detects Next.js configuration.

🤝 Contributing

Fork the repository
Create your feature branch: git checkout -b feature/amazing-feature
Commit your changes: git commit -m 'feat: add amazing feature'
Push to the branch: git push origin feature/amazing-feature
Open a Pull Request

📄 License

This project is licensed under the MIT License — see the LICENSE file for details.

Built with ❤️ for PromptWars Challenge 4

⭐ Star this repo if you found it useful!

Name		Name	Last commit message	Last commit date
Latest commit History 1 Commit
.github/workflows		.github/workflows
public		public
src		src
.gitignore		.gitignore
AGENTS.md		AGENTS.md
CLAUDE.md		CLAUDE.md
README.md		README.md
eslint.config.mjs		eslint.config.mjs
next.config.ts		next.config.ts
package-lock.json		package-lock.json
package.json		package.json
postcss.config.mjs		postcss.config.mjs
tsconfig.json		tsconfig.json
vercel.json		vercel.json

Folders and files

Latest commit

History

Repository files navigation

🏟️ StadiumVerse AI

Smart Stadiums & Tournament Operations Platform

📸 Screenshots

✨ Features

🤖 AI Chat Assistant

🗺️ Interactive Stadium Map

📊 Live Crowd Dashboard

🎫 NFC Ticket Hub & Wallet

🚗 Smart Parking Locator

🍔 Concessions & Restroom Finder

🏆 Fan Engagement Zone

🚨 Emergency SOS Beacon

♿ Accessibility (WCAG)

🌍 Multi-language Support

🏗️ Architecture

🔄 CI/CD Workflow

🛠️ Tech Stack

📂 Project Structure

🚀 Getting Started

Prerequisites

1. Clone the Repository

2. Install Dependencies

3. Configure Environment Variables

4. Run Development Server

5. Build for Production

🔑 Demo Accounts

☁️ Deploy to Vercel

🤝 Contributing

📄 License

About

Topics

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Contributors

Uh oh!

Languages

Packages