欢迎光临散文网 会员登陆 & 注册

Figma技巧超全合集!40+隐藏技能!快收藏!(第二辑)

2022-02-16 11:34 作者:静电的UI设计教室  | 我要投稿

静电说:上周我们为大家带来了Figma技巧超全合集的第一辑,今天,第二辑来啦!记得全部收藏再看哈。要看第一辑的小伙伴请点击这个链接:Figma技巧超全合集!40+隐藏技能!快收藏!(第一辑)


需要注意:Windows 中 Cmd 为 Ctrl,Option 为 Alt


21.Drag + Space

有时候我们可能需要移动框架内的嵌套元素。这样它们就无法在框架中看到(剪辑内容问题)。但是在这些情况下,我们想要移出的元素也超出了框架。为了防止这种情况,我们可以在拖动嵌套元素时按空格键。同样,如果您将外部元素拖到框架上并且不想将其包含在框架中,则必须按空格键。


图片



22.Alt-显示元素距离

alt 键用于查找一个元素到另一个元素的距离。选择元素后,按 alt 键并将光标拖到另一个元素上。这样就可以完美的显示出元素距离。


图片



23.Shift + 2-缩放到选择

选择一个元素。然后,您可以使用 Shift 和 2(缩放到选择)的组合放大所选元素。

图片



24.Shift + 1-缩放以适应

缩放以显示画布上的所有元素。


图片



25.Z+鼠标选区

按Z键在画布上选择一个区域。使用此组合键,您可以放大所选区域。此外,Option + Z + 矩形区域是缩小区域的组合键。

图片



26.Cmd + Y

将画布视图转换为轮廓。它对于查看我们看不到的框架中的元素非常有效。

图片



27.Cmd + 触控板(鼠标)

您可以通过使用鼠标或触摸板上下移动来放大缩小画布(在 Mac 上用两根手指)。

图片



28.Option + 触控板(鼠标)

输入中的数字、颜色等可以如上例那样使用。您可以通过在鼠标和触摸板上左右移动手指来更改输入值(在 Mac 上使用两个手指)。


图片



29.边框技巧

例如,边框可以用作矩形工具的分隔线。但是由于矩形是一个单独的元素,自动布局可能会很麻烦。在这里有一些诀窍:选择要添加边框的元素。从右侧面板的“效果”部分添加“内阴影”。赋予 Blur: 0、Spread: 0、X:0 和 Y:10 值后,元素下方会出现 10px 边框。您可以通过更改 Y 值来增加边框厚度。最后,您可以选择颜色和不透明度并最终确定您的边框设计(您可以通过创建名为“边框”的样式来将此效果用于其他元素)。


图片



30.查看框架层次结构

我们可以使用 Cmd 键快速选择框架中的元素。但是如果框架中有很多嵌套元素,就变得难以选择。因此,如果您在选择框架后用 Cmd 键单击鼠标右键,则可以看到框架层次结构。您可以选择框架中的任何元素。


图片



31.批量选择技巧

我们可以使用Components,就是元件。如果我们需要改变颜色,形状等等,只需要改变这个这个元件的设定,那么使用这个元件的其它内容都会发生变化。


图片



32.CMD+E

将形状转化为矢量。此快捷方式在设计图标和插图时很有用。


图片



33.快速切换左侧面板选项卡

左侧面板有两个选项卡;图层和资产。您可以使用Option + 1(图层)、Option + 2(资产)组合键在这些选项卡之间切换。


图片



34.快速切换右侧面板选项卡

右侧面板也有快捷方式。您可以使用Option + 8(设计)、Option + 9(原型)、Option + 0(检查)组合在选项卡之间切换。


图片



35.N键

如果我们在画布上按 N 键,它会按顺序选择帧。如果你一直按 N 键,它会继续在帧之间切换。如果您使用 Shift + N 组合键执行此操作,它会反向移动。


图片


36.Tab键

Tab 键有很多功能。在这个例子中;如果在选择框架时按 Tab 键,它将逐个浏览框架中的元素。


图片



37.Enter(返回)

Enter键是另一个具有许多功能的键,如tab键。如果在选择框架时按 Enter 键;它选择框架(子层)中的第一个嵌套元素。


如果你一直按回车,它会继续移动内部元素。同样,您可以使用Shift + Enter键移动到层次结构的上层。


图片



38.Cmd 调整框架大小

当你想调整一个框架的大小时,它会根据它的约束属性来调整大小。默认情况下,框架左上对齐。但是,如果您不希望这样,请尝试按 Cmd 键调整大小。


图片



39.复制图像

如果您想使用网上浏览的任何图像。您可以复制图像链接并将其直接粘贴到 Figma 中,而无需下载图像。


图片



40.Shift+X

这是一个非常酷的功能。选择元素时交换笔触颜色和填充颜色的快捷方式。


图片


41.Shift + Cmd + O轮廓描边。框架中必须有一个元素才能使用此快捷方式。然后试试这个组合键。因此,在左侧面板中,您将看到一个名为“(Stroke)”的新元素,您还可以将轮廓笔触应用于所选元素。例如,您可以使用此示例来关注按钮和类似元素。

图片



42.Shift + Cmd + O我们可以从右侧面板中为组件添加关键字。这样,我们可以在左侧面板的 assets 部分按关键字搜索并找到该组件。

图片


2022开春新一期UI全链路就业特训课程开始报名啦

↓↓长按二维码加静电老师咨询↓↓ 


Figma技巧超全合集!40+隐藏技能!快收藏!(第二辑)的评论 (共 条)

分享到微博请遵守国家法律