Lumina - VALORANT Esports Analytics Platform

Inspiration

Professional VALORANT teams invest thousands of hours analyzing opponents, but most analytics tools only scratch the surface. Coaches spend countless hours watching VODs, manually tracking statistics, and trying to identify patterns that could give their team an edge. We saw an opportunity to transform this labor-intensive process into an intelligent, AI-powered analytics platform that could provide instant insights and tactical recommendations.

The inspiration came from watching professional teams struggle with disconnected data sources, spreadsheets full of stats that don't tell the full story, and the inability to quickly answer strategic questions like "How do we counter their A-site executes?" or "What's our player's clutch tendency in post-plant situations?" We wanted to build something that felt like having a professional analyst on call 24/7.

What it does

Lumina is a comprehensive VALORANT esports analytics platform that combines deep statistical analysis with AI-powered conversational insights. Here's what makes it special:

AI Chat Assistant: Ask natural language questions about any player, team, or match. "How could I have played round 3 better?" or "Tell me about bang's clutch performance" - the AI understands context, queries the database directly, and provides detailed, data-backed responses with specific statistics.

Round-by-Round Analysis: Every round is tracked with complete detail - economy states, spike events, player positions at critical moments, winning conditions, and more. Click into post-plant rounds to see exact player positions when the spike was planted, revealing save/retake patterns.

VOD Review System: Upload round footage and get AI-powered tactical analysis. The system identifies key moments, highlights good decisions versus risky plays, and provides playstyle-adaptive suggestions. For a bonus round, it understands the strategic context and recommends safer alternatives to aggressive plays.

Advanced Metrics: Beyond basic K/D ratios, Lumina calculates:

Lumina Combat Score (LCS): Impact-weighted performance metric
Trading Efficiency: How often teammates trade your deaths
Opening Duel Success: First kill/first death differential
Clutch Performance: Win rate in 1vX situations
First Death Impact: Team loss rate when you die first
Economy Phase Analysis: Performance on eco, force, and full buy rounds

Screen-Aware Intelligence: The AI assistant knows what you're looking at. View a specific game, and the chat automatically has context about the teams, map, scores, and rounds. No need to explain - just ask.

How we built it

Frontend Architecture:

Next.js 15 with App Router for server-side rendering and optimal performance
TypeScript throughout for type safety across complex data models
Custom design system with Tailwind CSS featuring VALORANT-inspired theming
React Query for intelligent data caching and optimistic updates
Framer Motion for smooth animations and transitions

Database & ETL Pipeline:

Built a robust Extract-Transform-Load pipeline to process VALORANT match data from Grid.gg
Supabase PostgreSQL database with normalized schemas: tournaments, teams, players, series, games, rounds, player_round_stats, kill_events, spike_events
Custom analytics engine calculates 50+ metrics from raw event data
RPC functions for complex queries: trading efficiency, clutch analysis, economy patterns
Optimized indexes for sub-50ms query performance on 50,000+ round events

AI Integration:

OpenAI GPT-4o with function calling for the chat assistant
15 custom tools that query the database directly: get player stats, compare teams, analyze rounds, identify counter-strategies, and more
Streaming responses for real-time feedback
Structured block rendering system for stats, insights, player cards, and recommendations
Context-aware prompting that includes visible screen data

Vision Model Pipeline (Work in Progress):

Collected diverse VALORANT gameplay screenshots across all maps and scenarios
Built custom autolabel platform from scratch for efficient image annotation
Labeled thousands of images with player positions, spike status, team compositions, ultimate availability
Trained computer vision model to extract tactical information from VOD footage
Currently integrated with mocked data, but infrastructure is production-ready

Development Tools:

JetBrains WebStorm for intelligent code editing and refactoring
Junie AI for code generation, bug fixes, and optimization suggestions
Git with atomic commits for clean version control
Vercel for deployment with edge network CDN

Challenges we ran into

1. Real-time AI Context Management: Making the AI assistant truly context-aware was harder than expected. We needed to track what the user is viewing (which game, which round, which team) and seamlessly pass that to the AI without the user having to explain. We solved this with a custom React hook (usePushScreenData) that manages a context stack and automatically includes relevant data in AI prompts.

