编程

3D游戏构建器免费版

试用

用自然语言生成可玩的浏览器3D小游戏,支持迭代修改与本地预览。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。提供结构化输出和错误处理机制。

它能做什么

用自然语言生成可玩的浏览器3D小游戏,支持迭代修改与本地预览。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。提供结构化输出和错误处理机制。

技能文档

3D 游戏构建器 (免费版)

概述

本工具帮助个人开发者与游戏爱好者用自然语言描述快速生成可玩的浏览器 3D 游戏。只需一句话描述游戏概念,即可获得一个完整的单 HTML 文件,包含 Three.js 渲染、控制、物理、HUD、音效等完整游戏循环。支持迭代修改,用户可持续提出新需求让游戏逐步进化. 免费版聚焦个人创作场景,适合 Game Jam、学习 Three.js、创意原型验证等用途.

核心能力

能力模块描述免费版支持
自然语言生成从描述生成完整游戏支持
单 HTML 输出自包含可分享文件支持
迭代修改持续添加新功能支持
本地预览一键启动本地服务器支持
多游戏类型FPS、RPG、竞速、塔防等基础类型
参考图导入用户上传图片作为参考支持
多人联机实时多人对战不支持 (升级 PRO)
资源托管在线分享链接24小时临时链接
高级图形PBR、SSAO、后处理基础后处理
团队协作多人共同开发不支持 (升级 PRO)

核心功能执行

用input_params参数进行配置.

处理: 解析核心功能执行的输入参数,完成核心逻辑,返回结构化响应. 输出: 返回核心功能执行的响应数据,包含状态码、结果和日志.

  • 执行此能力时使用input_params参数,支持创建/查询/导出操作

参数配置与调用

用config_options参数进行配置.

处理: 解析参数配置与调用的输入参数,完成核心逻辑,返回结构化响应. 输出: 返回参数配置与调用的响应数据,包含状态码、结果和日志.

  • 执行此能力时使用config_options参数,支持修改/重置/导入操作

结果处理与输出

用output_format参数进行配置.

处理: 解析结果处理与输出的输入参数,完成核心逻辑,返回结构化响应. 输出: 返回结果处理与输出的响应数据,包含状态码、结果和日志.

  • 执行此能力时使用output_format参数,支持导出/保存/转换操作 能力覆盖范围：本skill的核心能力覆盖以下场景关键词：用自然语言生成可、玩的浏览器、小游戏、支持迭代修改与本、地预览、面向个人开发者与、游戏爱好者的、浏览器游戏生成工、核心能力、自然语言描述生成、Three、单文件输出、迭代修改、本地预览、适用场景、Game、Jam、快速原型、娱乐小游戏制作、创意展示、差异化、免费版支持单文件、游戏生成与基础迭、适合个人创作者与、原型验证、适用关键词、游戏生成、浏览器游戏、游戏原型、自然语言生成等.

使用场景

场景一: Game Jam 快速原型

在 48 小时 Game Jam 中快速生成可玩原型.

用户: "做一个第一人称射击游戏,玩家在太空站里打外星人"
# ...
助手:
1. 解析需求: FPS + 太空站场景 + 外星敌人
2. 生成单 HTML 文件 (包含):
   - PointerLockControls 第一人称视角
   - 程序化太空站走廊 (金属材质 + 荧光灯)
   - 外星敌人 FSM (巡逻 → 追击 → 攻击)
   - WASD 移动 + 鼠标视角 + 左键射击
   - HUD: 血量、弹药、得分
   - 程序化音效
3. 启动本地服务器预览
4. 提供迭代建议

场景二: 学习 Three.js

通过生成可读代码学习 Three.js 模式.

# 生成一个简单的第三人称游戏
echo "第三人称视角的小猫收集星星的游戏" | game-builder
# ...
# 查看生成的代码
cat /tmp/game-build/index.html | head -100

场景三: 创意展示

把想法快速变成可玩的交互演示.

# 启动本地服务器
bash "${SKILL_DIR}/（请参考skill目录中的脚本文件）" /tmp/game-build
# ...
# 输出: http://localhost:8000

不适用场景

以下场景3D游戏构建器免费版不适合处理：

  • 无明确技术栈的模糊需求
  • 纯架构设计决策
  • 运维部署管理

触发条件

需要代码生成、编程辅助、调试测试、开发部署时使用。不适用于非本工具能力范围的需求.

快速开始

Step 1: 检查环境

# 确保有现代浏览器与 Python (用于本地服务器)
python --version
which python3

Step 2: 生成第一个游戏

# 创建工作目录
mkdir -p /tmp/game-build
# ...
# 示例
echo "一个像素风格的塔防游戏" > /tmp/game-build/request.txt

