アーキテクチャ / Architecture
システム全体図 / System Overview
┌──────────────────────────────────────────────────────────────────────┐
│ VIEWERS / LIVE PLATFORMS │
│ │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────────────────┐ │
│ │ YouTube Live │ │ TikTok Live │ │ OBS Studio │ │
│ │ │ │ │ │ ・Game screen capture │ │
│ │ Super Chat │ │ TikTok Gifts │ │ ・UI overlay │ │
│ │ Live Chat │ │ Live Comments│ │ ・Multi-platform output │ │
│ └──────┬───────┘ └──────┬───────┘ └──────────▲──────────────┘ │
│ │ │ │ │
│ Tips + Comments Tips + Comments Screen output │
└─────────┼─────────────────┼──────────────────────┼───────────────────┘
│ │ │
▼ ▼ │
┌──────────────────────────────────────────────────────────────────────┐
│ BACKEND SERVER (Node.js) │
│ │
│ ┌─────────────────┐ ┌─────────────────┐ │
│ │ YouTube Module │ │ TikTok Module │ │
│ │ ・LiveChat Poll │ │ ・Live Connector │ │
│ │ ・SuperChat │ │ ・Gift Events │ │
│ └────────┬────────┘ └────────┬────────┘ │
│ │ │ │
│ ▼ ▼ │
│ ┌──────────────────────────────────────────────────────────────┐ │
│ │ Unified Event Queue │ │
│ │ │ │
│ │ 🔴 [TIP] priority: IMMEDIATE → 即座にLLM呼び出し │ │
│ │ 🟢 [COMMENT] priority: NORMAL → 10分バッチに蓄積 │ │
│ └──────────────────────────┬───────────────────────────────────┘ │
│ │ │
│ ┌──────────────────┼──────────────────┐ │
│ ▼ ▼ ▼ │
│ ┌────────────────┐ ┌──────────────┐ ┌───────────────────┐ │
│ │ Turn Scheduler │ │ Tip Handler │ │ Game State Mgr │ │
│ │ (10-min cycle) │ │ (immediate) │ │ ・Time management │ │
│ └────────┬───────┘ └──────┬───────┘ │ ・Status update │ │
│ │ │ │ ・Item management │ │
│ ▼ ▼ └────────▲──────────┘ │
│ ┌──────────────────────────────────────────────┐ │
│ │ AI Agent Manager │ │
│ │ │ │
│ │ ┌──────┐ ┌──────┐ ┌──────┐ │ │
│ │ │ John │ │ Sara │ │ Eve │ │ │
│ │ │Agent │ │Agent │ │Agent │ │ │
│ │ │JP/EN │ │JP/EN │ │ │ │ │
│ │ └──────┘ └──────┘ └──────┘ │ │
│ └──────────────────────────────────────────────┘ │
│ │ │
│ ┌──────────────────────────────────────────────────────────────┐ │
│ │ Memory Store (SQLite) │ │
│ │ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌────────────────┐ │ │
│ │ │John mem │ │Sara mem │ │Eve mem │ │ Shared state │ │ │
│ │ └──────────┘ └──────────┘ └──────────┘ └────────────────┘ │ │
│ └──────────────────────────────────────────────────────────────┘ │
└────────────────────────────────┬─────────────────────────────────────┘
│ WebSocket
▼
┌──────────────────────────────────────────────────────────────────────┐
│ FRONTEND RENDERER (Browser) │
│ ┌──────────────────────────────────────────────────────────────┐ │
│ │ PixiJS 2D Renderer │ │
│ │ ┌────────────┐ ┌──────────────┐ ┌─────────────────────┐ │ │
│ │ │ Tilemap │ │ Sprite Mgr │ │ Animation Ctrl │ │ │
│ │ │ (room) │ │ (characters) │ │ (walk/sit/sleep) │ │ │
│ │ └────────────┘ └──────────────┘ └─────────────────────┘ │ │
│ │ ┌────────────┐ ┌──────────────┐ ┌─────────────────────┐ │ │
│ │ │ UI Layer │ │ Dialog Box │ │ Effect System │ │ │
│ │ │ (status) │ │ (speech/i18n)│ │ (tips/comments) │ │ │
│ │ └────────────┘ └──────────────┘ └─────────────────────┘ │ │
│ └──────────────────────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────────────────────┘技術スタック / Tech Stack
| Layer | Tech | Reason |
|---|---|---|
| Frontend | PixiJS v8 + TypeScript | Lightweight 2D. Browser-based for OBS capture |
| Backend | Node.js + TypeScript | Same language as frontend. Easy WebSocket |
| AI | Claude Haiku 4.5 API | Cheapest. Optimal for 10-min cycles + instant tips |
| Database | SQLite (better-sqlite3) | Lightweight. Serverless. Easy backup |
| Realtime | WebSocket (ws) | Backend → Frontend state push |
| YouTube | YouTube Live Streaming API | Super Chat + Live Chat |
| TikTok | TikTok-Live-Connector | Gift events + Live Comments (WebSocket) |
| Multi-stream | Restream.io or OBS Multi-RTMP | Simultaneous output to YT + TikTok |
| Voice (optional) | VOICEVOX / Style-Bert-VITS2 | Free, local. Character voices |
| Streaming | OBS Studio | Browser source for game capture |
| Package | pnpm workspace | Monorepo: frontend / backend / shared |
| i18n | Custom (JSON-based) | Bilingual UI and dialogue |
ディレクトリ構成 / Directory Structure
AIPrizeCohabitationLife/
├── packages/
│ ├── shared/ # Shared types & constants
│ │ ├── src/
│ │ │ ├── types/ # GameState, Character, Item types
│ │ │ ├── constants/ # Item master, action categories
│ │ │ ├── i18n/ # Bilingual strings (JP/EN)
│ │ │ └── index.ts
│ │ └── package.json
│ │
│ ├── backend/ # Game logic, AI, platform integration
│ │ ├── src/
│ │ │ ├── agents/ # AI agent management
│ │ │ │ ├── AgentManager.ts
│ │ │ │ ├── JohnAgent.ts
│ │ │ │ ├── SaraAgent.ts
│ │ │ │ └── EveAgent.ts
│ │ │ ├── game/ # Game core logic
│ │ │ │ ├── GameLoop.ts
│ │ │ │ ├── TurnScheduler.ts # 10-min regular cycle
│ │ │ │ ├── TipInterrupt.ts # Immediate tip handler
│ │ │ │ ├── StateManager.ts
│ │ │ │ └── EventQueue.ts
│ │ │ ├── platforms/ # Multi-platform integration
│ │ │ │ ├── youtube/
│ │ │ │ │ ├── LiveChatPoller.ts
│ │ │ │ │ └── SuperChatHandler.ts
│ │ │ │ ├── tiktok/
│ │ │ │ │ ├── TikTokConnector.ts
│ │ │ │ │ └── GiftHandler.ts
│ │ │ │ └── UnifiedTipProcessor.ts
│ │ │ ├── memory/ # Memory management
│ │ │ │ ├── MemoryStore.ts
│ │ │ │ └── EpisodicMemory.ts
│ │ │ ├── db/ # SQLite schema & migrations
│ │ │ └── server.ts # Express + WebSocket
│ │ └── package.json
│ │
│ └── frontend/ # PixiJS rendering
│ ├── src/
│ │ ├── scenes/ # Room scenes, outing scenes
│ │ ├── sprites/ # Character sprite management
│ │ ├── ui/ # Status bar, speech bubbles, tip effects
│ │ ├── tilemap/ # Room tilemap
│ │ ├── i18n/ # Frontend i18n (JP/EN toggle)
│ │ ├── assets/ # Pixel art assets
│ │ │ ├── characters/
│ │ │ ├── tiles/
│ │ │ ├── items/
│ │ │ └── effects/
│ │ └── main.ts
│ └── package.json
│
├── prompts/ # AI agent prompt templates
│ ├── john_system.md
│ ├── sara_system.md
│ ├── eve_system.md
│ └── turn_decision.md # Shared turn decision prompt
│
├── data/
│ ├── items_master.json # Item master data
│ ├── actions_master.json # Action category definitions
│ ├── events_master.json # Event definitions
│ └── tip_tiers.json # Tip → item mapping (all platforms)
│
├── docs/ # This spec site (VitePress)
├── pnpm-workspace.yaml
├── package.json
└── tsconfig.base.jsonコスト見積もり / Cost Estimate
LLM API Cost (Claude Haiku 4.5)
| Item | Calculation |
|---|---|
| Regular cycles | 144 cycles/day × 3 agents = 432 calls/day |
| But: many are sleep/idle (skip LLM) | Effective: ~200 calls/day |
| Tip reactions | ~20 calls/day (depends on tips) |
| Comment responses | ~30 calls/day |
| Total | ~250 calls/day |
| Avg tokens per call | 500 input + 200 output |
| Daily cost | ~$0.30/day |
| Monthly cost | ~$9/month |
Infrastructure Cost
| Item | Cost |
|---|---|
| Server (local PC or VPS) | $0〜$10/month |
| Cloudflare Pages (spec site) | $0 |
| YouTube API | $0 (within quota) |
| TikTok API | $0 |
| Restream.io (optional) | $0〜$16/month |
| Total | $9〜$35/month |