# CINC游戏项目产品需求文档

## 1. 产品概述

CINC是一款基于Phaser.js引擎开发的2D顶视角游戏，旨在提供简单而有趣的游戏体验，同时构建一个可扩展的游戏框架。

- **核心目标**：创建一个轻量级、易扩展的游戏框架，支持基本的玩家控制、物品收集、NPC交互和游戏世界构建。
- **目标用户**：休闲游戏玩家，尤其是喜欢2D顶视角游戏的用户，以及游戏开发者（作为学习和扩展的基础框架）。
- **产品价值**：提供一个可定制的游戏框架，便于后续功能扩展和内容丰富，同时展示2D游戏开发的最佳实践。

## 2. 核心功能

### 2.1 玩家控制

**功能描述**：允许玩家通过键盘、鼠标和虚拟摇杆控制游戏角色。

**具体需求**：
- 支持键盘方向键或WASD键控制角色移动
- 支持鼠标点击选择角色
- 支持右键点击设置移动目标点
- 支持移动设备上的虚拟摇杆控制
- 角色移动平滑，有适当的动画效果

### 2.2 物品系统

**功能描述**：游戏世界中存在可收集的物品，玩家可以收集和使用这些物品。

**具体需求**：
- 随机生成物品（如小草、资源等）
- 角色可以接近并收集物品
- 物品收集后从游戏世界中移除并添加到背包
- 物品具有基本属性（名称、类型、描述等）
- 背包系统管理收集的物品

### 2.3 NPC系统

**功能描述**：游戏世界中存在非玩家角色（NPC），具有基本的AI行为。

**具体需求**：
- 随机生成NPC
- NPC具有不同的状态（待机、搜索、采集、受控）
- NPC能够自动搜索和收集物品
- NPC之间存在碰撞检测
- NPC与玩家之间的交互

### 2.4 游戏世界

**功能描述**：创建一个基本的游戏世界，包含地形、物理碰撞和环境交互。

**具体需求**：
- 基本的游戏地图和地形
- 物理碰撞检测（角色与角色、角色与环境）
- 游戏世界边界设置
- 相机跟随和小地图显示
- 响应式设计，适应不同屏幕尺寸

### 2.5 基本UI

**功能描述**：提供基本的游戏界面，显示游戏状态和信息。

**具体需求**：
- 角色状态指示器
- 简单的游戏菜单
- 基本的游戏信息显示
- 背包界面
- 物品列表菜单

### 2.6 多语言支持

**功能描述**：游戏支持多种语言，提供本地化界面。

**具体需求**：
- 语言切换功能
- 多语言文本支持
- 语言文件管理

### 2.7 技能系统

**功能描述**：角色可以使用各种技能，增强游戏玩法。

**具体需求**：
- 基本攻击技能
- 技能冷却和消耗
- 技能效果和动画

### 2.8 迷雾系统

**功能描述**：游戏世界中存在迷雾，增加探索元素。

**具体需求**：
- 迷雾覆盖未探索区域
- 角色探索后迷雾消除
- 迷雾效果和动画

## 3. 用户角色

| 角色 | 权限 | 职责 |
|------|------|------|
| 玩家 | 控制角色、收集物品、使用技能、与环境交互 | 体验游戏核心玩法 |
| NPC | 自动搜索、收集物品、与其他NPC交互、与玩家交互 | 丰富游戏世界，提供动态元素 |

## 4. 界面设计

### 4.1 游戏主界面

**布局**：
- 游戏画布：占据整个屏幕
- 角色指示器：显示角色状态和控制状态
- 小地图：显示游戏世界缩略图，位于屏幕右上角
- 虚拟摇杆：在移动设备上显示，位于屏幕左下角
- 菜单按钮：位于屏幕左上角，提供场景切换功能

**风格**：
- 像素艺术风格
- 简洁明了的界面元素
- 与游戏主题一致的色彩方案
- 响应式设计，适应不同屏幕尺寸

### 4.2 操作流程

1. 游戏启动，加载主场景
2. 玩家通过键盘、鼠标或虚拟摇杆控制角色移动
3. 玩家通过鼠标点击选择角色
4. 玩家通过右键点击设置移动目标点
5. 角色自动移动到目标点
6. 角色接近物品时自动收集
7. 玩家打开背包查看和使用物品
8. NPC自动搜索和收集物品
9. 玩家使用技能与环境或NPC交互

## 5. 技术需求

### 5.1 技术栈

- **游戏引擎**：Phaser.js (v3+)
- **开发语言**：JavaScript (ES6+)
- **模块系统**：ES6 Modules
- **物理引擎**：Phaser内置Arcade物理引擎
- **渲染技术**：WebGL/Canvas (自动选择)

### 5.2 性能要求

- 游戏在主流设备上运行流畅（60fps）
- 资源加载时间控制在3秒以内
- 内存占用合理，避免内存泄漏
- 支持至少50个单位同时在场景中活动

### 5.3 兼容性

- 支持主流浏览器（Chrome、Firefox、Safari、Edge）
- 响应式设计，适应不同屏幕尺寸
- 支持键盘、鼠标和触摸输入
- 支持桌面和移动设备

## 6. 核心流程

