Figma Webデザイン

Figmaで絶対つかうべきプラグイン10選!まずはこれをいれておけば作業効率爆上がり

Figma使いはじめたけど、プラグインがありすぎてどれを使えばいいのかわからない‥

Figmaは無料で使えるデザインツールであることから、プラグインの開発も活発で、

こんな機能があればいいなと思えばだいたいプラグインがあったりしますw

Figmaをまだ始めていないというかたは詳しく説明している記事をご覧ください。

今回はFigma初心者の私が実際にインストールしてよく使っている

作業効率がアップする便利なFigmaプラグインをまとめてご紹介します。

この記事でわかること

プラグインのインストール方法

初心者がまずは使うべきプラグイン10選

本記事でわかること

  • プラグインのインストール方法
  • 初心者がまずは使うべきプラグイン10選

まずダウンロードすべきプラグイン10選は以下の通り

  1. Iconify
  2. Remove BG
  3. Nisa Text Splitter
  4. Unsplash
  5. Image Tracer
  6. uiGradients
  7. Mockuuups Studio
  8. Better Font Picker
  9. Map Maker
  10. Clean Document

プラグインのインストール方法 ”3ステップ”

まずはプラグインのインストール方法3ステップをご紹介します。

ステップ

左サイドバーの「Community」という項目をクリック

ステップ

「Plugins」というタブをクリック
すると、人気順にリスト形式で表示されます。

ステップ3

リストの右側にある「Install」をクリックすると、インストール完了です。
検索窓に入力して探すことも可能です。

※プラグインをインストールしてもプラグイン一覧に出てこない場合は、

開いているデザインファイルを一度閉じてから再度開くと

プラグイン一覧に新しくインストールしたものが出てきます。

おすすめプラグイン10選

Iconify

マテリアルデザイン・アイコンやFontAwesome、絵文字など60を超えるアイコンセット、合計5万個以上の素材をベクターシェイプとして追加できるプラグイン。

全プラグインのなかでも2番目にインストールされているIconify。

使いかたも簡単でプラグインを開いて、検索窓に使いたいアイコンを入力してでてきた候補のなかから好きなのを選んでドラッグするだけです。

Remove BG

写真の背景をワンクリックで消してくれるプラグイン。

複雑な背景だときれいにできないときはありますが、単純な背景であれば一発できれいに切り抜いてくれるので、作業効率UP間違いなし。

Nisa Text Splitter

テキストボックスのなかのテキストを改行位置で分割やソート、結合などをワンクリックで実行できるプラグインです。

長文の原稿をコピペした時や、一つのテキストボックスでメモをとり、後から個別に抜き出したい時など、かなりの頻度で活躍してくれます。

Unsplash

無料素材サイトのUnsplashからそのまま画像を挿入できるプラグインで、Figmaの全プラグインのなかで一番インスールされています。

ダミーで写真を何枚かいれておきたいときもランダムで写真を挿入してくれるので、いろいろな場面で活躍してくれます。

Image Tracer

画像をFigma上でベクターファイルに変換できるプラグイン。

プラグインを実行すると選択されているすべてのレイヤーをひとつに結合し、白黒に変換、ベクターレイヤーにトレース。

uiGradients

Webデザイン向けの美しいグラデーションを選ぶだけで利用できるプラグイン。

グループやテキストボックス、フレームなどに複数のグラデーションを追加することもできるので、きれいなグラデーションをワンクリックで入れたいときはこれです。

Mockuuups Studio

作成したWebデザインデータを簡単にモックアップにしてくれるプラグイン。

いろいろなデザインがあり、有料のものもありますが無料のものでも十分です。

とても簡単にモックアップができてしまうので一度はお試ししてみてください。

Better Font Picker

Figmaの標準機能にはない、フォントのプレビューを表示してくれるプラグイン。

Figmaでフォント探すが大変に感じてましたが、このプラグインを使えば

プレビューを見ながらフォントを選択できるので、探しやすくなりますよ。

Map Maker

Google Map と、MapBox から地図画像を挿入できるプラグイン。

登録せずに使用することができ、Google Mapは日本語で表示もできるので、非常に便利です。

Clean Document

デザインデータを一発で整理してくれるプラグイン

  • 非表示のレイヤーの削除
  • 要素が一つしかないグループ化の解除
  • レイヤーの位置と寸法を整数に
  • レイヤー名前を適切なものにリネーム
  • ページをアルファベット順にソート

使いかたも簡単で「Clean Document」を選択し、

「Clean Layer」をクリックするとポップアップがでてくるので

必要なオプションを選択し 「Clean Layer」をクリックします。

とても簡単にデータの整理ができるので、活躍してくれます。

まとめ

今回は私が実際に使用しているプラグインで、便利でよく使うものをご紹介しました。

ぜひ自分にあったプラグインを見つけて作業効率UPにつなげてください!

また、作業効率UPのためにショートカットキーについて気になるかたはこちらの記事をどうぞ。

https://gomaweb.com/figma-shortcut/

最後まで読んでいただきありがとうございました。

それではまたお会いしましょう!

-Figma, Webデザイン
-, , ,