figma 安装插件_生活中需要的7个Figma插件

本文介绍了生活中提高设计工作流程的七个Figma插件,帮助设计师增强其在Figma中的功能,提升工作效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

figma 安装插件

Originally published at marcandrew.me on September 24th, 2020.

最初于2020年9月24日marcandrew.me发布

There’s no denying that Figma is already a powerful, and versatile design tool out-of-the-box.

无可否认,Figma已经是一个功能强大,功能多样的开箱即用的设计工具。

It continues to improve with each new release and has rightly claimed its place in the ‘Big 3 Design Tools Club’ (the others being Sketch & Adobe XD of course).

随着每个新版本的发布,它都在不断改进,并正确地在“三大设计工具俱乐部”中占有一席之地(其他人当然是Sketch和Adobe XD)。

But, up until around a year ago, Figma was at a disadvantage against a tool such as Sketch.

但是,直到大约一年前,Figma还是不适合Sketch等工具。

Why?

为什么?

Plugins.

插件。

Of course that’s no longer the case and the Plugin community for Figma is thriving, with more, and more powerful, and invaluable plugins being added daily.

当然,情况已不再如此,并且Figma的插件社区正在蓬勃发展,每天都会添加越来越多,功能更强大且无价的插件。

In this article I wanted to share a few of the plugins that I use on a regular basis, and that have helped me not only improve the designs I create, but have also helped speed up my workflow considerably. And I’m sure they’ll do the same for you.

在本文中,我想分享一些我经常使用的插件,这些插件不仅帮助我改进了我创建的设计,而且还极大地加快了我的工作流程。 而且我敢肯定,他们会为您做同样的事情。

Let’s get to it…

让我们开始吧...

脸红 (Blush)

An assortment of character illustrations, with the word ‘blush’ behind them.

This is quite possibly my favourite plugin for Figma and is brought to you by the talented Pablo Stanley and his team of top-notch Illustrators.

这很可能是我最喜欢的Figma插件,由才华横溢的Pablo Stanley和他的顶尖插图画家团队带来。

I’ve struggled in the past finding Illustrations for my UIs, with quality illustrations a little lacking and scattered far and wide across the information super-highway. Just so much hassle to find a really good set of illustrations.

过去,我一直在为自己的用户界面找到插图,但由于缺少高质量的插图,并且在信息高速公路上四处分散,所以我一直很努力。 找到一组非常好的插图非常麻烦。

That was until Blush came along.

直到Blush出现。

Now I can simply fire up the Blush plugin in Figma, choose from a great array of Artists, and Collections, configure the Illustrations to my liking and drop them straight into my project.

现在,我可以简单地启动Figma中的Blush插件,从各种各样的ArtistsCollections中进行选择,根据自己的喜好配置插图,然后将它们直接放入我的项目中。

Highly recommended, and ridiculously useful that it hurts.

强烈建议使用,而且非常有用,它很痛。

Grab Blush Plugin here

在这里抢腮红插件

Unsplash(Unsplash)

A selection of photos with the word ‘Unsplash’ appearing over the top of them

I’ve been using Unsplash since forever, and still continue to do so. Why? Because the quality of the imagery on there is just so darn-good and it’s Free to use for both Commercial, and Personal projects.

我一直以来都在使用Unsplash,并且仍然会继续这样做。 为什么? 因为那里的图像质量真是太好了,并且可以免费用于商业和个人项目。

The Unsplash plugin is simple, works great, and does what it needs to do with no fancy unneeded fluff.

Unsplash插件很简单,效果很好,并且不需要花哨的绒毛就能完成所需的工作。

No more manually downloading and inserting images into Figma. Yup. Guilty of this in the past.

不再需要手动下载图像并将其插入到Figma中。 对。 过去曾犯此罪。

Having access to the entire Unsplash image library inside of Figma is just immense and saves so much time when you’re wanting to add that perfect shot to your designs.

可以访问Figma内部的整个Unsplash图像库,这是非常巨大的,并且可以在您希望将完美的照片添加到设计中时节省大量时间。

Grab Unsplash Plugin here

在这里获取Unsplash插件

组件克隆(Component Cloner)

