Codex use case
将用户故事转化为 UI 设计稿
将产品反馈、议题讨论串和设计上下文转化为可供团队评议并付诸实现的 UI 设计稿。
使用 Codex 从 Slack、Linear 和 Google Drive 收集产品反馈，将其归纳为用户故事和约束，然后使用 ImageGen 生成 UI 设计稿。确定方向后，将设计稿转化为可运行的原型。
最适合
- 需要根据零散反馈确定功能视觉方向的产品团队。
- 希望在构建之前依据原始材料制作设计稿的设计和工程团队。
- 希望根据用户反馈快速迭代的团队。
Contents
将用户故事转化为 UI 设计稿
将产品反馈、议题讨论串和设计上下文转化为可供团队评议并付诸实现的 UI 设计稿。
使用 Codex 从 Slack、Linear 和 Google Drive 收集产品反馈，将其归纳为用户故事和约束，然后使用 ImageGen 生成 UI 设计稿。确定方向后，将设计稿转化为可运行的原型。
使用 Codex 从 Slack、Linear 和 Google Drive 收集产品反馈，将其归纳为用户故事和约束，然后使用 ImageGen 生成 UI 设计稿。确定方向后，将设计稿转化为可运行的原型。
相关链接
最适合
- 需要根据零散反馈确定功能视觉方向的产品团队。
- 希望在构建之前依据原始材料制作设计稿的设计和工程团队。
- 希望根据用户反馈快速迭代的团队。
技能与插件
- 在已获批准的反馈频道和讨论串中搜索用户故事、痛点、用户原话和待解决的问题。
- 将功能请求、错误报告、标签、优先级和项目上下文纳入设计稿说明。
- 读取包含产品反馈或设计要求的研究笔记、通话摘要、文档、电子表格和演示文稿。
- 获取设计上下文、屏幕截图和设计系统参考资料，确保设计稿不偏离产品的视觉语言。
- ImageGen根据整合后的用户故事和设计约束生成 UI 设计稿及其变体，形成视觉基准。
- 将选定的设计稿转化为可运行的 Web 原型，并对照设计稿验证实现结果。
| Skill | Why use it |
|---|---|
| Slack | 在已获批准的反馈频道和讨论串中搜索用户故事、痛点、用户原话和待解决的问题。 |
| Linear | 将功能请求、错误报告、标签、优先级和项目上下文纳入设计稿说明。 |
| Google Drive | 读取包含产品反馈或设计要求的研究笔记、通话摘要、文档、电子表格和演示文稿。 |
| Figma | 获取设计上下文、屏幕截图和设计系统参考资料，确保设计稿不偏离产品的视觉语言。 |
| ImageGen | 根据整合后的用户故事和设计约束生成 UI 设计稿及其变体，形成视觉基准。 |
| Build Web Apps | 将选定的设计稿转化为可运行的 Web 原型，并对照设计稿验证实现结果。 |
入门提示
简介
产品团队通常会从各种来源收集反馈，例如 Slack 讨论串、Linear 议题、Google Drive 文档或电子表格，以及客户通话笔记。有时，他们已有明确的用户故事来说明想要解决的问题；有时，相关上下文则存在于这些来源中。
ChatGPT 可以汇集这些上下文，并为能够解决该问题的功能生成 UI 设计稿。验证设计方向后，Codex 可以在产品中实现该功能。
建立视觉基准
如果您已有明确的用户故事，可以直接从它入手。否则，可以先与 ChatGPT 讨论，从不同来源收集上下文，并将这些信息整合成用户故事。
然后，您可以让 ChatGPT 使用图像生成功能制作几版不同方向的设计稿。这些设计稿应延续产品的信息架构，并遵循设计系统的约束。
如有帮助，您可以提供当前 UI 的屏幕截图或 Figma 文件作为参考。
请反复迭代，直到您对设计稿满意。改动范围界定得越明确，Codex 就越有可能生成可直接实现的设计稿。
从设计稿到原型
使用您希望 Codex 实现的最终版设计稿图像。选择 Codex，开始新对话并重新附加该图像，而不要直接继续当前的 ChatGPT 对话。然后，让 Codex 实现该设计稿，将其转化为可运行的原型；如果您要构建 Web 应用，也可以使用 Build Web Apps 插件：
