WorkBuddy + Figma 生成原型图
WorkBuddy + Figma 生成原型图效果：
50%
50%
第一、WorkBuddy生成操作流程：
第1步：打开figma平台，点击右上角功能区【design】（新建设计文件）按钮，打开新的工作空间；
第2步：通过Ctrl+K快捷键或左上角下拉区选择Actions拉起工具面板，搜索html.to.design，找到目标插件并双击打开；
50%
50%
第3步：通过粘贴网页地址或上传文件的方式，生成设计图层页面，包括以下两种常用方式：
📌
方式1：
若属于已上线网页，直接复制网页地址，按照下述步骤上传即可：
1、打开figma design设计文件，右键选择插件，搜索【html.to.design】保存；
2、选择默认类型web，将网页地址粘贴至输入框内，修改页面宽度viewports；
3、点击【import】按钮，等待导入完成；
方式2：
若属于workbuddy生成的html文件，由于其属于文件，故无法使用第一种方式；
1、选择类型file，点击【Browse】按钮上传html文件,修改页面宽度viewports；
2、等待生成完毕（若生成的页面上下左右留白，则点击留白区域，将数值修改为0）；
通过此种方式支持将workbuddy生成的html格式原型，直接转化为设计文件。将原有的html+css+js页面转化为设计图层，UI设计师可进一步进行优化。
第二、Figma生成操作流程：
若直接使用figma make来生成产品原型，可以通过输入提示词的方式来生产原型。
但是想要确保生成高质量原型，需要上传低保真示例图或填写非常详细的提示词，才能确保生产质量，若将时间用于写提示词或画低保真原型，那么整个效率会大大降低。
所以这里有个建议，在使用workbuddy生成产品方案后，可以继续要求其生成产品高保真原型提示词，再粘贴到figma make生成产品原型，这样就可以省略自己写提示词或画低保真原型的环节， 然后再使用copy design功能，将生成的产品原型转化为设计图层文件，设计师可以进一步进行优化。
这里为什么不推荐使用figma来生成产品方案，而是拆分到两个工具，原因在于figma积分价格比较贵且消耗快，以及其属于设计类AI工具，所以要充分发挥各AI工具的优势，来合理分配任务。
第三、人工绘制原型
若选择人工绘制原型，那么可以进一步要求workbuddy生成设计要点，这样便于人工手动绘制原型，也能够提升整体的工作效率。