A selection of screenshots, and the UI of a plugin in Figma

I must admit when I first came from Sketch and started testing out this new design tool labelled Figma, one of things that took me by surprise was the way in which Figma handles making copies of a Main Component.

我必须承认,当我第一次来自Sketch并开始测试这个名为Figma的新设计工具时,令我感到惊讶的是Figma处理主要组件副本的方式。

In Sketch (where Components are called Symbols) you could simply duplicate an existing Symbol and try out different iterations. Perfect for when you’re wanting to play around with the design of a Symbol but don’t want to delete the original just in case. We’ve all been there right?

在Sketch(组件称为Symbols )中,您可以简单地复制一个现有Symbol并尝试不同的迭代。 当您想要尝试使用符号设计但又不想为了防万一而删除原始符号时,它是完美的选择。 我们都去过那里吗?

In Figma attempting a similar process with Components does things a little differently whereby it doesn’t create a clone of the main component but an Instance, which is, well, a little frustrating, and not as refined as the way Sketch likes to do things.

在Figma中,尝试使用Components进行类似的处理会有所不同,即它不会创建主要组件的克隆,而是创建Instance,这很令人沮丧,并且不如Sketch喜欢做事的方式精致。

Thankfully the Component Cloner plugin came along.

幸运的是,Component Cloner插件也出现了。

With this plugin you can easily make a clone of an existing Main Component and try out different design iterations (which I find myself doing a lot when working on a large Design System in Figma), and all without the worry of making those pesky Instances when you don’t really want to.

使用此插件,您可以轻松地克隆现有的主要组件,并尝试不同的设计迭代(当我在Figma的大型设计系统上工作时,我发现自己做了很多事情),而无需担心在创建这些讨厌的实例时你真的不想要。

Grab Component Cloner Plugin here

在这里获取组件克隆插件

重命名(Rename It)

A selection of Layer examples inside of Figma with the words ‘Rename It’ next to them

Oh boy this plugin continues to rock!

哎呀,这个插件继续流行!

I’ve been using this lil’ bundle of plugin joy since it was first introduced for Sketch, and continue to do so inside of Figma.

自从它最初为Sketch引入以来,我就一直在使用这个小小的插件喜悦包,并继续在Figma内使用。

When you’re working with large design files Rename It really can save you so much time when it comes to the potentially mundane tasks of renaming multiple Layers and Frames.

当您使用大型设计文件时,重命名确实可以为您节省大量时间,这涉及到重命名多个“层”和“框架”的可能平凡的任务。

It really has come into its own when I’ve been working with large-scale Design Systems and decided at the last minute to change the name of a Component and then realised its been used in multiple places with the old name.

当我使用大型设计系统并在最后一刻决定更改组件的名称,然后意识到它已在多个地方使用旧名称的时候,它确实已经发挥了作用。

No problem.

没问题。

With Rename It I can quickly find my Component with the old naming and update it in record time.

使用重命名,我可以使用旧的命名快速找到我的组件,并在记录时间内对其进行更新。

This plugin is so feature-rich and has saved me so, so much time compared to when I use to make all these kinds of changes manually.

与我用来手动进行所有此类更改的时间相比,此插件功能丰富,为我节省了很多时间。

Such a time-saver of a Plugin, and one I use time, and time again.

这样的插件节省了时间,我用了一次,然后又一次使用。

Grab Rename It Plugin here

抢这里重命名插件

批处理样式器(Batch Styler)

Examples of a plugins UI in Figma, with the words ‘Batch Styler’ next to it

Ok. So you’re starting a new project, and want to change multiple Text Styles at once, from Roboto to Open Sans?

好。 因此,您要开始一个新项目,并想一次将多个文本样式从Roboto更改为Open Sans

You can do this in Figma right?

您可以在Figma中这样做吗?

Erm. Nope! Currently Figma only allows you to manually update one Style at a time. Yeah it sucks I know.

恩不! 目前,Figma仅允许您一次手动更新一种样式。 是的,我知道这很烂。

So it’s a good thing that the Batch Styler plugin was brought into our lives.

因此,将Batch Styler插件带入我们的生活是一件好事。