2. Complex Database Queries: Calculating advanced metrics like trading efficiency required correlating kill events across time windows (was a teammate's kill within 5 seconds of my death?). We moved complex logic into PostgreSQL RPC functions to keep queries fast and maintainable.

3. Vision Model Integration: Building a computer vision model that accurately detects player positions, agent types, and tactical states from screenshots was ambitious. We built the autolabel platform and collected training data, but achieving production-level accuracy is ongoing work. For the hackathon, we demonstrated the concept with mocked data while the model continues training.

4. VOD Timeline Synchronization: Linking AI-detected key moments to specific video timestamps required careful event detection and time alignment. We implemented a key moments system that identifies critical plays (first bloods, clutches, spike plants) and allows instant video seeking.

5. Performance at Scale: With 50,000+ round events, initial queries were slow. We implemented strategic B-tree indexes, connection pooling, and in-memory caching to achieve sub-50ms response times.

6. Type Safety Across Complex Data Models: VALORANT data has deep nesting (tournaments → series → games → rounds → player stats → kill events). Maintaining TypeScript type safety across this hierarchy required careful schema design and auto-generated types from Supabase.

Accomplishments that we're proud of

1. Fully Functional AI Chat with 15 Database Tools: Every single chat tool actually works. The AI can query player stats, compare teams, analyze economy patterns, identify untraded deaths, and more - all backed by real database queries, not mocked responses.

2. Professional-Grade UI/UX: The interface feels polished and production-ready. Map backgrounds with proper opacity, smooth animations, responsive layouts, VALORANT-inspired color schemes. It doesn't look like a hackathon project - it looks like software professionals would actually use.

3. Vision Model Infrastructure: While the model is still training, we built the entire pipeline from scratch: custom autolabel platform, thousands of labeled images, model training infrastructure, and API integration points. The hard work is done - it's just a matter of improving accuracy now.

4. Advanced Analytics Engine: We're calculating metrics that professional analysts care about - trading efficiency, clutch tendencies, opening duel success. These aren't vanity metrics; they're actionable insights that can change how teams play.

5. Rapid Development with Modern Tools: Using WebStorm and Junie AI, we shipped a production-quality app in record time. The AI-assisted development workflow was a game-changer for productivity.

6. Clean Architecture: The codebase is maintainable and extensible. Custom hooks, reusable components, clear separation of concerns, comprehensive TypeScript types. We could hand this off to another team tomorrow and they'd understand it.

What we learned

1. AI Context is Everything: A chat assistant is only as good as the context you give it. We learned that proactively tracking user state and injecting relevant data into prompts makes AI responses dramatically better than forcing users to explain everything.

2. PostgreSQL is Incredibly Powerful: Moving complex analytics logic into database functions was a revelation. Queries that took 500ms in application code run in 30ms when pushed to PostgreSQL RPC functions.

3. Vision Models Require Massive Datasets: Computer vision is hard. Building an accurate model requires thousands of labeled examples, careful data augmentation, and iterative training. We underestimated the effort but built the infrastructure to succeed long-term.

4. ETL Pipelines Need Robust Error Handling: Match data from APIs isn't always clean. We learned to validate inputs, handle missing fields gracefully, and log errors for debugging without breaking the entire pipeline.

5. Type Safety Saves Time: TypeScript caught dozens of bugs before runtime. Auto-generated types from Supabase schemas meant zero drift between database and application code.

6. AI-Assisted Development Works: Junie AI legitimately accelerated development. It wrote boilerplate, caught bugs, suggested optimizations, and explained complex patterns. The future of development is human + AI collaboration.

What's next for Lumina

1. Production Vision Model: Complete training and deploy the computer vision model to production. Enable automatic VOD analysis where coaches upload footage and get instant tactical breakdowns without manual data entry.

2. Live Match Integration: Real-time match tracking during professional games. Analysts get live stats, win probability updates, and strategic insights as rounds unfold.

3. Comparative Analytics: "How does our team's site preference compare to the top 5 teams in our region?" Enable cross-team benchmarking and meta analysis.

4. Scrim Analysis: Extend beyond professional matches to team scrimmages. Give amateur and semi-pro teams access to the same analytics infrastructure as top-tier organizations.

5. Mobile Companion App: Coaches need insights on the go. Build a mobile version optimized for tablet use during team discussions and strategy sessions.

6. API for Third-Party Tools: Open up Lumina's analytics engine via API so other tools (team management platforms, tournament organizers, broadcast overlays) can integrate our insights.

7. Predictive Modeling: Use historical data to predict match outcomes, suggest optimal compositions, and identify emerging meta trends before they become mainstream.

8. Automated Highlight Reels: Automatically detect and compile highlight moments from VODs - clutches, aces, perfect executes - saving hours of manual video editing.