Step 3: 启动本地预览

# 在游戏目录启动服务器
cd /tmp/game-build
python -m http.server 8000
# ...
# 打开浏览器访问 http://localhost:8000

Step 4: 迭代修改

用户: "把塔的颜色改成霓虹色,增加一种新的激光塔"
# ...
助手:
1. 读取现有 /tmp/game-build/index.html
2. 读取 /tmp/game-build/progress.md 了解当前状态
3. 识别为迭代请求 (修改现有游戏)
4. 使用 Edit 工具针对性修改:
   - 塔材质改为 emissive neon
   - 新增 LaserTower 类
5. 更新 progress.md 迭代历史
6. 刷新浏览器查看效果

响应解析: 完成完成后,查看输出响应确认任务状态。成功时输出包含解析摘要和响应数据;失败时根据错误信息排查问题,查阅错误解析章节获取恢复步骤.

配置示例

游戏生成模板

<!DOCTYPE html>


    
    [游戏标题]

摄像机与控制选择

CAMERA_CONTROL_MAP = {
    "fps": {
        "camera": "PerspectiveCamera + PointerLockControls",
        "controls": "WASD + 鼠标视角 + 左键射击",
    },
    "third_person": {
        "camera": "PerspectiveCamera + 轨道相机",
        "controls": "WASD (相对相机) + 鼠标拖拽 + 点击动作",
    },
    "rpg_overworld": {
        "camera": "PerspectiveCamera + 俯视跟随",
        "controls": "WASD (相对相机) + E 交互",
    },
    "racing": {
        "camera": "PerspectiveCamera + 追逐相机",
        "controls": "WASD 或方向键",
    },
    "tower_defense": {
        "camera": "OrthographicCamera",
        "controls": "点击放置、点击移动",
    },
    "platformer": {
        "camera": "PerspectiveCamera + 侧视跟随",
        "controls": "方向键 + 空格跳跃",
    },
}

进度跟踪模板

# 游戏进度
# ...
## 原始请求
[首次用户描述]
# ...
## 当前状态
[已构建且可工作的部分]
# ...
## 迭代历史
- [日期/序号]: [修改内容]
# ...
## 实体清单
- 玩家: [描述]
- 敌人: [列表]
- NPC: [列表]
# ...
## 已激活系统
- [x] 移动/控制
- [x] 战斗 (实时/回合)
- [ ] 物品栏
- [ ] 对话
# ...
## 已知问题
- [Bug 或待优化项]
# ...
## 建议下一步
- [可添加的新功能]

最佳实践

1. 颜色可见性

避免使用过暗的颜色导致场景不可见.

// 错误: 地面几乎看不见
const floor = new THREE.MeshStandardMaterial({ color: 0x0a0a0a });
// ...
// 正确: 使用中色调
MeshStandardMaterial({ color: 0x4a6a4a }); // 草地
const stone = new THREE.MeshStandardMaterial({ color: 0x666688 }); // 石头
const dirt = new THREE.MeshStandardMaterial({ color: 0x887766 }); // 泥土

2. 第三人称相机移动

第三人称游戏必须让 WASD 相对相机方向移动,而非世界坐标.

// 关键: 相对相机方向移动
function updatePlayer(camera, keys, player) {
    const forward = new THREE.Vector3();
    camera.getWorldDirection(forward);
    forward.y = 0;
    forward.normalize();
// ...
    const right = new THREE.Vector3();
    right.crossVectors(forward, camera.up).normalize();
// ...
    const moveDir = new THREE.Vector3();
    if (keys.w) moveDir.add(forward);
    if (keys.s) moveDir.sub(forward);
    if (keys.a) moveDir.sub(right);
    if (keys.d) moveDir.add(right);
// ...
    moveDir.normalize().multiplyScalar(player.speed);
    player.position.add(moveDir);
}

3. 性能优化

// 使用 InstancedMesh 处理重复对象
const treeGeometry = new THREE.ConeGeometry(0.5, 2, 8);
const treeMaterial = new THREE.MeshStandardMaterial({ color: 0x2d5a27 });
const trees = new THREE.InstancedMesh(treeGeometry, treeMaterial, 500);
scene.add(trees);
// ...
// 对象池减少 GC
const bulletPool = [];
for (let i = 0; i < 100; i++) {
    bulletPool.push(createBullet());
}

4. 程序化音效

使用 Web Audio API 生成音效,无需外部资源.

function playSound(frequency, duration, type = 'sine') {
    const ctx = new AudioContext();
    const osc = ctx.createOscillator();
    const gain = ctx.createGain();
    osc.type = type;
    osc.frequency.value = frequency;
    osc.connect(gain);
    gain.connect(ctx.destination);
    gain.gain.setValueAtTime(0.3, ctx.currentTime);
    gain.gain.exponentialRampToValueAtTime(0.01, ctx.currentTime + duration);
    osc.start();
    osc.stop(ctx.currentTime + duration);
}

