おすすめFigmaプラグインを紹介してみる

執筆

isogai

カテゴリー

Design

テキスト

投稿日

Jan 17, 2023

こんにちは。デザイナーのいそがいです。

突然ですがFigmaを使っている方に向けて、私のおすすめプラグインを勝手に紹介してみようと思います 🎉

今回はシーン別にそれぞれ3つずつご紹介します。

実際には紹介しきれないほど便利で素敵なプラグインが溢れていますので、Figma内のCommunityからぜひぜひ検索してみてください ✨

これやりたいな〜は大抵誰かも思っていて、さらにはプラグインも作られている！という素敵な世界線です。

1. Paginate

ページ番号を自動で採番してくれる便利プラグインです！

ページ番号のコンポーネントを作成し、そのインスタンスを各ページに配置してプラグインを実行するだけでいい感じにページ番号を振ってくれます。

ページの順番を入れ替えたりしても、ページ番号をいちいち修正する必要もなく再度プラグインを実行するだけ！便利ですねー！

Figma

Figma Community plugin - Add page numbers to frames and update them easily! If you've ever wanted to use Figma for print design, or just export frames to a PDF, you might also have looked for a way to add page numbers. Look no further!

https://www.figma.com/community/plugin/805217025770129636/Paginate

2. Unsplash

発表スライドなどを作成していると、いい感じの写真が欲しくなることってよくありませんか？

Unsplashはプロの写真家たちが撮影した写真のライブラリなので、質の高い写真をぱっと検索して見つけることができます。

写真のクオリティ一つでページの完成度のイメージも左右されると思うので、ぜひぜひおしゃれな写真でおしゃれなスライドを作ってみてください ✨

Figma

Figma Community plugin - Insert beautiful images from Unsplash straight into your designs. The Unsplash License allows images to be used freely for both commercial and personal projects. Learn more about Unsplash at https://unsplash.com/about

https://www.figma.com/community/plugin/738454987945972471/Unsplash

3. Blobs

ちょっとスライドを可愛くしたいときに、なんかふわふわしたいい感じの図形を作りたい時ありませんか？ありますよね！！（私はめちゃくちゃあります）

そんなときにこのプラグイン。個人的にめちゃめちゃ重宝しています。

ふわふわした図形を生成できるプラグインなのですが、形の調整も行えるので自分好みの図形が作れちゃいます 😙

Figma

Figma Community plugin - Create organic blob shapes with the click of a button. Every shape that is generated is unique to the last. You can control how unique a shape is along with how many points it has. Shapes are created using SVG, so you get those oh-so-sweet bézier curves.

https://www.figma.com/community/plugin/739208439270091369/Blobs

4. Iconify

UIデザインをしているとき、ここにいい感じのアイコン置きたい…となったらこのプラグイン。様々なライブラリで公開されているアイコンを一挙に検索、使用することができます。

引用元のサイト情報なども分かるようになっているので、実際に開発で使用するとなった場合にもいろいろと確認するのに便利です。

Figma

Figma Community plugin - Import Material Design Icons, FontAwesome, Jam Icons, EmojiOne, Twitter Emoji and many other icons (more than 100 icon sets containing over 100,000 icons) to Figma document as vector shapes.

https://www.figma.com/community/plugin/735098390272716381/Iconify

5. Autoflow

ワイヤーフレームを作成しているときに、画面遷移を可視化したり分かりやすくしたいときに便利なプラグインです。

プラグインを起動して矢印で繋ぎたいフレームを選択すると、道中の障害物を避けながらいい感じに矢印を引っ張ってくれる優れものです！

さらにプラグイン起動中であれば一度矢印をつないだフレームを動かしても、矢印がちゃんと付いてくるので感動します 🥲 ✨

Figma

Figma Community plugin - Autoflow makes it easy to draw flows. Simply select 2 objects and a line will be magically drawn between them. Run AutoflowSelect any 2 shapes whille holding down ⇧SHIFT and a line will be drawnKeep selecting until you're all wired up!

https://www.figma.com/community/plugin/733902567457592893/Autoflow

6. Google Sheets Sync

UIデザインをしていると、商品のリストだったりユーザーのリストだったり、何かとリストを作ることもよくあると思います。

実際に流し込まれるであろうテキスト情報が表示できれば、「サンプル」や「ここに文字」などが羅列しているより実物に近い形でデザインを検討できると思いますが、リストひとつひとつのテキストを編集するのは大変…

そんなときにこのプラグインを使えば簡単に流し込みたいテキスト情報をコンポーネントに反映することができます！

Figma

Figma Community plugin - Sync content from Google Sheets directly into your Figma file. This is not an official plugin created by Google * It is simply created with ❤️ by David Williames If you want to support the continued development of this plugin, why not buy me a coffee at: buymeacoffee.com/davew STEP 1: Make sur...

https://www.figma.com/community/plugin/735770583268406934/Google-Sheets-Sync

おわりに

いかがでしたでしょうか？

今回はシーン別にそれぞれ3つおすすめのプラグインをご紹介しました。

こんなことしたいんだけど良いプラグイン知らない？このプラグイン使いたいんだけど使い方が分からない、などなどあればいつでも気軽にお声がけください〜〜 ☀️ ✨

目次

Figmaを使って資料作成！

Webデザイン作成！

1. Paginate

2. Unsplash

3. Blobs

4. Iconify

5. Autoflow

6. Google Sheets Sync

おわりに

Want to know more about what we do? Check out the articles below!

Fusic News

Fusicってなんしようと？

Fusic Tech Blog

fusic.fm