Codex use case
从想法到概念验证
使用 ImageGen 从视觉层面探索概念,并实现您想法的初版。
Difficulty 中级
Time horizon 1 小时
结合使用 Codex 和 ImageGen,将粗略想法转化为视觉方向,实现最小可用原型,并在浏览器中验证该原型。
最适合
- 需要通过可运行原型而非书面计划来解答更多问题的早期产品想法。
- 实现前需要进行视觉探索的 Web 应用、仪表板和工具。
- 希望在进一步投入资源前通过可运行原型验证产品想法的团队。
Contents
从想法到概念验证
使用 ImageGen 从视觉层面探索概念,并实现您想法的初版。
结合使用 Codex 和 ImageGen,将粗略想法转化为视觉方向,实现最小可用原型,并在浏览器中验证该原型。
中级
1 小时
技能与插件
- ImageGen在 Codex 实现选定的视觉方向之前,先使用 `gpt-image-2` 生成视觉概念、UI 视觉稿、素材方向和变体。
- 在真实浏览器中打开正在运行的应用,检查发生更改的路由,并在进入下一轮迭代前验证每项细微的 UI 调整。
- 针对新的 Web 应用、仪表板、站点和前端原型,采用概念优先工作流,然后在浏览器中验证实现结果。
- 当概念验证项目是浏览器游戏,且需要可玩循环、资源工作流、HUD、引擎选型和一轮试玩测试时,请使用 Game Studio。
| Skill | Why use it |
|---|---|
| ImageGen | 在 Codex 实现选定的视觉方向之前,先使用 `gpt-image-2` 生成视觉概念、UI 视觉稿、素材方向和变体。 |
| Playwright | 在真实浏览器中打开正在运行的应用,检查发生更改的路由,并在进入下一轮迭代前验证每项细微的 UI 调整。 |
| Build Web Apps | 针对新的 Web 应用、仪表板、站点和前端原型,采用概念优先工作流,然后在浏览器中验证实现结果。 |
| Game Studio | 当概念验证项目是浏览器游戏,且需要可玩循环、资源工作流、HUD、引擎选型和一轮试玩测试时,请使用 Game Studio。 |
入门提示
使用 ImageGen 为以下想法生成高质量 UI 视觉稿,然后使用 [Build Web Apps plugin/Game studio plugin] 实现该视觉稿:
[describe the idea, target user, and the main workflow]
使用 ImageGen 为以下想法生成高质量 UI 视觉稿,然后使用 [Build Web Apps plugin/Game studio plugin] 实现该视觉稿:
[describe the idea, target user, and the main workflow]
从视觉方向入手
GPT Image 2 擅长生成高质量 UI 视觉稿。探索新想法时,您无需从零开始,可以利用图像生成来确定视觉方向。
可以通过两种方式做到这一点:
- 使用 ImageGen 技能反复调整视觉方向。对生成的 UI 方案满意后,您可以要求 Codex 构建与视觉稿一致的原型。在这种情况下,请选择 Codex,开始新对话,并附上您最终要实现的图像,而不是直接在 ChatGPT 对话中继续。Codex 能参考用户附件时,效果会更好。
- 使用插件时,您只需描述自己的想法:插件会为您生成视觉方向并处理后续步骤。
使用插件
如果您在开始实现前无需反复调整视觉方向,就可以使用插件并描述自己的想法。
使用 Build Web Apps 插件 来构建 Web 应用、仪表板、创意网站和侧重前端的工具。其 工作流会引导 Codex 先生成设计,再用代码还原设计,并使用 浏览器将结果与概念方案进行比较。
请使用 Game Studio 插件 来构建浏览器游戏的概念验证。该流程应在扩展游戏前明确玩家可执行的 动作、首个可玩循环、引擎、资源工作流、HUD、控制方式,并完成浏览器 测试。
迭代工作流
良好的概念验证应聚焦于可快速实现并由团队验证的 MVP。 如果您想确保 MVP 按预期运行,可以使用 Playwright interactive,让 Codex 验证其工作成果。
初版运行起来后,您可以在同一聊天中提出范围明确的更改要求,继续迭代:
添加新的 [feature/bug fix/etc.]。使用 Playwright interactive 验证您的更改。
需要应用的反馈:
[paste comments, screenshots, or review notes]