常见问题

Q1: 生成的游戏能在手机上玩吗?

支持触控基础,但部分控制方案 (如 PointerLockControls) 仅在桌面端有效。移动端建议使用点击式控制.

Q2: 可以使用外部 3D 模型吗?

免费版聚焦程序化资产 (Three.js 基础几何体组合)。导入 GLTF/FBX 模型需要 PRO 版本.

Q3: 游戏文件多大?

简单游戏 50-200KB,复杂 RPG 可能达到 1-3MB (因为内联了所有代码).

Q4: 分享链接有效期多久?

免费版提供 24 小时临时分享链接。如需永久托管,请升级 PRO 版本.

Q5: 支持哪些游戏类型?

FPS、第三人称动作、RPG、竞速、塔防、平台跳跃、解谜、生存、格斗等主流类型.

依赖说明

运行环境

  • Agent 平台: 支持 SKILL.md 规范的任意 AI Agent (Claude Code、Cursor、Codex、Gemini CLI 等)
  • 操作系统: Windows / macOS / Linux
  • 浏览器: 现代浏览器 (Chrome 90+、Firefox 88+、Safari 14+)
  • 网络: 首次加载需访问 CDN (jsdelivr) 获取 Three.js

依赖详情

依赖项类型是否必需获取方式
Three.js 0.160.0JS 库必需CDN 自动加载
LLM API推理服务必需由 Agent 内置 LLM 提供
Python 3.8+本地服务器可选python.org 下载
现代浏览器运行时必需系统自带

API Key 配置

# 免费版无需额外 API Key
# Three.js 通过 CDN 加载,无需认证
# ...
# 可选: 配置本地服务器端口
export GAME_SERVER_PORT=8000

可用性分类

  • 分类: MD+EXEC (Markdown 指令 + 命令行执行)
  • 说明: 本 Skill 通过自然语言指令驱动 Agent 生成 Three.js 单文件游戏,使用本地服务器预览
  • 免费版限制: 单文件输出、临时分享链接 (24h)、程序化资产、单人开发

错误处理

错误场景原因处理方式
配置错误参数缺失或格式错误检查依赖说明中的配置要求
运行时错误运行环境不满足确认运行环境符合依赖说明
网络错误连接超时或不可达执行ping命令测试网络连通性,检查防火墙和代理设置连接后执行ping命令测试网络连通性,检查防火墙和代理设置连接后重新执行命令，参考国内替代方案

已知限制

  • 当前版本仅支持中文交互
  • 部分高级功能需要额外配置
  • 输出结果需人工审核后使用
  • 不支持离线运行模式

示例

基本用法

输出：返回执行结果,包含操作状态和输出数据

用户: 执行核心功能
Skill: 正在执行核心功能...
Skill: 执行完成,结果如下: 操作成功

输出格式

{
  "success": true,
  "data": {
    "result": "3D游戏构建器免费版处理结果",
    "execution_time": "0.5s",
    "metadata": {
      "version": "1.0",
      "processor": "game builder"
    }
  },
  "execution_log": ["解析输入参数", "执行核心处理", "格式化输出结果"],
  "error": null
}

相关技能

游戏资产生成-免费版

轻量级2D游戏资产生成工具，支持角色设计、精灵图与瓦片集，保持风格一致。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。提供结构化输出和错误处理机制。

3 次安装

游戏开发助手免费版

全流程游戏开发向导,涵盖设计、编码、测试、发布与运营基础。Use when 需要代码生成、编程辅助、调试测试、开发部署时使用。不适用于无明确技术栈的模糊需求。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。提供结构化输出和错误处理机制。

3 次安装

游戏AI工具免费版

游戏AI开发指南,涵盖FSM、行为树、寻路与决策系统的代码实现。Use when 需要代码生成、编程辅助、调试测试、开发部署时使用。不适用于无明确技术栈的模糊需求。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。提供结构化输出和错误处理机制。

3 次安装

浏览器自动化工具-免费版

通过自然语言驱动浏览器交互的CLI工具,支持本地Chrome,适合个人开发者快速自动化。Use when 需要提升效率、自动化流程、批量处理、工作流优化时使用。不适用于需要人工创意判断的任务。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。

HTML设计工具免费版

专业的HTML/CSS网页图形设计助手,提供视觉层级、配色、排版等核心能力,适合个人开发者快速构建精美页面。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互，无需复杂配置即开即用。输出结果可直接使用，减少二次加工成本。

3 次安装