Figmaのプラグインのインストール方法と使い方

今回はFigmaでプラグインをインストールする方法と使い方を解説します。あわせて、当サイトで紹介している便利なプラグインと使い方を解説したプラグイン集もまとめていますので、参考にしてみてください。

この記事のターゲット

• Figmaの初心者〜中級者

• Figmaのプラグインの使い方が知りたい方

• Figmaのプラグインを自分で探してみたい方

1. Figmaのプラグインとは何なのか？

Figmaのプラグインとは、Figma内でデザイン制作する際に利用できる拡張機能の総称です。

Figmaで最初から提供されていない機能（例えば、波線パスを作る機能など）をデベロッパーやユーザーが自分で作ってコミュニティに公開しています。

プラグインの作成に興味がある方は、公式の開発者用ドキュメント（英語）に情報がありますので、参考にしてみてください。

2. Figmaのプラグインが見つかる場所

Figma Communityという、Figmaで公開されているファイルやプラグイン、クリエイターが検索できるコミュニティページがあります。

このページのヘッダー（黒い帯の部分）にある検索ボックスの「Search Community」に探したいプラグインやキーワードを英語で入力すると、ヒットした検索結果から探すことができます。

また、このページをスクロールしていくと出てくる「EXPLORE」というセクションの「Plugin」を開くと、プラグインのリストが表示されます。

リストでは、インストール数や最終更新日でソートができるので、インストール数ランキングや最新の更新順から気になるプラグインを探すのに便利です。

プラグイン名をクリックすると、プラグインのページに移動できます。リストの右側にある「Install」ボタンをクリックすると、その場でインストールすることもできます。

3. 見つけたプラグインをインストールする

プラグインのページに移動して、右上にある「Install」をクリックすると、自動でインストールされます。

Figmaのアプリやブラウザで開いていても、上のインストールボタンを押して「Installed」になればその時点から利用できるようになります。ファイルのダウンロードや設定ウィザードもありません。

インストールすること自体は、どんなプラグインも無料で導入可能です。

インストール後に、プラグインの提供元のサイトでアカウントを作成し、無料ライセンスまたは有料ライセンスを作成しなければ使用できないプラグインもあります。

ですが、多くのプラグインはそのまま無料で利用することができます。ありがたい。

逆に、不要なプラグインは、同じように「Installed」をクリックすると、アンインストールされます。更新されなくなってプラグインが使えなくなることもありますので、適切に管理していきましょう。

4. インストールしたプラグインを使用する

今回は例として「Unsplash 」の使い方を紹介します。

使い方は次の通りです。

1. ファイルの何もないところを右クリック

2. 右クリックメニューの「Plugin」を選択してプラグインのリストを表示する

3. プラグインのリストから「Unsplash」をクリック

4. 出てきたポップアップウィンドウで使いたい画像を検索する

5. 適用したいオブジェクトを選択して、適用したい画像をクリック

   1. 画像をインポートしたい場合は、何も選択せずにクリックします

このプラグインは、クオリティの高い写真素材をインポートしたり、複数のアートボードにまとめてランダムな画像を配置するなど、レイアウトを検証するためのカンプデータが必要な時に便利なプラグインです。

Unsplashのウェブサイトに行かなくても、Figma上で直接画像を検索したり、特定のカテゴリ（例えば「動物」など）の画像からランダムにカンプデータを生成することができるので、大変便利です。

他のプラグインを使用する流れも同じです。ポップアップウィンドウにプラグインごとのメニューが表示されますので、使いながら覚えていきましょう。

プラグインの使い方がわかったところで、当サイトおすすめのプラグインを紹介したいと思います。

記事形式で使い方と導入方法を詳細にまとめていますので、参考にしてみてください！

▼ 画像の背景を透過するプラグイン

Figmaで写真やイラストの背景を簡単に切り抜き・透過する方法

今回は、Figmaで画像から背景を簡単に切り抜いてくれるプラグイン「Remove BG」の紹介です。画像を組み合わせてコラージュ画像を作りたい時や、写真から人物を抜き出したい時などに便利なプラグインです。 ... 続きを読む

▼ PCやスマホのモックアップに画像をはめ込むプラグイン

Figmaで簡単にスマホやPCのモックアップに画像をはめ込む方法

今回は、Figmaのプラグイン「Mockup」を使って、スマートフォンやPCなどのデバイスの画面に、スクリーンショットなどの画像を簡単にはめ込む方法を紹介します。 はめ込みたいデバイスの画面が斜めになっている場合でも対応できますので、サービス紹介用の素材作りにおすすめです。 ... 続きを読む

▼ 波線のパスを生成するプラグイン

Figmaで簡単に波線・ジグザグのパスを作る方法

今回は、イラレでよく使われているような波線のパスを、Figmaで簡単に再現する方法の紹介です。おまけで、シンプルなジグザグのパスを作る方法も最後に載せています。 ... 続きを読む

▼ 砂嵐などのノイズ画像を生成するプラグイン

Figmaの「Noise」でざらざらした質感を表現する方法

今回は、ざらざらした紙のようなマットな質感を、Figmaの「Noise」というノイズ画像を生成してくれるプラグインを使って表現してみようと思います。フリー素材を探してもなかなかいいテクスチャが見つからない時などに、試してみてください。 ... 続きを読む

▼ よく使われる定番プラグイン集

UIデザインの作業を加速するFigmaプラグイン10選

今回は、WebサービスやアプリのUI/UXのデザインFigmaを利用する中で、冗長な作業を効率化する上で特に便利だったプラグインを厳選して紹介したいと思います。プラグインの使い方が知りたい方は、プラグインの探し方とインストール方法も紹介していますので、参考にしてください。 ... 続きを読む