💡 Inspiration
Live sports broadcasts move at 100 miles per hour. Whether it’s a controversial VAR offside decision in the Premier League, a defensive goaltending review in the NBA, or a complex LBW appeal in cricket, casual fans are constantly bombarded with dense jargon and confusing rules.
Official rulebooks (like the IFAB Soccer Laws or NBA Rulebook) are over 200 pages of impenetrable legalese. When a confusing play happens, fans are forced to open a new tab, search through PDFs, or read walls of text—completely taking them out of the live game experience. We built SimpliSports to solve this: an instant, privacy-first, on-page AI broadcast assistant that explains any sports play, rule, or referee call in plain English right where you're watching.
⚡ What it does
SimpliSports is a Manifest V3 Chrome Extension that turns confusing sports commentary and complex referee decisions into crystal-clear explanations without ever leaving your active tab.
Key Features across our 19-Phase Architecture:
- ⚡ Instant Text Selection & Context Menu: Highlight any sports term or commentary snippet on any website, right-click, and get a sleek, floating glassmorphic explanation card anchored directly to your screen (
0mslatency for known plays). - 📖 Client-Side Rulebook RAG Engine (
IndexedDB): Instead of hallucinating rules, SimpliSports uses a localized RAG (Retrieval-Augmented Generation) citation engine stored in structuredIndexedDB. Every match returns the official law citation (e.g.,IFAB Law 11.2,NBA Rule 11.1,NHL Rule 69) alongside an exact cosine similarity confidence score (1.00 match confidence). - 🤖 Multi-Agent AI Pipeline with Gemini Flash: For complex or unique queries, our multi-agent pipeline (
Local Matcher -> IDB RAG -> Gemini Flash AI -> Verifier Agent) dynamically processes the text to deliver grounded, accurate explanations. - ⚖️ Live Officiating Intensity & Momentum Tracker (
MutationObserver): SimpliSports can attach to any live match commentary feed (ESPN,BBC Sports, etc.). As events tick by, it updates a live Controversy Sparkline and an interactive Officiating Intensity Gauge (Flow vs Heat) to show whether the match is flowing smoothly or bogged down in heavy referee reviews. - 🎯 Rulebook X-Ray Scanner Mode: Turn on X-Ray Mode, and SimpliSports scans every explanation for critical legal linchpins (
offside,crease,clear and obvious,downward flight,interfering), wrapping them in glowing neon cyber-pills just like a pitchside VAR monitor. - 🎧 Audio Companion & Interactive Fan Quiz: Watch live streams hands-free with clear English speech synthesis (
Web Speech API) that reads explanations aloud, and gamify your sports knowledge with instant🏁 Quiz Thistrivia cards generated from real match calls.
🛠️ How we built it
We built SimpliSports from the ground up prioritizing speed, privacy, and zero bundle bloat:
- Core Extension Architecture: Pure Vanilla JavaScript (
ES Modules) and custom CSS inside a Manifest V3 Service Worker skeleton (0 dependency bloat). - Hybrid Storage & Cache: We implemented a unified 28-rule dataset backed by a Base-36 DJB2 zero-latency cache (
cache.js) and a structured IndexedDB RAG engine (idb_rag.js) for instant local fallback. - AI Integration: Google Gemini Flash API integrated via a bounded 5-item FIFO rate-limited queue (
agent_pipeline.jsandstream_helper.js) to guarantee stability during high-speed commentary spikes. - Bank-Grade Key Security: To prevent hardcoded API keys in open-source code, we built
crypto_helper.jsusing Web Crypto AES-GCM encryption (PBKDF2key derivation). The key is decrypted strictly in-memory during queries and purged on unload. - Modern Cyber-Neon UI: Built a responsive, dark-mode Glassmorphic Cybernetic Design System (
content.cssandpopup.css) with custom flex-wrapping and bounded viewports (380px) so complex citations never overflow or clash on dynamic sports websites.
🚧 Challenges we ran into
- Live Broadcast Latency vs. Rate Limiting: During high-speed match commentary, firing an API request for every single text update would trigger rate limits and lag the browser. We solved this by designing a 5-tier fallback architecture (
Local Matcher -> Base-36 Cache -> IndexedDB RAG -> Gemini API -> Bounded FIFO Queue) that answers90%of routine calls instantly offline. - Protecting API Keys in Manifest V3: Storing raw API keys in client-side extension code is a major security vulnerability. We engineered an in-memory-only Web Crypto AES-GCM encryption flow so keys are safely stored on disk as ciphertext and wiped from memory when inactive.
- Dynamic UI Overflow on Streaming Sites: Sports websites have complex DOM trees (
React,Vue). Injecting floating cards without breaking site layouts or clashing with long 45-character legal citations required building a React-safedocument.bodyanchor (z-index: 2147483644) with responsive flex-wrapping. - Strict Copyright & Compliance: To guarantee
100%compliance with sports broadcast copyrights, we explicitly banned vision/screen-scraping (tabCapture/ DRM bypass) and anchored our system strictly to text commentary and paraphrased rulebook summaries.
🏆 Accomplishments that we're proud of
- Building a full 19-phase agentic AI pipeline with RAG citations, confidence badges, live DOM mutation tracking, and audio narration inside a clean, lightweight Manifest V3 extension.
- Achieving a
1.00match confidence and0msresponse time on core sports calls (Offside,Goaltending,LBW,Icing) without relying on external servers or heavy JS frameworks. - Creating an unforgettable Cyber-Neon Glassmorphic UI complete with an Officiating Intensity Gauge (
Flow vs Heat) and Rulebook X-Ray scanner.
📚 What we learned
- Hybrid AI is the future of client apps: Relying solely on cloud LLMs is too slow and costly for real-time sports; combining lightweight client-side RAG (
IndexedDB) with powerful cloud LLMs (Gemini) gives users instant speed and deep reasoning. - Defensive DOM Engineering: When attaching
MutationObserversto live third-party sites, bounded queues and strict DOM cleanup (cleanupTracker()) are essential to prevent memory leaks and UI stuttering.
🚀 What's next for SimpliSports
- 🌍 Multi-Language Broadcast Translation: Real-time translation and cultural rule localization for Spanish, Portuguese, French, and Japanese broadcasts.
- 🏎️ Niche & Global Sports Expansion: Expanding our IDB RAG rulebook to cover Formula 1, Rugby Union, Olympic events, and Esports (
League of Legends,Valorant). - 🎚️ Adaptive Fan Difficulty Tuning: A slider that adjusts explanation depth dynamically—from "Complete Beginner (
Explain like I'm 10)" to "Tactical Analyst (Full Referee Law Breakdown)".
Built With
- ai
- chrome
- css3
- gemini-api
- google-gemini
- html5
- indexeddb
- javascript
- manifest-v3
- rag
- sports
- web-crypto
Log in or sign up for Devpost to join the conversation.