```mermaid
graph TD
    A[游戏启动] --> B[加载配置和资源]
    B --> C[初始化游戏场景]
    C --> D[生成游戏世界]
    D --> E[生成玩家角色]
    D --> F[生成NPC]
    D --> G[生成物品]
    E --> H[玩家控制角色]
    H --> I[移动角色]
    H --> J[选择角色]
    J --> K[设置移动目标]
    K --> I
    I --> L[收集物品]
    L --> M[管理背包]
    F --> N[NPC自动行为]
    N --> O[搜索物品]
    O --> P[移动到物品]
    P --> Q[收集物品]
    Q --> O
    H --> R[使用技能]
    R --> S[技能效果]
    H --> T[打开菜单]
    T --> U[切换场景]
```

## 7. 功能优先级

| 功能 | 优先级 | 描述 |
|------|--------|------|
| 玩家移动控制 | P0 | 核心功能，必须实现 |
| 物品系统 | P1 | 基本的物品收集和背包功能 |
| NPC系统 | P1 | 基本的NPC行为和交互 |
| 游戏世界 | P1 | 基本的游戏地图和碰撞检测 |
| 基本UI | P2 | 简单的游戏界面和菜单 |
| 多语言支持 | P2 | 国际化支持 |
| 技能系统 | P3 | 增强游戏玩法 |
| 迷雾系统 | P3 | 增加探索元素 |

## 8. 验收标准

1. **玩家控制**：玩家能够通过键盘、鼠标和虚拟摇杆控制角色移动，移动平滑自然。
2. **物品系统**：游戏世界中随机生成物品，角色能够接近并收集物品，物品正确添加到背包。
3. **NPC系统**：NPC能够自动搜索和收集物品，具有基本的AI行为，与玩家和其他NPC正确交互。
4. **游戏世界**：游戏世界包含基本的地形和物理碰撞，角色与环境能够正确交互，相机跟随和小地图正常工作。
5. **基本UI**：游戏界面显示角色状态和基本信息，菜单和背包界面正常工作，操作简单直观。
6. **多语言支持**：游戏能够切换不同语言，文本正确显示。
7. **技能系统**：角色能够使用技能，技能效果和动画正常显示。
8. **迷雾系统**：游戏世界中存在迷雾，角色探索后迷雾消除。
9. **性能**：游戏在主流设备上运行流畅，资源加载时间合理，内存占用稳定。
10. **兼容性**：游戏在主流浏览器上能够正常运行，适应不同屏幕尺寸和输入设备。

## 9. 风险与依赖

### 9.1 风险

- **技术风险**：Phaser.js版本更新可能带来兼容性问题。
- **性能风险**：在低配置设备上可能运行不流畅，特别是当场景中单位数量较多时。
- **扩展性风险**：代码架构需要支持后续功能扩展，避免技术债务。
- **跨设备风险**：不同设备和浏览器的兼容性问题。

### 9.2 依赖

- **Phaser.js**：游戏引擎核心依赖，版本3+。
- **浏览器**：需要支持ES6+和WebGL/Canvas。
- **硬件**：需要足够的CPU和GPU性能以支持游戏运行。

## 10. 版本规划

### V1.0（MVP）
- 实现核心玩家控制功能（键盘、鼠标、虚拟摇杆）
- 实现基本的物品收集系统和背包管理
- 实现简单的NPC行为（搜索、收集）
- 搭建基本的游戏世界（地图、碰撞）
- 提供简单的游戏界面和菜单

### V1.1
- 扩展物品系统，增加更多物品类型和属性
- 增强NPC行为，添加更多状态和交互
- 实现多语言支持
- 优化游戏性能和用户体验

### V1.2
- 添加技能系统，实现基本攻击和特殊技能
- 实现迷雾系统，增加探索元素
- 添加更多游戏场景和关卡
- 增强UI和视觉效果

### V1.3
- 实现更复杂的游戏机制（如合成、建造）
- 添加更多角色类型和职业
- 实现游戏存档和加载功能
- 优化多人游戏支持

## 11. 附录

### 11.1 名词定义

- **Phaser.js**：一款流行的HTML5游戏框架，用于创建2D游戏。
- **Arcade物理引擎**：Phaser内置的轻量级物理引擎，用于处理游戏中的碰撞和物理效果。
- **NPC**：非玩家角色，由游戏AI控制的角色。
- **MVP**：最小可行产品，包含核心功能的初始版本。
- **ES6+**：ECMAScript 6及以上版本的JavaScript标准。
- **WebGL**：一种基于OpenGL ES的Web图形API，用于在浏览器中渲染3D图形。

### 11.2 参考资料

- Phaser.js官方文档：https://phaser.io/docs
- JavaScript ES6+语法参考：https://developer.mozilla.org/en-US/docs/Web/JavaScript
- HTML5 Canvas API：https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API
- WebGL API：https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API

### 11.3 资源说明

- **图像资源**：位于`assets/`目录，包含角色、物品、UI等图像。
- **音频资源**：位于`assets/Sounds/`目录，包含游戏音效。
- **配置文件**：位于`config/`目录，包含游戏配置。
- **场景文件**：位于`scenes/`目录，包含游戏场景和测试场景。
- **系统文件**：位于`systems/`目录，包含输入、选择、命令等系统。
- **UI文件**：位于`ui/`目录，包含虚拟摇杆、小地图等UI组件。
- **对象文件**：位于`objects/`目录，包含单位、物品等游戏对象。
- **语言文件**：位于`lang/`目录，包含多语言支持文件。