webデザイナーがリアルに使用する
Figmaプラグイン4選

こんにちは!ZEROBASE制作部デザイナーのチナツです😇
webデザインの現場では、効率的に作業を進めるためのツールが欠かせません。その中でも、Figmaはデザインプロセスを大幅に改善する強力なプラットフォームとして多くのデザイナーに支持されています。
今回は、実際のプロジェクトで役立つFigmaプラグインを厳選して4つご紹介します。これらのプラグインを活用することで、デザインのクオリティの向上や作業効率アップが実感できるはずです!それでは、さっそく見ていきましょう!

目次

1.プラグインの使用方法
2.Iconify – アイコンの検索挿入
3.Japanese Font Picker – 日本語フォントを試しながら選択可能
4.Blush – カスタム自由自在!イラスト素材
5.Skew – オブジェクトを傾ける
6.まとめ

1. プラグインの使用方法

1.ツールバーの「リソース」をクリックし、「プラグイン」を選択
2.検索窓から希望のプラグインを検索
3.「実行」をクリック

しおりマークから保存が可能です。
保存をしておくと「保存済み」に一覧表示されるので、次回使用するときに便利です。

2. Iconify

Iconifyは、Figma上で簡単にアイコンを検索、挿入することができるプラグインです。アイコンはベクター形式なので、挿入後でもカラー変更やリサイズができとても便利です。
見出しやお問い合わせフォームなどにちょっとしたアクセントを付けたい時にぴったりです!個人的に一番使用頻度が高いプラグインです。

 

1.検索窓に希望のアイコンを入力して検索 ※英語のみの対応なので注意
2.希望のアイコンを選択
3.任意のカラーやサイズを設定
4.インポート

参考リンク Iconify

 

3. Japanese Font Picker

Japanese Font Pickerは、Figmaで日本語フォントを試しながら選択できるプラグインです。
通常Figmaでは、フォントを選ぶ際に表示されるタブには英語表記だけで、日本語だとどのようなフォントデザインになるのかが分かりづらいですが、フォントを選ぶ前にテキストのプレビューができ、実際のデザインに合わせて確認することが可能です。
webサイトのタイトルの見出しや、本文テキストのフォントを選ぶ際によく使用しています。

 

1.フォントを変更したいテキストを選択
2.「Japanese Font Picker」を立ち上げる
3.フォントを選択

同じ要領で英文字にも使える「Better Font Picker」もおすすめですよ!

参考リンク Japanese Font Picker

4. Blush

Blushは、イラストの素材を挿入できるプラグインです。ポップなデザインが特徴で、多様なスタイルやテーマのイラストが揃っており、簡単にクリエイティブなイラストを取り入れることができます。色、サイズ、パーツを自由にカスタマイズできるので、独自のスタイルを反映できます。また多くのイラストが商用利用可能で、プロジェクトに安心して使用できることもメリットです。
個人的にとても好きなプラグインです!今回のタイトルバナーもこちらのプラグインを使用して制作しました!

1.「Collections」から好みのテーマを選ぶ
2.挿入したいイラストを選択
3.パターンをカスタマイズしてオリジナルのイラストを作成できます

一部イラストや機能は有料となっていますが、無料版でも十分楽しめるプラグインです!

参考リンク Blush

5. Skew

皆さんは使用したいフォントに斜体がなく困った経験はありませんか?Skewは、図形やテキストなど、オブジェクトを簡単に傾けることのできるプラグインです。
直感的な操作で、変更を即座にキャンバス上で確認できるため使い勝手の良いプラグインです。簡単にデザインにアクセントをつけることができます。

1.変形したいオブジェクトを選択します
2.ドットをスライドし、好みの傾きを調整します

参考リンク Skew

 

6. まとめ

今回紹介した「Webデザイナーがリアルに使用するFigmaプラグイン4選」は、どれもデザインプロセスを効率化し、クリエイティビティを引き出すための強力なツールです。これらのプラグインを活用することで、作業時間の短縮やデザインのクオリティ向上が期待できるでしょう。ぜひ実際のプロジェクトに取り入れて、あなたのデザインワークをさらに洗練させてください。次回も役立つ情報をお届けしますので、お楽しみに!