With this super-handy plugin you change multiple text styles all at once, keeping all font weights and other stylings intact, and say “Adios” to all that manual silliness.

使用此超级方便的插件,您可以一次更改多种文本样式,保持所有字体粗细和其他样式不变,并对所有手动提示说“ Adios”

A superb plugin that makes up for Figma’s lack of Text Style handling currently.

一个出色的插件,弥补了Figma当前缺乏文本样式处理的问题。

Grab Batch Styler Plugin here

在这里获取Batch Styler插件

LilGrid(LilGrid)

A selection of Components in Figma; One set is show disorganised, and other set is neatly organised

When working with 100s of Components in Figma, which I do quite frequently, having something that can tidy up the mess that you leave behind on your Main Components page at the end of a project is absolutely critical.

当我经常在Figma中处理数百个组件时,在项目结束时拥有一些可以整理您在Main Components页面上留下的混乱的东西绝对至关重要。

Say “Hello” to LilGrid.

对LilGrid说“你好”

LilGrid takes elements on your page, such as 100s of Icons inside of your Design System, and can, with the press of a button arrange them into a grid automatically.

LilGrid可以将页面上的元素(例如设计系统中的100个图标)作为元素,并且只需按一下按钮就可以将它们自动排列到网格中。

Before this plugin arrived I was tidying everything up on my Main Components page manually. What a time-leech that was!

在该插件到来之前,我正在手动整理“主要组件”页面上的所有内容。 那真是一个时间le!

Like the plugins I covered earlier, LilGrid just does one simple job, but does it well, and saves you so much time when working on larger projects.

就像我之前介绍的插件一样,LilGrid只是完成了一项简单的工作,但是做得很好,并且在处理大型项目时为您节省了很多时间。

Grab LilGrid Plugin here

在这里获取LilGrid插件

UI面(UI Faces)

Some examples of a plugin’s UI, with the words ‘UI Faces’ next to it

Ah good ol’ Avatars to use in your design mockups. We’ve all used them, and if you’re like me you’ve probably downloaded them manually from X, Y, and Z sites in the past right?

好的,可以在您的设计模型中使用的化身。 我们都使用过它们,如果您像我一样,您过去可能已经从X,Y和Z站点手动下载了,对吗?

Well no more. Not now UI Faces is available as a Figma Plugin.

好吧,不再。 现在,UI Faces不能作为Figma插件使用。

I’ve used this plugin for a few years now, and it’s just one of those cant live without plugins that’s permanently installed inside of Figma.

我已经使用了几年了,这只是没有永久安装在Figma内部的插件而无法生存的其中之一。

UI Faces aggregates thousands of avatars which you can carefully filter to suit your requirements by age, gender, emotion, and more.

UI Faces聚合了数千个化身,您可以对其进行仔细筛选,以根据年龄,性别,情感等进行选择。

Choosing avatars in Figma doesn’t get any easier than this.

在Figma中选择化身并没有比这容易得多。

So simple. So invaluable.

很简单。 如此无价。

Grab UI Faces Plugin here

在此处获取UI Faces插件

By the way I’ve used all of the Plugins mentioned here when creating my own Design System Kit; Cabana for Figma. Special Offer: Please use the code CABANA30 to receive 30% OFF. ENDING SOON!

顺便说一下,在创建自己的设计系统工具包时,我已经使用了这里提到的所有插件。 Figma的小屋特别优惠:请使用代码CABANA30享受30%的折扣。 即将结束!

Image for post
Bay Area Black Designers: a professional development community for Black people who are digital designers and researchers in the San Francisco Bay Area. By joining together in community, members share inspiration, connection, peer mentorship, professional development, resources, feedback, support, and resilience. Silence against systemic racism is not an option. Build the design community you believe in. 海湾地区黑人设计师:一个专业的黑人开发社区,他们是旧金山湾区的数字设计师和研究人员。 通过在社区中团结起来,成员可以共享灵感,联系,同伴指导,专业发展,资源,反馈,支持和韧性。 对系统性种族主义保持沉默是不可行的。 建立您相信的设计社区。

翻译自: https://uxdesign.cc/7-figma-plugins-that-you-need-in-your-life-f1c849ae899d

figma 安装插件

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值