--- title: ChatCraft emoji: ๐ŸŽฎ colorFrom: red colorTo: yellow sdk: docker app_port: 7860 pinned: false license: mit storage: small short_description: 1v1 RTS game controlled by voice via Mistral tags: - game - voice - mistral - rts - hackathon - svelte - fastapi --- ChatCraft is a 1v1 real-time strategy game (inspired by StarCraft's Terran race) entirely controlled by voice. Speak your commands โ€” build barracks, train marines, attack the enemy โ€” and Mistral AI interprets them into live game actions. No mouse clicks to play, just your microphone.
# ๐ŸŽฎ ChatCraft ### Voice-Controlled Real-Time Strategy Game [![Mistral](https://img.shields.io/badge/Mistral-AI-FF6B35?style=for-the-badge&logo=data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0id2hpdGUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiByeD0iNCIgZmlsbD0iI0ZGNkIzNSIvPjwvc3ZnPg==)](https://mistral.ai) [![ElevenLabs](https://img.shields.io/badge/ElevenLabs-Voice-black?style=for-the-badge&logo=data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0id2hpdGUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiByeD0iNCIgZmlsbD0iIzIyMjIyMiIvPjwvc3ZnPg==)](https://elevenlabs.io) [![HuggingFace](https://img.shields.io/badge/Hugging%20Face-Spaces-FFD21E?style=for-the-badge&logo=huggingface&logoColor=black)](https://huggingface.co/spaces) [![SvelteKit](https://img.shields.io/badge/SvelteKit-Frontend-FF3E00?style=for-the-badge&logo=svelte&logoColor=white)](https://kit.svelte.dev) [![FastAPI](https://img.shields.io/badge/FastAPI-Backend-009688?style=for-the-badge&logo=fastapi&logoColor=white)](https://fastapi.tiangolo.com) > **Mistral ร— ElevenLabs Hackathon** โ€” Command your army. With your voice. *A 1v1 real-time strategy game entirely controlled by voice. Inspired by StarCraft's Terran race โ€” playable on mobile with just a microphone.*
--- ## ๐ŸŽฏ Concept > *"Build barracks, train 4 marines, attack the enemy base"* Speak. Command. Conquer. The AI (**Mistral**) interprets your natural language orders and translates them into real-time game actions. Voice feedback from the game (*"Construction complete", "Under attack!"*) is delivered instantly via the **Web Speech API**. Touch / mouse is only used to navigate the map, inspect units or techs โ€” **never to play**. --- ## โšก Tech Stack | Layer | Technology | |:------|:-----------| | ๐Ÿ–ฅ๏ธ Frontend | SvelteKit + socket.io-client | | โš™๏ธ Backend | FastAPI + python-socketio (asyncio) | | ๐Ÿง  Command AI | Mistral API (`mistral-large-latest`) | | ๐ŸŽ™๏ธ Voice โ†’ Text | Voxtral (`voxtral-mini-latest`) | | ๐Ÿ”Š Text โ†’ Voice | Web Speech API (browser, instant, free) | | โ˜๏ธ Hosting | Hugging Face Spaces (Docker) | --- ## ๐Ÿ—ฃ๏ธ Voice Command Flow ``` ๐ŸŽค [Player holds PTT] โ”‚ โ–ผ MediaRecorder (browser) โ”‚ audio blob โ–ผ Socket.IO โ”€โ”€voice_inputโ”€โ”€โ–บ backend โ”‚ โ–ผ ๐Ÿค– Voxtral STT "train 3 marines" โ”‚ โ–ผ โœจ Mistral API (system prompt = game state) โ†’ { action: "train", unit: "marine", count: 3 } โ”‚ โ–ผ engine.apply_command() โ”‚ โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ” โ–ผ โ–ผ game_state feedback_text broadcast "Training 3 marines started" โ”‚ โ”‚ โ–ผ โ–ผ โ—„โ”€โ”€game_updateโ”€โ”€ ๐Ÿ”Š Web Speech API (browser) ``` --- ## ๐Ÿ—บ๏ธ Game โ€” Simplified Terran Race ### ๐Ÿ’Ž Resources | Resource | Source | Usage | |:---------|:-------|:------| | ๐Ÿ”ต Minerals | Patches collected by SCV | Everything | | ๐ŸŸข Vespene Gas | Geysers collected by SCV | Advanced units, upgrades | | ๐Ÿ‘ฅ Supply | Supply Depots + Command Center | Population cap | ### ๐Ÿ—๏ธ Buildings | Building | Prerequisite | Role | |:---------|:-------------|:-----| | ๐Ÿ›๏ธ Command Center | โ€” | Starting building, produces SCV | | ๐Ÿ“ฆ Supply Depot | โ€” | +8 supply | | ๐Ÿช– Barracks | โ€” | Marine, Medic | | ๐Ÿ”ง Engineering Bay | Barracks | Infantry upgrades | | ๐Ÿญ Factory | Barracks | Goliath, Tank | | โš”๏ธ Armory | Factory | Vehicle upgrades | | ๐Ÿš€ Starport | Factory | Wraith | ### โš”๏ธ Units | Unit | Cost | Prerequisite | Role | |:-----|:-----|:-------------|:-----| | ๐Ÿ”จ SCV | 50m | CC | Gathering, construction | | ๐Ÿช– Marine | 50m | Barracks | Basic infantry, anti-air | | ๐Ÿ’Š Medic | 50m / 25g | Barracks + Academy* | Heals infantry | | ๐Ÿค– Goliath | 100m / 50g | Factory | Anti-air + ground | | ๐Ÿ’ฃ Siege Tank | 150m / 100g | Factory + Machine Shop* | Ground DPS, siege mode | | โœˆ๏ธ Wraith | 150m / 100g | Starport | Air, cloaking | *\*simplified: add-ons replaced by simple building prerequisites* ### ๐ŸŽค Voice Command Examples ``` "Build a supply depot near the command center" "Train four marines" "Send all marines to attack top-left" "Put the tank in siege mode" "Patrol the wraiths around my base" "How much gas do I have?" "Scout with an SCV toward the center" ``` --- ## ๐ŸŽฎ Core Game Rules - **๐Ÿ–ฅ๏ธ HUD layout**: resources top-left, production top-right, timer center; minimap bottom-left; control groups bottom-center and right; voice/text commands on the right. - **๐ŸŒซ๏ธ Fog of war**: visibility based on the player's units and buildings (vision radii per type); explored but not visible areas semi-transparent, never-seen areas in black. - **๐Ÿ—บ๏ธ Minimap**: 40ร—40 map representation with fog, main map viewport, click to recenter. - **๐ŸŽฏ Control groups**: 3 groups; add/remove units or buildings, or create empty; unified representation by icons (buildings, technologies, units). --- ## ๐Ÿš€ Local Setup ```bash # 1. Environment variables cp .env.example .env # Fill in MISTRAL_API_KEY # 2. Backend cd backend pip install -r requirements.txt uvicorn main:app --reload --port 8000 # 3. Frontend cd frontend npm install npm run dev ``` ### ๐Ÿ”‘ Environment Variables | Variable | Description | |:---------|:------------| | `MISTRAL_API_KEY` | Mistral API key (Voxtral STT + mistral-large chat) | | `SECRET_KEY` | Key to sign lobby sessions | --- ## ๐Ÿ—๏ธ Project Architecture ``` hackaton/ โ”œโ”€โ”€ Dockerfile # HF Spaces โ€” exposes port 7860 โ”œโ”€โ”€ docker-compose.yml # Local dev โ”‚ โ”œโ”€โ”€ backend/ โ”‚ โ”œโ”€โ”€ main.py # FastAPI + Socket.IO entry point โ”‚ โ”œโ”€โ”€ lobby/manager.py # Room creation / joining, matchmaking โ”‚ โ”œโ”€โ”€ game/ โ”‚ โ”‚ โ”œโ”€โ”€ engine.py # Game loop (tick ~250ms) โ”‚ โ”‚ โ”œโ”€โ”€ state.py # GameState: resources, units, buildings โ”‚ โ”‚ โ”œโ”€โ”€ units.py # Marine / Medic / Goliath / Tank / Wraith / SCV โ”‚ โ”‚ โ”œโ”€โ”€ buildings.py # Command Center / Barracks / Factoryโ€ฆ โ”‚ โ”‚ โ”œโ”€โ”€ tech_tree.py # Build prerequisites โ”‚ โ”‚ โ””โ”€โ”€ map.py # Grid + A* pathfinding โ”‚ โ””โ”€โ”€ voice/ โ”‚ โ”œโ”€โ”€ stt.py # Voxtral STT: audio โ†’ text โ”‚ โ””โ”€โ”€ command_parser.py # Mistral: text + game state โ†’ actions โ”‚ โ””โ”€โ”€ frontend/ โ””โ”€โ”€ src/ โ”œโ”€โ”€ routes/ โ”‚ โ”œโ”€โ”€ +page.svelte # Lobby โ”‚ โ””โ”€โ”€ game/+page.svelte # Main game view โ””โ”€โ”€ lib/ โ”œโ”€โ”€ socket.ts # socket.io-client singleton โ”œโ”€โ”€ voice.ts # PTT mic capture โ†’ backend โ””โ”€โ”€ components/ โ”œโ”€โ”€ Map.svelte # Scrollable/zoomable SVG map โ”œโ”€โ”€ ResourceBar.svelte # Minerals / Gas / Supply โ””โ”€โ”€ VoiceButton.svelte # Push-to-talk button ``` --- ## ๐Ÿง  Design Notes - **python-socketio** with asyncio is chosen for room management โ€” it natively handles rooms, namespaces and reconnection out of the box. - The game loop runs **server-side** (tick every 250ms). Clients receive a full state snapshot each tick โ€” no client-side reconciliation. - Mistral receives a **summary of the player's current state** (resources, active buildings, supply) as system context for consistent command interpretation. - **PTT (push-to-talk)** avoids false positives on mobile and reduces latency by limiting audio chunk size.