Webサイト制作のデザインを行う際にどんなツールをお使いでしょうか。PhotoshopやAdobe XDなど、デザインの際にはさまざまなツールを使っていると思います。その中で、近年注目されているデザインツールとして「Figma」が挙げられます。

2022年7月に日本版がリリースされ、2022年9月にはAdobe社がFigmaを買収しました。話題性のあるFigmaは、デザイン業界界隈で注目度が高いデザインツールです。では、なぜFigmaはそれほどまでに注目されているのでしょうか。Figmaが注目されている背景を、さまざまな角度から紹介します。特にこれからデザインツールの活用を検討している非デザイナーの方にとっても必見です。

Figmaは共同編集できるデザインプラットフォーム

Web制作のイメージ画像
Figmaの最大の特徴は、ブラウザ上で共同編集できるデザインプラットフォームであることです。直感的に操作できるノーコードツールであることに加えて、デザイン共有のスムーズさや、無期限で無料プランを利用できる点が一気に人気を獲得している要因です。

2016年にアメリカでFigmaが一般公開されると、ユーザー数は飛躍的に伸び続けました。
100万人を超えるユーザーを抱え、2021年の年間経常利益は7,500万ドル(日本円で約86億円)とのことです。年間経常利益は2020年に比較しておよそ2倍とのことで、Figmaの勢いを物語っています。また、2022年7月には待望の日本語版がリリースされました。2022年9月にはAdobe社がFigmaを買収し、話題に事欠かないデザインツールです。

人気急上昇中のFigmaですが、代表的な機能ではオートレイアウトスマートアニメイトが挙げられます。

  • オートレイアウト:デザインやオブジェの中身に応じて余白や配置を自動的に設定する機能。
  • スマートアニメイト:簡単にアニメーションを追加し、チームで動きを共有できる機能。

Figmaのビジョンは「すべての人がデザインにアクセスできるようにする」であることから、非デザイナーであっても直感的な操作で使いこなせる点が魅力となります。

基本的な使い方は、アカウント登録、新規ファイルの作成、フレームの選択、図形・テキストの配置、プロダクトタイプの作成、データ入力、他の編集者との共有と流れていきます。

Figmaを使用するうえでのメリット・デメリット

デザイナーの作業風景
FigmaはUI/UXの観点からも非常に使いやすいツールであり、デザインイメージをプロジェクトチームで共有する際も便利です。しかし、他のツールと比較して使いにくさを感じる面も考えられます。
そこでFigmaを使用する前に知っておきたいメリットとデメリットを紹介します。

Figmaのメリット

Figmaのメリットは下記が挙げられます。

・共同編集・共有がしやすい
・無料プランが使える
・Webブラウザで手軽に使える
・Webデザインに必要な機能が備わっている
・バージョン管理がしやすい

まず共同編集や共有のしやすさはすでにご紹介した通りです。これはWebブラウザを利用したツールであることが理由です。

また、Figmaでは3つの料金プランが用意されている中に、無料プランがあります。この無料プランはソフト関係でありがちな、期限付きではなく永久に無料で利用できます。そのため、デザインツールを使ったことがない場合においても、気軽に使い勝手を確認できます。

他にもFigmaにはWebデザインの際の必要な機能が備わっています。先述したオートレイアウトやスマートアニメイトの他に、図形描写ツール、テキストツールなど、デザイン制作に必要な機能を使うことが可能です。無料プランであっても一通りの機能が使えるため、一般的なWebデザインの制作に困ることはないでしょう。

作成したWebデザインは30分ごとにファイルのバージョン作成や保存が自動的に行われます。何かしらのミスがあった際は編集前に戻すことが可能です。ただし、無料プランはバージョン管理期間が30日であるため、制限なくアクセスしたい時は有料プランをご検討ください。

Figmaのデメリット

一方、Figmaのデメリットは下記が挙げられます。

・操作のヒストリーがない
・ガイド線を固定できない
・レイヤーのフォルダを一気に閉じることができない
・日本語フォントが少ない
・Adobe製品との相性が悪い

Figmaはバージョン管理されることを紹介しましたが、その代わりに1つずつ作業をさかのぼるヒストリー機能がありません。また、ガイド線を固定できない点から使いにくさを感じる方もいるでしょう。ガイド線のずれに気づいて修正すれば大きな問題になりませんが、気づかずに進めると全体的に違和感のあるデザインになる可能性があります。

それから、レイヤーが増えてきた時にフォルダが開きっぱなしになると、操作したいレイヤーが見つけにくいです。ところがFigmaでは1つずつレイヤーを閉じる必要があるため、手間と感じる場合があるでしょう。他にも日本語フォントの少なさや、2022年12月時点ではpdfファイルのインポートができないため、Adobe製品との相性の悪さなども覚えておきたい点です。これらのデメリットが今後、改善されることを期待しましょう。

新米Webデザイナーや非デザイナーこそFigmaを

Webページや商業広告のモダンなデザインのためのデザイナー ソフトウェア
Figma Japanが公開しているように、Figmaのユーザーの3分の2は非デザイナーです。これはデザインに関して専門的な知識がなくても、直感的にビジュアルを作成できるツールであることを証明しています。コアでないユーザーからも多くの支持を集めているのは、稀なケースでしょう。

これまでデザインを本職にしてきた方だけではなく、これからデザインを勉強し始める新米Webデザイナーや、片手間でデザインもやりたい非デザイナーにはFigmaが適します。理由は、Adobe社が提供するデザインツールであるAdobe XDと使用感などを比較すると分かるでしょう。Adobe XDでできることはFigmaの無料プランでもカバーでき、やはり共同編集機能で使いやすさが勝ると言えます。

Figmaでは共同編集をすると、常に最新情報が共同編集者にも表示されるからです。プレビュー画面についてもリアルタイムの編集内容が反映されるため、クライアントとの打ち合わせで直接画面を編集したり、複数の選択肢やビフォーアフターを比較したりしながら話し合うことも可能です。もちろん、新米Webデザイナーの指導の場面にも有効でしょう。

コメント機能を活用すれば先輩デザイナーへの伝言や不明点の共有もでき、チームとしての完成度も向上していきます。デザインの初心者は、Figmaを使いながらデザインを学んでみてはどうでしょうか。

デザインをこれから始めるならFigmaのマスターを

ブレーンストーミング  プランニング クリエイティブ

【Figma Webデザイン 人気の理由のまとめ】
・Figmaは専門知識なしでも制作も共有も簡単
・評価の高いFigmaだが、使いにくい面も知ることが重要
・デザイン歴の浅いクリエイターこそFigmaに注目すべき

Figmaは非デザイナーや新米Webデザイナーであっても、専門的な知識が不要で使えるデザインツールです。共同編集機能により、チームによる共同作業と共有を簡単に行えます。さらに無料プランで幅広い機能を利用できる点も魅力でしょう。

ただし、Figmaはメリットばかりではなくデメリットもあります。たとえば、Adobe XDやPhotoshopなどと比較すると、細かな部分の操作性では劣る面があります。「無料で使い勝手がいい」と思い込むのではなく、さまざまなツールと比較することも大事です。

とは言え、直感的な操作ができる点や無料で幅広い機能を使える点を考慮すると、デザイン歴の浅いクリエイターこそFigmaに注目すべきでしょう。ツールの使い心地にストレスを感じにくく、デザイン制作に注力できます。