关于 figma-prototype-plan
figma-prototype-plan 是一项围绕用户研究问题规划 Figma 原型的技能。它定义原型范围、交互、测试任务和设置,并区分需要构建与模拟的部分,以控制工作量。
主要功能
- 01按研究目标限定原型范围
- 02规定交互触发方式与目标画面
- 03编写参与者测试任务脚本
- 04指导 Figma 设置与重置
- 05区分实际构建和模拟元素
适用场景
- 01为用户测试规划原型
- 02明确可点击流程与静态画面
- 03准备基于场景的测试任务
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ mohitagw15856/ pm-claude-skills --skill figma-prototype-plan安装后在 Claude Code 中输入/figma-prototype-plan确认已加载。
详细介绍
Figma 原型规划技能
规划要在 Figma 中制作哪些原型以及如何制作——根据用户测试需求确定范围、定义每项交互,并设置测试场景。避免过度构建,确保原型能够回答研究问题。
必需输入
- 研究问题(你想了解什么?)
- 要制作原型的功能或流程
- 原型保真度(低保真线框图 / 中保真功能原型 / 高保真像素级原型)
- 测试方法(主持式现场 / 主持式远程 / 无主持)
- 测试任务数量
输出结构
1. 原型范围
范围内: [包含真实交互的流程——列出具体屏幕] 范围外: [以静态方式展示的屏幕——不值得做成交互式] 理由: 原型应当是测试假设所需的最小方案。
2. 交互规范
交互 N:[描述]
- 触发方式:点击 / 滑动 / 悬停 / 提交表单
- 元素:[Figma 图层名称]
- 目标:[Figma 画板名称]
- 动画:即时 / 溶解 / 向左推入 / 向右推入 / 向上滑入
- 时长:[ms]
- 是否重置:是 / 否
3. 原型流程图
[Start frame]
-> Tap "Action"
[Next frame]
-> Tap "Complete" -> [Success frame]
-> Tap "Cancel" -> [Back to start]
4. 测试任务脚本
任务 N:[标题]
场景(读给参与者听): “[提供背景信息但不指示点击路径的真实场景]”
观察内容:
- [需要观察的内容]
成功条件:[具体触发条件]
5. Figma 设置指南
- 起始画板:[名称]
- 设备预览:[设备]
- 原型设置:背景颜色、显示设备、类型
- 分享:可查看链接、参与者之间的重置流程
6. 构建与模拟表
| 元素 | 构建 | 模拟 | 备注 |
|---|---|---|---|
| 主要 CTA 流程 | 是 | 研究核心 | |
| 次要导航 | 是 | 不在测试范围内 | |
| 错误状态 | 是 | 测试恢复能力 |
质量检查
- 范围仅限研究问题所需的内容
- 每项交互都有指定的目标画板
- 任务脚本基于场景(而非“点击 X”)
- 为每项任务定义成功标准
- 定义参与者之间的重置流程
反模式
- 不要为所有内容都制作原型——范围必须限制在能够回答具体研究问题的交互上
- 不要设计原型流程却不同时编写测试任务脚本——两者必须完全一致
- 不要跳过参与者之间的重置流程——未重置的原型状态会干扰测试结果
- 不要在未说明哪些交互可点击、哪些为静态的情况下规划原型——含糊不清会导致范围蔓延
- 不要在未先明确原型需要回答的研究问题时确定原型范围
示例触发语
- “为我们针对 [功能] 的用户测试规划 Figma 原型”
- “这个原型需要构建哪些交互?”
- “帮我为 [研究问题] 设置 Figma 原型”
- “为我们的 [功能] 原型编写测试任务脚本”
- “哪些内容应该制作成原型,哪些应该保留为静态屏幕?”
评论
支持 Markdown