進化が止まらない! 最新ツール

Google社内でも利用、2022年使いたいデザインツール世界1位の「Figma」は何がスゴい?

数々の世界的大企業が利用するデザインプラットフォーム「Figma」が2022年に日本進出。夏には日本語版をリリース予定。一体どんなツールなのか?

Web制作で、こんな経験をしたことはないだろうか?

  • デザイナーAが作ったデザインをストレージに置き、メールでチームに共有。デザイナーBやエンジニアは保存されたファイルをダウンロードして作業しなければならないので、タイムロスが生じる。

  • デザインツールで制作したが、他メンバーとのバージョン違いが原因で体裁やフォントがずれ、手戻りが発生した。

  • 非デザイナーはデザインツールのアカウントを持っていないので、メールに画像を貼り付けて確認依頼せざるを得ない。だがイメージが伝わりづらいうえ、操作性も確認できない。

  • デベロッパーやエンジニアへのコード送付は、別のアプリケーションをインストールして行うしかない。

こういった問題を解決できるサービスが、デザインプラットフォームの「Figma(フィグマ)」だ。WebデザインやUIデザイン、グラフィックデザインなどを制作できる。

一体どんなツールなのか? Figma Japanの川延 浩彰(かわのべ ひろあき)氏に話を聞いた。

Figma Japan株式会社 日本カントリーマネージャー・川延 浩彰氏

世界のデザイナーが使いたいツール1位「Figma」

サンフランシスコに本社を置くFigma社は、2016年にツールをリリースした。そこからわずか数年で「Google」や「Microsoft」「Netflix」「Twitter」など、世界的大企業が導入している

世界各地のデザイン関係者約3,000人に聞いた「2022年に最も使いたいツール」のアンケートでは、2位に約6倍もの差をつけ、断トツで期待度の高さを見せつけた。こうした動きに投資家たちも反応し、2021年には企業評価額が100億ドル(約1.1兆円)のデカコーン企業となった

そして2022年3月、アジア圏初となる日本法人を設立。Figma Japan設立にあたり、楽天やリクルート、Yahoo! JAPANなどのデザイン部門責任者が推薦コメントを提供した。試しにWebで検索してみると、LINEクックパッドYahoo!NewsPicksSanSanなどのデザイナーたちも、ブログなどでFigma導入のメリットを自主的に発信している。

なぜ大企業がこぞって導入するのだろう? 川延氏は次のように分析する。

Figmaはソフトをインストールする必要がなく、インターネットにつながるデバイスさえあれば、世界中から同じファイルにアクセスでき、ブラウザ上で共同編集できる。またFigmaのプラットフォームで対応できる領域が広いことにより、ツールの統合も可能である。そういったメリットが大きいのではないか(川延氏)

Figma社の製品は2つ:

  • オンラインホワイトボードツール「FigJam
  • デザインコラボレーションツール「Figma

それぞれのツールについて簡単に紹介しよう。

数百人とでもブレストできるオンラインホワイトボード「FigJam」

たとえば、チームでWebサイトを立ち上げるとする。今までなら、メンバーが会社の会議室に集まって、1人のPCを映写しながら、ホワイトボードに意見を書いたり、付箋をつけたりしてブレインストーミングしていただろう。しかしコロナ禍で対面が難しくなったことから、これらをすべてオンライン上でできる「FigJam」が注目を集めた。

『FigJam』は巨大なオンライン上のホワイトボードです。1つのデザインに対し、同時に数百名で付箋を貼ってコメントを入れたり、『賛成!』の意味でハートなど絵文字をつけたり。図形や線も書き込めるなど、インタラクティブに楽しく議論ができます(川延氏)

FigJamのイメージ動画

他にも、次のような機能がある。

  • カーソルチャット: 数秒で消えるチャット機能。チャットをすべてホワイトボード上に残す必要がない場合に重宝される。
  • オーディオチャット: 音声チャット機能。その場で音声に切り替えられる。
  • メンション: 複数人で入っていても誰がどの部分を見ているのか一目でわかる仕様で、メンバーに「ここを見て!」とメンションをつけて呼ぶこともできる。
  • ワシテープ: 良いアイデアを目立たせることができるデジタルマスキングテープ機能。日本の「和紙」がヒントに。

ブラウザ上で簡単にワイヤーフレーム作成やUIデザインができる​「Figma」

