Figma 是一个基于浏览器的协作式 UI 设计工具， 从推出至今越来越受到 UI 设计师的青睐，如今也有很多的设计团队投入了Figma 的怀抱。在设计师的原型设计阶段，每个设计师的选择都不同，自从我用了Figma的原型功能以后，感觉Figma的原型功能确实有值得称赞的地方，例如：上手成本低、交互命令丰富等。接下来我会跟大家分享Figma的原型使用。
Figma原型功能优势
市面上交互式的原型工具各有秋千，制作使用方式上也各不相同：非时间性编辑的，也有时间线编辑的，混合的、甚至需要代码制作的，今天就不展开来讲。
1.功能连贯性
比如你在Sketch里面做好页面，需要另外打开这些原型工具去导入再去做动态效果，这无疑是给我们工作制造了非连续性的困难。
2.限制少
Figma和XD，两者都是设计和原型工具。不过XD需要你的账户为非大陆账号，如果你的Adobe当时注册的时候为大陆账号的你是用不了插件等功能的，这一点也比较重要，很多同学下载好后登录自己的Adobe账户发现没有插件功能，不是你下载的软件版本问题，也不是下载的是非阉割正常的版本，只是你的账号问题。Figma在这方面并没有限制。
Figma原型功能介绍
1.设计页面右上角，点击进入原型模式Prototype
2.在选中第一个页面后，原型模式下的编辑菜单，包括：添加开始的流程节点、交互动作、滚动。
3.添加开始的流程节点，可修改名称将节点设置为自己了解的名称；在流程复杂的界面设计中当做一个标记点，自己能够快速找到流程。
4.将第二个画面进行连线，右侧自动出现菜单设置。首先选择触发器。
每个触发器如何工作的请查看以下说明：
On Click
这是最常用的触发器，只有在明确单击（桌面端）或轻击（移动端）对象后才允许执行操作。 打开菜单，导航到另一个页面。
On Drag
这个触发器是新增的，通过长按触发动作，结合使用弹窗等可以模拟实现3D touch效果，
While Hovering
此触发器不需要主动触发对象/热点。相反，用户只需将光标悬停在热点上即可执行操作。 当用户将光标移离热点时，它们将返回到原始框架。
While Pressing
只有在单击鼠标或触控板（在桌面上）或直接按下对象（在移动设备上）时才会显示目标框架。 释放后，用户将再次显示原始框架。
这非常适合模仿临时互动或状态变化；比如通过长按查看预览，或导航下拉菜单。
Mouse Enter
这允许在鼠标移入热点区域时显示目标框架，这类似于 While Hovering Trigger的工作方式; 但与 While Hovering Trigger 不同的是当用户将鼠标移动到热点之外时，用户不会自动返回到原始框架。 这对关闭按钮很有用。
Mouse Leave
当用户的鼠标离开热点区域时，此触发器显示目标框架。 这非常适合模拟屏幕上的提示，例如当字段尚未完成时发出警报或者检查信息。
Mouse Down (Touch Down)
这会在首次按下鼠标时触发目标框架 – 或者对于移动设备，当用户的手指首次触摸原型内的对象时触发。
Mouse Up (Touch Up)
当释放鼠标时触发目标框架 – 或者当用户的手指停止触摸原型内的对象时触发移动设备。
After Delay
延迟触发器基于用户在当前框架上的时间，根据需要设置延迟时间。
这允许你在用户在给定框架上延迟一定时间演示原型或显示屏幕提示。 这可用于模拟聊天消息、通知警报或自动指向其他页面。
5.动作
一旦定义了触发器，就可以确定原型的位置和方式。
触发方式有以下几种
None
当不需要动作时使用它。
导航 Navigate
这是两个框架之间的普通过渡，这是最常见的动作类型。
打开Open Overlay
这将打开当前框架上方的目标框架，这可用于从设计中的弹窗显示、工具提示或警报
替换 Swap
当从普通框架中的热点触发时，替换的行为与导航类似。如果将替换应用于叠加层中的热点，它将使用新的框架替换当前叠加层。 新叠加层将保留与原始叠加设置相同的叠加设置。
提示
使用替换不会将该框架添加到原型的历史记录中。 通过允许你返回上一个屏幕而不是之前的叠加层，使用 Back操作时，这将为你提供更大的灵活性。 如果你希望用户能够使用 Back to Previous Screen 操作在叠加层之间移动，则需要使用 Navigate 选项。
返回Back
这允许你回到进入当前页面之前所在的页面，这非常适合模拟原型中的 Back按钮。（一般返回按钮必用）
关闭叠加Close Overlay
这允许你关闭或关闭原始框架上出现的任何叠加层，这非常适合模拟忽略屏幕提示或警报。
Open Link
这允许你将用户定向到原型之外的 URL，这非常适用于外部链接或主导航中不可用的其他资源。 选择后，你可以在提供的字段中输入 URL：
提示
单击 Open URL热点时，URL将在新选项卡中打开。如果这是指向外部网站的链接，将通知用户他们将离开Figma。
你可以使用提供的复选框使下次打开时跳过此跳转页面：
6.动画
动画相对比较简单：主要是立即进入、溶解、神奇移动、移入移除、滑入滑出。
Figma的原型功能上手相对容易，新手基本半小时就能上手，没有复杂的逻辑，大家可以动手试试！
学习地址
大家想系统学习Figma的使用的话，这里介绍两个宝藏网站，里面有系统丰富的知识，浅显易懂，大家可以看看。
Figmacn,搜集关于Figma的一切。
Figma中文社区
