⚓ Battleship AI
⚓ Battleship AI
A reimagined mobile Battleship game powered by AI — voice commands, personality-driven commanders, and live battle narration. Built with React Native (Expo).
🚀 Quick Start
Prerequisites
1. Install dependencies
cd battleship-ai
npm install
2. Add your Anthropic API key (for AI narration)
Open src/hooks/useAINarration.js and replace:
const API_KEY = 'YOUR_ANTHROPIC_API_KEY';
with your real key from console.anthropic.com.
Without a key: The app works perfectly using the built-in fallback narration library. The API key only unlocks richer, more dynamic AI-generated lines.
3. Run the app
npx expo start
Then scan the QR code with Expo Go on your phone.
🎮 Features
v1.0 MVP
| Feature | Status | |—|—| | 🎙️ Voice Commands | ✅ Web (Speech API) / 🔧 Native (see below) | | 🧠 AI Commander Personas | ✅ 3 commanders with unique personalities | | 🎬 Dynamic Battle Narration | ✅ Fallback library + Claude API | | 🚢 Classic Battleship Gameplay | ✅ Full 10x10 grid, 5 ships | | 🎲 Auto Ship Placement | ✅ One-tap random placement | | ⚔️ 3 Difficulty Levels | ✅ Easy / Medium / Hard AI | | 🎖️ Post-Game Stats & Rank | ✅ Accuracy, shots, rank system |
🎙️ Voice Commands — Native Setup
For native iOS/Android voice recognition, install the voice library:
npx expo install @react-native-voice/voice
Then update src/hooks/useVoiceRecognition.js to use the native module:
import Voice from '@react-native-voice/voice';
// Replace the native branch in startListening() with:
Voice.onSpeechResults = (e) => {
const text = e.value[0];
const coord = parseVoiceCoord(text);
if (coord) onCoordRecognized(coord, text);
else setError(`Couldn't understand "${text}". Try "Fire at B7".`);
setIsListening(false);
};
await Voice.start('en-US');
Voice works out-of-the-box on web (Chrome/Safari). On native, the package above is needed.
🤖 AI Commanders
| Commander | Personality | Best For |
|---|---|---|
| 🏴☠️ Captain Gruffbeard | Grumpy pirate | Classic Battleship feel |
| 🌟 Admiral Nova | Theatrical drama queen | Kids who love flair |
| 🐙 Captain Bubbles | Chaotic & silly | Younger kids / family fun |
📁 Project Structure
battleship-ai/
├── App.js # Root + screen navigation state machine
├── app.json # Expo configuration
├── src/
│ ├── constants/
│ │ └── gameConstants.js # Ships, commanders, narration templates
│ ├── hooks/
│ │ ├── useAINarration.js # Claude API + fallback narration
│ │ └── useVoiceRecognition.js # Speech recognition hook
│ ├── screens/
│ │ ├── HomeScreen.js # Landing/menu screen
│ │ ├── CommanderScreen.js # Commander + difficulty selection
│ │ ├── PlacementScreen.js # Ship placement UI
│ │ ├── BattleScreen.js # Main gameplay screen
│ │ └── GameOverScreen.js # Results + stats screen
│ └── utils/
│ └── gameLogic.js # Pure game logic (no UI)
🗺️ Roadmap
v2.0 (Post-Launch)
- Real-time online multiplayer
- Predictive AI heatmaps (probability overlay)
- Procedurally generated maps with obstacles
- Fleet evolution system
- Global leaderboards
💡 Customization Tips
Add a new commander: Edit gameConstants.js and add an entry to the COMMANDERS array with your own hitReactions, missReactions, sunkReactions, etc.
Change narration style: Edit the AI_SYSTEM_PROMPT function in gameConstants.js to change the tone and instructions sent to Claude.
Adjust AI difficulty: Edit getAIShot() in gameLogic.js to tune the hard mode probability algorithm.
📋 PRD Reference
This codebase was built from the Battleship AI Product Requirements Document (PRD v1.0). Key decisions implemented:
- React Native (Expo) for cross-platform iOS + Android
- On-device voice (no server-side audio processing)
- COPPA-safe: no user accounts, no data collection
- Claude API with offline fallback narration pool
- Single player + pass-and-play modes only (multiplayer deferred to v2.0)