Figmaとは

Figmaとはブラウザ上で動き、複数の人が同時に作業できる、Webサイトやアプリの画面をデザインするためのツールのことです。

Figmaはアメリカの企業が提供するデザインツールで、ブラウザやデスクトップアプリで使えます。ファイルはクラウドに保存されるため、URLを共有するだけで、デザイナー以外の人もデザインを見たり、コメントを書き込んだりできます。Web制作では、ワイヤーフレームからデザイン、プロトタイプまでをFigmaで作ることが一般的になっています。

主な機能

複数の人が同じファイルを同時に編集できる共同編集の機能があり、チームでの作業や、クライアントとの確認をその場で進められます。ボタンや見出しなどを「コンポーネント」として登録して使い回せるので、デザインシステムの管理にも向いています。画面どうしをつないで動きを確かめるプロトタイプの機能もあります。プラグインと呼ばれる追加機能で作業を効率化できるほか、ホワイトボードとして使える「FigJam」というサービスもあります。

制作の流れの中での役割

Figmaで作ったデザインをもとに、エンジニアがコードを書いたり、Studioなどのノーコードツールで組み立てたりします。色や文字の大きさ、余白の数値を開発する側が直接確かめられるので、デザインと実装のずれを減らせます。デザインの段階で関係者の確認を済ませておけば、組み立てたあとの大きな手戻りも防げます。