关于 2d-games
面向使用 Canvas 开发游戏或构建混合 Web 应用的开发者，提供 2D 游戏系统设计指导。内容涵盖精灵、地图、物理、摄像机及常见类型机制。
主要功能
- 01精灵图集与动画
- 02地图图层与自动地形拼接
- 032D 碰撞与固定时间步长
- 04摄像机类型与屏幕震动
- 05平台跳跃与俯视玩法模式
- 06Canvas 生命周期清理
适用场景
- 01规划精灵和地图系统
- 02为平台跳跃加入跳跃宽限
- 03按玩法选择碰撞形状
- 04避免游戏结束后残留监听器
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/2d-games确认已加载。
详细介绍
2D 游戏开发
2D 游戏系统的原则。选择框架时，请结合
game-development/web-games/game-development/engine-selection。
壳层与访客视图（Web）
| 设置 | 2D 系统所在位置…… |
|---|---|
| 全屏 2D 游戏 | 整个应用（Phaser/Kaplay/Pixi/Canvas） |
| DOM 与挑战内容混合 | 仅在访客视口内；完成后拆除 |
1. 精灵系统
| 组件 | 用途 |
|---|---|
| 图集 | 合并纹理，减少绘制调用 |
| 动画 | 帧序列（通常为 8-24 FPS） |
| 轴心点 | 旋转／缩放原点 |
| 分层 | 控制 Z 顺序 |
动画原则
- 用挤压与拉伸表现冲击
- 动作前加入预备动作
- 动作后加入跟随动作
2. 瓦片地图设计
| 因素 | 建议 |
|---|---|
| 尺寸 | 16x16、32x32、64x64 |
| 自动铺砖 | 用于地形 |
| 碰撞 | 简化形状 |
| 图层 | 内容 |
|---|---|
| 背景 | 不可交互的场景 |
| 地形 | 可行走的地面 |
| 道具 | 可交互的物体 |
| 前景 | 视差叠加层 |
3. 2D 物理
| 形状 | 使用场景 |
|---|---|
| 方框 | 矩形物体 |
| 圆形 | 球体、圆形物体 |
| 胶囊体 | 角色 |
| 多边形 | 复杂形状 |
- 根据机制选择一种移动／碰撞模型；像素艺术渲染可以与物理系统并存
- 使用固定时间步以保持一致性
- 使用图层进行筛选
4. 摄像机系统
| 类型 | 用途 |
|---|---|
| 跟随 | 跟踪玩家 |
| 前瞻 | 预判移动 |
| 多目标 | 双人游戏 |
| 房间式 | 类银河战士恶魔城游戏 |
| 静态 | 棋盘游戏、模态技能判定 |
屏幕震动
- 持续时间短（50-200ms）
- 强度逐渐减弱
- 少量使用
5. 类型模式
平台游戏
- 土狼时间（离开边缘后仍可跳跃的宽限时间）
- 跳跃缓冲
- 可变跳跃高度
俯视角
- 8 方向或自由移动
- 基于瞄准或自动瞄准
- 确定旋转是否重要
6. 反模式
| ❌ 不要 | ✅ 应该 |
|---|---|
| 使用分散的纹理 | 使用图集 |
| 使用复杂的碰撞形状 | 简化碰撞形状 |
| 摄像机抖动 | 平滑跟随 |
| 移动与物理控制不协调 | 为每个物体定义一个控制权威 |
| 访客视图关闭后遗留 RAF／监听器 | 完整拆除 |
请记住： 2D 的关键在于清晰。每个像素都应传达信息。
适用场景
适用于 Canvas/Phaser/Kaplay/Pixi 2D 系统，或混合 Web 应用中的访客视口。
示例
用户请求：
为平台游戏加入土狼时间和跳跃缓冲，同时保留固定物理时间步，并测试角落碰撞。
限制
- 仅当任务明确符合上述范围时，才使用此技能。
- 不要将输出视为环境特定验证、测试或专家审查的替代品。
- 如果缺少必要输入、权限、安全边界或成功标准，请暂停并请求澄清。
评论
支持 Markdown