株式会社イロコト株式会社イロコト

Blogイロコトのブログ

  1. Home
  2. Blog
  3. Figma大好きデザイナーが選ぶ神プラグイン7選&ショートカットキー

Figma大好きデザイナーが選ぶ神プラグイン7選&ショートカットキー

2025.02.28
  • デザイン

はじめまして〜!今回ブログを担当させていただくデザイナーのなつき∞です!

 

入社してから早5ヶ月。まさか入社前に読んでいたイロコトのブログを自分が任せていただける日が来るなんて....!!念願が叶い、とても嬉しいです...!!!泣

 

今回お届けするのは、社内で1番Figmaをマスターしている(自称)Figmerな私が、『60種類以上のプラグインを試した中から厳選した、実際の現場で大活躍したおすすめプラグイン7選』をご紹介!!さらに、経験者でも意外と知らない..?マニアックなショートカット8選』や『Figmaでそんなことも出来るの!?プチ裏ワザ』などもご紹介いたします!

 

それでは、張り切って書いていきますので、ぜひ最後まで読んでいただけると嬉しいです!どうぞよろしくお願いします〜!!

 

01 キャンバス全体を一目で把握できる

Mini Map Pro

キャンバス内にミニマップが表示され、全体像を一目で把握できるプラグインです。

 

Figmaでプロジェクト数が多い案件や大きなファイルやを扱うと、目的のアートボードやコンポーネントを探すのが大変ですよね....(私もよく行方不明になりがちで、その度にちまちま探す旅に出かけていました)しかし、このプラグインを使用すれば、迷うことなくスムーズに移動でき、ズームやスクロールの手間を減らせるため、作業効率を爆上げ間違いなしです!

 

 

02 長体や平体がパス化なしで作成できる

Stretch — by ‹div›RIOTS

作成に時間がかかりがちな長体や平体ですが、このプラグインを使用すると一瞬で作成ができます。(見つけたとき、あまりの革命的さにテンション爆上がりでした。)

 

また、このプラグインの最大の推しポイントは 「文字の修正ができること」 です。

 

今までは文字を一度パス化してから調整し、文言修正があれば再度作り直し....という手間がかかってしまいましたが、このプラグインを活用すればそんな作業の手間とおさらばです!

 

 

 

03 Photoshopのように幅広い写真加工ができる機能

photopea

Photoshopに搭載されている機能と同様に、幅広い画像編集ができるプラグインです。ぼかし編集や簡単な背景の削除(単色背景など)、フィルター調整、色の細かい補正など、基本的な画像編集が可能です。

 

Photoshopはファイルサイズが大きく、作業中にフリーズすることが多々あります.....。また、FigmaからPhotoshopのファイルを開く手間も懸念点でしたが、このプラグインを使えば、Figmaファイル内で全て完結できるため、とてもおすすめです。

 

ただし、被写体の自動切り抜きツールは搭載されていないため、Photoshopほどの高精度な編集はできないめ、状況に応じて使い分けることをおすすめします!

 

 

04 一瞬で表を作成できる

Table Creator

通常、Figmaで表を作るには手動でグリッドを作成し、セルを配置する必要があるため大幅な作業時間が取られてしまいます...しかし、このプラグインを使えばワンクリックで表のレイアウトを自動生成が出来るので、個人的にとても便利で愛用しています!

 

 

05 テキストや図形をかんたんに斜めにできる

Skew360°

テキストや図形を簡単に縦方向や横方向に斜めにすることができるプラグインです。

 

斜体に対応していないフォントでも元のテキストを維持したまま斜めに変更することが出来る部分や適用した後でも文字の修正ができる部分が私の推しポイントです。

 

 

06 テキストを自由にカーブさせる

To Path

テキストをパス(曲線や円など)に沿って配置できるプラグインです。Figmaの標準機能ではテキストを自由な形に沿わせることができませんが、このプラグインを使えば一瞬で簡単に作成することが出来ます。

 

しかし、適用すると文字がパス化されてしまい、後から文字を修正・変更はできないので注意です....!

 

 

 

07 色々な波形デザインを作成できる

Get wavs

簡単に色々な波形デザインを作成できるプラグインです。自分でペンツールなどを使用して作成したり、イラストACなどの素材サイトから探していると意外と時間がかかってしまいますよね....

そんな時にわずか10秒で作成できてしまうのがこのプラグイン!

 

また、ギザギザした形や凹凸の形など幅広い波形デザインが作成でき、幅感などもお好みで調節できるところも推しポイントです!

 

 

08 マニアックなショートカット8選

ここからは、経験者の中でもあまり知られていない&Figmaオタクな私がたまたま見つけてしまったマニアックなショートカットを8選お届けいたします!

 

デザインの世界では0.1秒でもはやく作業し、効率よく作業を行うことが大切です。だからこそ、ショートカットを味方につけて、作業スピードを爆速にしましょう!ぜひ活用していただけると嬉しいです〜!

 

・最後に使用したプラグインを呼び出す:⌥ + ⌘ + P
・すべてのレイヤーを折りたたむ:⌥ + L
・要素を10pxずつ移動:shift + 矢印キー
・すべてのロックを解除する:⌘ + ⌥ + shift + L
・親レイヤーを選択:shift + enter
・メニューを開く:⌘+ /
・レイヤーの名前を変更:⌘+ R
・ファイル内のすべての要素を選択:⌘+ + shift + A

 

おまけ ちょっとした裏ワザ大公開

 

①オートレイアウトの中に吸い込まれない方法

オートレイアウトが組み込まれている部分の上に要素を配置したいけど、中に吸い込まれて配置ができない......そんなお悩みございませんか?

実は、コントロールキーを押しながら、要素を動かすとに吸い込まれずに配置出来ます!

 

 

②素材探しに行く旅は必要なし!放射線の作り方

例:円のサイズが100pxの場合
①横幅と高さが100pxの円を作成
②線の太さを100pxに設定
③線の位置を「内側」に
④線スタイルを「破線」に
⑤破線の数値を好みの幅に変更
⑥完成!

 

 

③一瞬で余白を均等にする方法

外の縁(青色の部分)をダブルクリクックすると、一瞬で均等に余白を揃えてくれます。

 

 

最後に

ここまでFigmaに関する情報をお届けいたしましが、いかがでしたでしょうか?

 

Figmaは使いやすさを追求し、頻繁にアップデートがされていることや、近年注目度が高くユーザー数の増加に伴い、さまざまなプラグインが開発されていることも大きな魅力の一つです。また、最新のプラグイン情報を得るには、X(旧Twitter)で探すことが1番オススメですよ〜!

 

最後に、ここまで読んでいただきありがとうございました!もし参考になったものがあれば、嬉しいです..!!イロコトのブログでは、他にもFigmaのプラグインをご紹介している記事デザインに関するデザイン分科会などの記事も多数掲載していますので、ぜひそちらもご覧ください〜!

 

また、このブログが役に立ったな〜面白かったな〜と感じてくださった心優しいお方がいらっしゃいましたら、ぜひシェアしていただけると嬉しいです!!(本人が大変爆喜びいたします)機会があれば、ぜひまた登場したいと思いますので、どうぞよろしくお願いいたします!!

 

Contact

案件のご相談や、弊社についてのご質問など、
お気軽にご連絡くださいませ。

お問い合わせ