English
主导航
Codex

Codex 用例

创建基于浏览器的游戏

制定游戏方案,让 Codex 在真实浏览器中构建并测试它。

难度 中级
时间周期 长时间运行

使用 Codex 将游戏简介转化为明确定义的方案,进而构建真正的浏览器游戏。使用 imagegen 生成视觉素材,并让 Codex 在真实浏览器中测试游戏,迭代控制方式和 UI。

适用场景

  • 从零开始构建浏览器游戏
  • 控制、视觉和部署均需反复测试与调整的游戏构建

目录

    ← 所有用例

    创建基于浏览器的游戏

    制定游戏方案,让 Codex 在真实浏览器中构建并测试它。

    使用 Codex 将游戏简介转化为明确定义的方案,进而构建真正的浏览器游戏。使用 imagegen 生成视觉素材,并让 Codex 在真实浏览器中测试游戏,迭代控制方式和 UI。

    中级
    长时间运行

    使用 Codex 将游戏简介转化为明确定义的方案,进而构建真正的浏览器游戏。使用 imagegen 生成视觉素材,并让 Codex 在真实浏览器中测试游戏,迭代控制方式和 UI。

    中级
    长时间运行

    适用场景

    • 从零开始构建浏览器游戏
    • 控制、视觉和部署均需反复测试与调整的游戏构建

    技能与插件

    • 在真实浏览器中试玩游戏,检查当前状态,并针对实际构建版本迭代调整控制、时机和 UI 手感。
    • ImageGen
      生成概念图、精灵图、背景和 UI 素材,并保持提示词可复用,以便后续批量生成素材。
    • 在将 OpenAI 驱动的功能接入游戏之前,拉取最新的官方指南。
    技能 为什么使用它
    Playwright 在真实浏览器中试玩游戏,检查当前状态,并针对实际构建版本迭代调整控制、时机和 UI 手感。
    ImageGen 生成概念图、精灵图、背景和 UI 素材,并保持提示词可复用,以便后续批量生成素材。
    OpenAI 文档 在将 OpenAI 驱动的功能接入游戏之前,拉取最新的官方指南。

    起始提示词

    使用 $playwright-interactive、$imagegen 和 $openai-docs 在此代码库中规划并构建浏览器游戏。实现 PLAN.md,并将工作日志记录到 `.logs/` 下。
    使用 $playwright-interactive、$imagegen 和 $openai-docs 在此代码库中规划并构建浏览器游戏。实现 PLAN.md,并将工作日志记录到 `.logs/` 下。

    简介

    构建游戏最能体现 Codex 不仅限于代码生成。一款真正的游戏通常需要文字概念、渲染层、前端外壳工作、后端状态、素材制作以及持续的视觉调整

    当 Codex 首先准确写下游戏应具备的功能,然后使用 Playwright 交互模式在真实浏览器中测试游戏并进行迭代时,此用例的效果最佳。

    从游戏方案开始

    在 Codex 搭建任何内容之前,要求它创建一个 PLAN.md 以具体术语定义该游戏:

    • the player goal
    • the main loop
    • 输入与控制方式
    • 胜负条件
    • 进度或难度递增
    • 视觉方向
    • 技术栈与托管假设
    • the milestone order

    该方案至关重要,因为仅靠“构建一个游戏”太过宽泛。Codex 需要知道如何实现游戏的每个部分,并在构建过程中经常参考这些实现细节。

    你可以使用 /plan 斜杠命令来激活计划模式。将输出保存到 PLAN.md file.

    通过 AGENTS.md 指导 Codex 的行为

    为确保 Codex 遵循方案、验证其工作并使用正确的工具,请定义一个 AGENTS.md 如下所示:

    # Game name
    
    <Type of game>
    
    Tech Stack:
    
    - NextJS for frontend (hosted on Vercel)
    - <insert technology> for rendering
    - Fastify for backend, websockets (hosted on <hosting platform>)
    - Postgres for database (hosted on <hosting platform>)
    - Redis for caching and pub/sub (hosted on <hosting platform>)
    - OpenAI for generative AI features
    
    Tips:
    
    - Use build and test commands to verify your work as soon as you complete a feature or task
    - Use the PLAN.md file to guide your work when building new features
    - Log your work under .logs (create new log files as you see fit) to record your thought process and decisions, and reference them when iterating on features
    - Use playwright to test the visual output of your work, and iterate if it doesn't look right or fit the vibe
    - Use imagegen to generate visual assets for your work, and every time you generate a collection of assets, save the prompts you used to be able to continue generating more of the same assets later (create files in .prompts)
    - Use Context7 MCP to fetch <rendering framework> docs

    这使得 Codex 能够长时间独立运行,并根据需要调用相关技能。

    利用技能

    添加 AGENTS.md 文件中提及的技能:

    • Imagegen,以便 Codex 能够根据需要为游戏生成视觉素材
    • Playwright interactive,以便 Codex 能够在实时浏览器中测试游戏
    • OpenAI docs,以便 Codex 能够获取最新的 OpenAI API 文档
    • 或者,你可以添加 Context7 MCP 服务器来获取渲染框架的最新文档

    了解更多关于如何添加技能的信息,请参阅 技能文档.

    提示: 要求 Codex 将图像生成的提示词保存在文件中,以确保所有视觉素材保持一致。提供关于你期望生成素材风格的指导,让 Codex 生成详细的、可复用的提示词。

    让 Codex 工作并迭代

    Codex 将根据初始计划生成游戏的第一版。

    如果有大量图像素材需要生成,第一版可能会花费一些时间,有时甚至需要数小时。由于 Codex 可以在实时浏览器中测试其工作并试玩游戏,它可以长时间运行而无需任何输入。

    计划越明确,第一次迭代后的最终输出效果就越好。

    在测试时,可以根据需要通过提供屏幕截图、要求更改游戏玩法或更新视觉素材来进行迭代,直到你对结果满意为止。

    技术栈

    需求

    Web 游戏技术栈

    默认选项

    Next.js with Phaser or PixiJS

    为何需要它

    浏览器端游戏 UI 和渲染层的实用默认选择。

    需求

    后端技术栈

    默认选项

    Fastify , WebSockets, Postgres ,且 Redis

    为何需要它

    当游戏需要持久化存储、匹配机制、排行榜或发布/订阅功能时的强大默认选择。

    需求 默认选项 为何需要它
    Web 游戏技术栈 Next.js with Phaser or PixiJS 浏览器端游戏 UI 和渲染层的实用默认选择。
    后端技术栈 Fastify , WebSockets, Postgres ,且 Redis 当游戏需要持久化存储、匹配机制、排行榜或发布/订阅功能时的强大默认选择。

    相关用例