Figma初体验

当今 UI 设计软件: Sketch、Adobe XD、即时设计

插一条新闻，2022 年 9 月 15 日，美国软件公司宣布以约 200 亿美元收购 Figma，好好好，打不过就收购是吧

别说这么多，快来用用看(搓手)，开始切图🔨，作为初次体验，先来切一个 Apple Store 页面

等等，可能需要一些前置工作，以获得切图的最佳体验，由于方便性，直接使用网页版操作

• 安装字体插件（以获得系统自带的所有字体，桌面版软件可忽略）
• 选择性安装中文字体浏览器插件 (figma 中文社区)
• 安装 avatar 头像生成插件

学习到的点：

• 基础：点击一个组件，右侧可以查看和调整尺寸、字体等信息，多选可以按住 shift+点击需要选中元素
• 添加辅助线： 左上角 Figma 图标 -> view -> Rulers（shift + R），然后屏幕出现了像素标尺，从最左边或者最上面拖动- 可以分别显示垂直和水平辅助线
• 显示组件距离：选中一个组件后，按住 Alt，鼠标移动到其它组件，可以查看相对位置
• 快速复制：选中一个组件后按住 Alt，鼠标按住该元素拖动，就可以复制该组件
• 插件使用: 右键 -> plugins -> 点击插件名称 -> 等待响应
• 使用蒙版实现遮罩：复制一个底部组件，将上面的组件和该组件归为一个组（选中后右键 -> Group selection(ctrl + G)），然后将右键该组内底部组件 -> use as mask(ctrl + alt + M)，即可完成蒙版设置，超出底部组件部分将不会显示（熟悉 PS 的同学都知道，蒙版这个功能超级强大，如何使用 PS 蒙版）

one hour later...

使用感受：第一次上手，感觉还不错，如果对熟悉使用 PS 等软件的人更加方便，因为之前没使用过其它类似软件的缘故，所以也不好比较他们之间的差异，不过大众选择出来的产品，一定有它独特的优势

后续我将持续学习 Figma，尝试更高级的功能和炫酷的效果

相关链接： 酸梅干超人的电话亭