DraftGenius AI

AI-powered League of Legends draft assistant with real-time pick/ban recommendations, team composition analysis, and win probability predictions using pro esports data.

Comment

Inspiration

Every League of Legends player knows the frustration of losing before the game even starts due to a poorly drafted team composition. We wanted to democratize pro-level draft analysis, bringing the strategic depth of competitive esports to players of all skill levels. By combining real esports data from GRID API with cutting-edge AI analysis, DraftGenius AI bridges the gap between casual play and professional strategy.

What it does

DraftGenius AI is an intelligent draft assistant that simulates authentic League of Legends champion select with all 20 turns (10 bans + 10 picks). As you draft, it provides:

  • Real-time AI recommendations for optimal picks and bans based on current meta, team synergies, and counter-matchups
  • Team composition analysis evaluating damage types, crowd control, engage potential, and win conditions
  • Win probability calculations that update dynamically as each champion is selected
  • Strategic insights identifying draft weaknesses and suggesting adjustments
  • Pro team integration using GRID Esports API to analyze real LCK team compositions from T1, Gen.G, DRX, and more

All powered by GPT-4 and backed by comprehensive champion statistics including counter-pick relationships, synergies, and role coverage.

How we built it

Frontend:

  • React + TypeScript with Vite for lightning-fast development
  • Custom dark gaming-themed UI with authentic blue/red team color schemes
  • Tailwind CSS for responsive, polished styling
  • Lucide React icons for clean, professional visuals

Backend:

  • Express.js server handling API orchestration
  • OpenAI GPT-4 integration for intelligent draft analysis
  • GRID Esports GraphQL API for live pro team data

Data Layer:

  • Curated dataset of 160+ League champions with win rates, roles, counters, and synergies
  • Real-time GRID API queries for professional team compositions
  • Hybrid caching strategy for optimal performance

Draft Logic:

  • Authentic LoL draft order implementation (ban-ban-ban, pick-pick-pick pattern)
  • Turn-based state management with React Context
  • Timer system simulating competitive draft pressure

Challenges we ran into

GRID API Integration: Understanding GRID's two-stage GraphQL architecture (series → matches → team compositions) required careful study of their documentation. We had to design efficient queries to minimize API calls while still fetching rich team data.

AI Response Latency: Initial GPT-4 calls took 3-5 seconds, creating awkward pauses during draft. We solved this by implementing a hybrid system: instant client-side suggestions for common scenarios, with deeper AI analysis loading asynchronously for complex situations.

Champion Data Complexity: Modeling 160+ champions with accurate counter-picks, synergies, and role relationships was surprisingly intricate. We built validation scripts to ensure data consistency and realistic draft scenarios.

Real-time State Management: Coordinating draft phase transitions, turn timers, and AI recommendation updates required careful React state architecture to prevent race conditions and UI stuttering.

Accomplishments that we're proud of

✅ Successfully integrated GRID's live esports data - pulling real team compositions from LCK powerhouses like T1, Gen.G, and DRX

✅ AI that actually understands League - our prompts generate genuinely insightful analysis with specific champion synergies, win condition identification, and counter-pick reasoning

✅ Professional-grade UI - the interface feels like it belongs in the actual League client, with smooth animations and authentic esports aesthetics

✅ Comprehensive draft simulation - complete 20-turn draft with phase management, timers, and role validation

✅ Smart recommendation engine - combines win rate data, team composition balance, and meta trends into actionable suggestions

What we learned

GraphQL optimization for esports data - GRID's nested query structure taught us efficient data fetching patterns and when to denormalize for performance

Prompt engineering for game-specific AI - crafting prompts that produce consistent, strategically sound League advice required iterations and domain knowledge integration

Real-time state management at scale - coordinating multiple async data sources (API, AI, user input) with React Context and custom hooks

JetBrains IDE productivity - leveraging WebStorm's TypeScript intelligence, refactoring tools, and debugging capabilities significantly accelerated development

What's next for DraftGenius AI

🚀 Live Match Predictions - use GRID's ongoing match data to predict outcomes based on draft quality

🎮 Player-Specific Analysis - integrate Riot API to analyze individual player champion pools and suggest personalized picks

📊 Historical Draft Pattern Analysis - identify pro team draft tendencies, signature compositions, and ban priorities using GRID's match history

📱 Mobile-Responsive Redesign - rebuild the interface for tablet and mobile devices for draft prep on the go

🤖 Junie AI Deep Integration - leverage Junie's specialized League knowledge for even more nuanced strategic recommendations

🏆 Tournament Mode - simulate full best-of-5 series with evolving draft strategies and adaptation analysis

Built With

Share this project:

Updates