UIデザインを行うための有名なプロトタイピングツールに「Figma」と「Adobe Xd」があります。
どちらも人気のデザインツールですが、両者の違いを理解している人は少ないのではないでしょうか？
この記事では、それぞれの違いや特徴について紹介していきます。
目次
Figmaとは？
Figmaの主な特徴は、アプリ版以外にブラウザ版があることです。
ブラウザ版を利用することで、いつも使っているパソコン以外からでもブラウザのある環境であれば、どこでも作業することが可能です。
注意点としては、ブラウザ上で機能するため、オフラインの環境では動作しない点があげられます。
世界中で人気がありますが、対応言語は英語のみで、日本語非対応となっています。
Adobe Xdとは？
Adobe Xdの主な特徴は、多機能で直感的に操作しやすいことです。
Adobe社は「Adobe Photoshop」や「Adobe Illustator」などの各種デザインツールを提供しており、そういったツールの使用経験があれば、操作を覚えるのも比較的簡単でしょう。
Figma同様に世界中で人気ですが、日本語に対応しているため、特に日本で人気の高いツールです。
機能面比較
まずは、それぞれのツールの持つ機能に関して、メリットとデメリット見ていきます。
Figmaのメリット
Figmaのメリットは以下の通りです。
- ブラウザ版がある
- 複数人でのリアルタイム編集が可能
- データ共有はURLを送信するだけで簡単
複数人作業に特化した機能が特徴と言えるでしょう。
Figmaのデメリット
Figmaのデメリットは以下の通りです。
- UIが日本語非対応
- 日本語対応のフォント数が少ない
使用に関しては、英語での説明が理解できる最低限の語学力が必要となります。
Adobe Xdのメリット
Adobe Xdのメリットは以下の通りです。
- ほかのAdobe製品と操作性やスタイルの共有が可能
- 音声入力UIを使用したプロトタイプが可能
- 直感的に分かりやすい操作性
ほかのAdobe製品を使用した経験があれば、学習コストの削減が可能な点が魅力と言えるでしょう。
Adobe Xdのデメリット
Adobe Xdのデメリットは以下の通りです。
- プロトタイプが実機表示ではなく、イメージがつきにくい
- 編集はアプリを持っている人のみ可能
ホーム編集はアプリを持っている人限定など、複数人作業での利便性はFigmaにやや劣ります。
料金・プラン比較
2021年12月時点の料金・プランは以下の通りです。
Figmaの料金
| スターター | プロフェッショナル | オーガニゼーション |
|---|---|---|
| 無料 | 月額15ドル/エディター | 月額45ドル/エディター |
| ・プロジェクト数：1つのみ ・ファイル数：3つまで ・エディター数：無制限 ・クラウドストレージ容量：無制限 | ・プロジェクト数およびファイル数も無制限 ・共有可能なチームライブラリの作成可能 ・全てのバージョン履歴保存 | ・チーム数も無制限 ・シングルサインオンや一元化されたコンテンツ管理など、大企業むけ利用も想定した各種機能 |
機能は限定されますが、無料で継続使用できるプランが特徴です。
Adobe Xdの料金
| XD単体プラン | コンプリートプラン |
|---|---|
| 1,298円/月 | 6,248円/月 |
| ・共同ドキュメント数：無制限 ・共有リンク数：無制限 ・編集者数：無制限 ・ドキュメント履歴：30日間 ・クラウドストレージ容量：100GB ・7日間の無料体験版あり （上記数値に制限あり） | ・20以上ある全てのAdobe製品の使用が可能なプラン |
コンプリートプランは、各製品を個別で契約するよりもお得なため、ほかのAdobe製品も使用する人には魅力的なプランです。
それぞれのツールがおすすめな人とは？
最後に、それぞれのツールがおすすめな人を確認しましょう。
Figmaがおすすめな人
Figmaがおすすめな人は下記の人です。
- チームで共同作業することが多い
- ブラウザで利用したい
- 英語表記のUIに抵抗が無い
- 無料で使い続けたい
英語の説明に抵抗がなく、複数人で作業する方は、Figmaがおすすめです。
Adobe Xdがおすすめな人
Adobe Xdがおすすめな人は下記の人です。
- ひとりで作業することが多い
- Adobe製品の使用経験があり、操作に慣れている
- ほかのAdobe製品と合わせてお得に利用したい
- 直感的な操作しやすさを重視
Adob製品を複数使用して、ひとりで作業を進める方は、Adobe Xdがおすすめです。
関連：「アプリ開発のuiデザインでfigmaを使う4つのメリットとは」
まとめ
今回の記事では、「Figma」と「Adobe Xd」の違いについて紹介しました。
両者とも無料利用が可能ですので、まずは無料で操作感を確認しつつ、自分の仕事スタイルに合わせて判断していくと良いでしょう。
picks designでは、現在最新情報をメルマガにて配信しています。
この機会に是非ご登録ください。
→メルマガ登録はコチラ
