figma有哪些快速入门的好用技巧

使用Figma在创建设计系统或处理大型设计项目时，总会涉及批量修改.快速定位.自动布局问题，MarcAndrew这篇文章分享了技巧，可以大大提高设计效率，希望对大家有所帮助:

在这篇文章中，我列出了一些快速简单的方法来帮助你更快地使用它Figma制作设计系统。这里分享的大部分技能都非常适合处理设计系统，或者庞大的设计文件和设计项目，当然也适合Figma处理日常设计项目。

​你可能熟悉一些内容，但也可能有一些内容是你从未发现过的宝藏。接下来，让我们开始：

1.批量修改颜色的使用「颜色选择面板」

当你想快速修改多个组件的颜色时，不要一个接一个地选择，所以工作量太大了。此时，最快的方法是选择侧面「颜色选择面板（SelectionColors）」这种方法是直接调用色彩系统中的色彩，可以达到批量修改的目的。

2.这个快捷键可以使图层清晰整洁

图层面板中的文件夹结构可以帮助您更快地找出包含哪些元素，但由于屏幕尺寸的限制，在复杂的设计系统中，由于元素太多，你很难清楚地了解整个系统。

使用最简单的快捷键Alt+L，所有的层都可以折叠起来，这样你就可以更清楚地看到整个系统的全貌，并专注于当前的项目。

3.搜索可以更快地定位文本样式

当你想改变文本风格时，你不需要无休止地滚动图层和选项来找到你需要的文本。此时，使用搜索功能可以帮助您更快地定位到相应的层。

例如，您可以直接搜索H2或者Headline2找到相应的文本层，而不是逐个浏览层面板。特别值得一提的是，当你在搜索时，如果你想搜索，比如Headline37、可直接搜索H37可以找到相应的图层。

使用简短的关键词搜索也能更快地提高编辑内容的效率。

4.使用列表选项更快选择颜色样式

正如我之前所说，尽快调整配色风格和文本风格，以便更快地设计。所以，当你使用它的时候。「色彩指示器（Inspcetor）」在调整颜色选项时，将网格布局改为列表布局，可以更容易地浏览和使用配色风格，更直观。

5.使用键盘快捷键更快地浏览图层

绝大多数用户习惯于通过鼠标滚动和点击图层面板，逐个控制，逐个文件夹，一个接一个地找到，这个效率超低，我也这样做了很长一段时间。然而，鼠标点击的效率远不如键盘快捷键方便快捷。

最快的方法就是使用Tab在图层中快速向下切换选择图层，然后使用车键确认。这种选择比鼠标快很多，但是Tab只能向下滚动选择，如果要向上切换选择，使用，Shift+Tab快捷键就可以了。

6.使用快捷键更换和更新组件

设计系统总是不可避免地涉及到不同时间、不同版本的设计系统分支之间的处理，比如版本V2.更换图标2V2.5.这时，按住。Alt+Cmd按钮，选择需要调整的组件，组件周围会有一层紫色的外界。此时，您可以在不同的版本之间切换和调整，非常快。

7.使用自动布局快速改变组件尺寸

当您设计当前项目的主要组件时，记得隐藏与主要组件无关的部分，并在层管理中保持此，您可以点击图层面板中的小眼睛图标来隐藏它们。同时，这个小图标也可以帮助您根据需要适应组件的大小。（这部分作者没有说清楚，知道学生记得在评论区留言纠正）

8.使用自动布局及时避免文本对齐混乱

在处理设计系统时，排版工作量会很大，会注意到这些文本元素不能像其他现有文本那样整齐一致地排列。此时，不要担心，记住在使用自动布局功能时，首先到文本排版，确定排版对齐规则，然后自动布局功能将遵循这个逻辑自动布局。

9.自动布局缩放异常时，应调整间距设置

在许多使用自动布局的组件中，当你试图调整某些元素的大小时，缩放的大小可能会发生变化。例如，在一个组件中UI在控制中添加标签组件（ChipsComponent），插入似乎很好，但当你想调整标签尺寸时，你会发现它很难控制。此时，在自动布局的设置面板中，尝试切换间距设置中的面板「Packed」和「SpaceBetween」选项，之后应该正常。更多figma内容：https://js.design/special/figma/

结语

我希望这些技能能帮助你，尤其是在处理复杂的设计系统时。这些技巧可以帮助你提高效率，在一定程度上缓解问题。Figma这是一个很好的工具，它有很多有效和省时的技巧，但它们需要你花时间去探索。