見出し画像

プロダクトデザイナーがオススメするFigmaプラグインまとめ

こんにちは。Sansanでプロダクトデザイナーをしているごあんです。
最近、チームでより快適にFigmaを運用するためにあれこれ整備を進めています。その1つとして、各メンバーがよく使うプラグインを共有し合い、

💡 より多くのメンバーが使っている
💡 業務効率がアップする(弊社の場合)
  ex) 仕様検討やデザインパターンの量産など

といった視点で、簡単な概要や「新入社員に対するオススメ度」を付けて管理しているものがあります。これには、新しいメンバーを迎え入れた際のオンボーディングで活用したいという意図もあるのですが、今回はその一部をご紹介できればと思います!


オススメ度:★★★

Content Reel

ダミーの写真やアイコン、テキストを一気に設定することができます。Sansanは名刺を扱うので、氏名や住所、役職など、様々なデータを一気に設定したいシーンが多々あります。そんな時、あらかじめダミー素材を登録しておくことで、都度自分で打ち込む必要なくパターンの量産などが可能です。

Find and Replace

さまざまなプロパティに基づいて類似したレイヤーを選択できます。「このコンポーネントどこで使ってたっけ?」「この色どこかで使ってなかったっけ?」という時にとても便利です。

Redlines

各要素のサイズをワンクリックで記載することができます。(動きはSketch measureに似ているかも。)作成したデザインをエンジニアさんに共有する時などによく利用しています。

Better Font Picker

フォントの見た目をプレビューしながら探すことができます。実際にプロダクト上で複数のフォントを利用するシーンは少ないですが、資料やバナー作成などの際に便利です。

Pitchdeck Presentation Studio

Figmaで作成したデザインを簡単にPDFやPowerPointへ書き出すことができます。資料など、Figmaでぱぱっと作って共有したい時に便利です!


オススメ度:★★

Autoflow

Figma上で簡単にフローを描くことができます。弊社では画面遷移図やフロー図を描く際に使うことが多かったのですが、2021年5月現在は、Figjamに乗り換えているメンバーも増えてきています。

Similayar

様々なプロパティに基づいてレイヤーを検索することができます。複雑なレイヤー構造の画面から、特定のプロパティを持つレイヤーをすべて選択して一気に変更することなども可能になるため、作業効率もアップします。

Design Lint

デザインのエラーを見つけて修正してくれます。間違ったスタイルが適用されている箇所などを教えてくれるので、きちんとガイドラインに沿ったデザインを作成するうえでとても便利です。

Rename it

複数のレイヤーやフレームの名前を一括で変更できます。作業中、汚くなりがちなレイヤー名などをきれいに整える際に役に立ちます。

Product Planner

マーケティングフレームワークなどのテンプレート集です。ブレストやジャーニーマップ作成など様々なテンプレートが揃っており、プロダクトの検討段階などで使っています。


オススメ度:★

Contrast

WCAGに則ったコントラスト比がチェックできます。

iconify

マテリアルデザインなどのアイコンセットです。

Google Sheets Sync

Googleスプレッドシートで作成したデータを、Figmaに直接反映できます。ただし、スプレッドシートのデータを「公開」に設定する必要があるため、業務での利用には注意が必要です。


ということで、弊社のプロダクトデザイナーがよく使っているオススメプラグイン紹介でした! (是非みなさんのオススメも教えてください😍)


------------------------------------------------------------------------

Sansanではプロダクトデザイナーを募集中です!
Figmaが大好きな方も使ったことがないよという方も大歓迎なので、ぜひお気軽にご連絡ください!


この記事が気に入ったらサポートをしてみませんか?