「FigJam」でブレインストーミングをし、アイデアの大枠が決まったら、次は「Figma」を使ってワイヤーフレームを作る。

Figmaではモックアップやプロトタイプの作成もできる

こちらもデザイン作成からCSS書き出しまで、​すべてブラウザ上で完結可能だ。他のデザイナーやエンジニアと意見を出し合いながら共同作業し、​デジタルプロダクトとして世の中に出すレベルまで持っていくことができる。

代表的な機能は次のようなものだ。

  • オートレイアウト: デザインやオブジェクトの中身に応じて余白や配置を自動設定してくれる機能。
  • スマートアニメイト:簡単にアニメーションを追加できる機能。プロトタイプの段階から動きのイメージをチームで共有しやすい。
Figmaのイメージ動画

シンプルな操作性のデザインツールであり、動作が軽い点も支持されている理由だと思います。これまで手戻りを恐れて、分業型で仕事を進めるしかなかったチームも、コラボレーションしながらアジャイルにプロセスを回すことができ、より良い製品を、より早いサイクルで世の中に出せるようになります(川延氏)

Figmaのビジョンは「すべての人がデザインにアクセスできるようにする」。従来、クリエイティブ制作はプロのデザイナーが高度なツールを駆使して、制作を進めていくのが一般的だったが、Figmaユーザーの約3分の2は非デザイナーである。誰でも直感的に操作でき、かつプレゼンの資料作成などにも活用できるため、重宝されているようだ。料金プランは4段階あり、無料版でも多くの機能を利用できる。

日本でイベント開催、すでに熱狂的なファンがいる!

日本初の公式ユーザーイベントTokyo Config Watch Party」が5月11日、都内で開催された。これはFigma社が主催する世界最大級のデザインカンファレンス「Config(コンフィグ)」の中継を一緒に視聴しつつ、ノウハウを共有し合うもの。南極大陸を除くすべての大陸から24カ国をつなぎ、100人のスピーカーが24時間ひっきりなしに登壇した。

参加者とともにサンフランシスコ本社へのメッセージを送る川延氏

今回のイベントは当初、参加者100名をめざして告知を開始したが、クチコミから参加希望が殺到。会場のキャパを広げ、200名規模で開催したという。​

イベントでは、Figmaのプロダクトマネージャー・山下祐樹​氏がいくつかの新機能を公表した。いずれもユーザーレビューで要望の高かった機能とのこと。

サンフランシスコ本社から登壇した山下​氏(中央のモニター)

Figmaのユーザーは時に、公式の先を行く。「欲しい機能がまだFigmaにないなら、自分で作ってしまおう」と、ユーザーが自作したプラグインが無数に用意されているのだ。しかもすべて無償提供である。

実際にプラグイン開発に携わっているユーザーも登壇し、次のような発言をした:

自分の作ったプラグインが公式の機能に採用されることもあるので、おもしろい。むしろパクってもらえるなら光栄

Figmaコミュニティで公開すると世界中の人から『これ欲しかった!』といった反応が来る。世界とつながれることが醍醐味

自分の時間と技術を費やしてFigmaの発展に貢献できるなら、むしろ喜びだという究極のファン心理が感じられる。さらにユーザーによる「Figma相談コミュニティ」があり、有志がアドバイザーやエバンジェリストとしてSlackで質問に答えている。もちろん無償だ。

日本進出の背景には、英語版しかない現時点ですでに熱狂的なファンコミュニティが形成されており、直近1年間で日本の登録ユーザーは約2倍に拡大したことも挙げられるという。

川延氏はFigma Japanの今後について、「日本のマーケットで真剣にやるにはローカライズが必須」と力を込める。

2022年夏には日本語版をリリース予定で、英語以外の言語の公式リリースは初めてとなります。それだけ日本の市場は熱いということ。ただし、製品のローカライズは始まりの一歩に過ぎません。これを皮切りに、より多くの日本の皆さまにFigmaを身近に感じていただけるよう、体制面も含めたさまざまなローカライズ対応を進めます(川延氏)

英語版のみのツールで、すでにここまで話題になっている「Figma」。日本語版が公式リリースされたら、より多くの人に使われることは間違いないだろう。Figma Japanの動きに注目しておきたい。

この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

CSS
「Cascading Style Sheets(カスケーディングスタイルシート) ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]