はじめに
社内で開発しているシステムのフレームワーク変更という大きなのろしが挙げられ、チーム内で『今までの画面イメージ共有では限界があるのではないか！？』との声が聞こえるようになりました。
そこで導入を考えたのがプロトタイピングツールです。
少し調べてみると、巷で話題になっているプロトタイピングツールはSketch, Adobe XD, Figma など...
ここでSketchはMacのみに対応するプロトタイピングツールであるため、Windows利用者が大半の弊社では普及が望めないという結論に至り、残りのAdobe XDとFigmaについて比較検討することになりました。
結論からいうと、私たちのチームではAdobe XDを導入することにしましたが、選ぶにあたって私たちが基準としたポイントは複数あります。
今回はその中から料金形態について、まとめた内容を記事に起こしてみました。
*小規模での利用のため、すべて個人料金プランでの比較になります。
環境
- Windows10
- Adobe XD：バージョン 24.0
- Figma：2020/01時点での最新バージョン（ほぼ毎週アップデートあり）
ツールについて
Adobe XDって？
Adobeが提供している製品で、IllustratorやPhotoshop、After Effectsなどとの互換性がいいのが特徴です。
正式名称は"Adobe Experience Design"、正式版のリリースは2017年10月。
また日本語対応されているのが大きな特徴なので学習コストがかなり低く、初心者の私にとって非常にありがたいポイントです。
Figmaって？
2012年設立のFigma社より2016年9月に正式リリースされた製品で、オンライン上ですべて完結するのが特徴です。
ヘルプはすべて英語になりますが、動画付きのものもあるのでそこまで習得に苦労はしませんでした。
本題：おかねの話 ～無償と有償、どう違う？～
Adobe XD
Adobe XDの料金形態は下記の3つです。
- スタータープラン
- 単体プラン
- Creative Cloud コンプリートプラン
参考：https://www.adobe.com/jp/products/xd/compare-plans.html
このうち、Creative Cloud コンプリートプランはAdobe XD以外のAdobeが提供しているサービス（Photoshop,Illustrator等）を含んだプランとなり、Adobe XDのみの料金ではないため今回説明は割愛します。
上記の通り、スタータープランと単体プランでは共有の制限が大きく異なります。
アカウント数
Adobe XDの単体プランを選択した場合、1アカウント毎に金額が発生します。ここで重要になるのがアカウント数です。
アカウント数の決定にあたって、私たちはファイルの"共有"と"共同編集"の違いについて注目しました。
- 共有：ファイルに対してURLを作成し、デザイン案・プロトタイプ案についてAdobeアカウントがなくとも閲覧・コメントが可能。
- 共同編集：Adobe XDアカウントが必須。ファイルに招待する、という形でリアルタイムに編集が可能。
UIデザイナーとのやり取りの中で、スクラム開発におけるプロダクトオーナーである私にとって共同編集が可能か否かはかなり大きなポイントでした。共同編集が可能であれば全体の画面を見ながら修正ポイントを確認できるので、コミュニケーションがとてもスムーズになります。
よってAdobe XDを採択する際には、単体プランを購入すべきだという結論に至りました。
Figma
Figmaの料金形態は下記の3つです。
- Starter
- Professional
- Organization
参考：https://www.figma.com/pricing/
Organizationについては会社単位での導入を前提としたプランであり、セキュリティなどが他のプランよりも強化されたものです。今回は使用ツール検討というフェーズだったため、本プランについては触れず、他の二つのプランについて調査しました。
StarterとProfessionalで大きく異なるのは下記の点です。
- チーム内メンバー数
- プロジェクト上限数
- バージョン管理日数
Figmaのツール構成について
- フォルダ
Figma内のフォルダの概念は チーム＞プロジェクト＞ファイル です。
- アカウント
Figma内のメンバーごとの権限は下記のようになっています。
これらを整理すると、Starterを最大限に使う場合（無料で使える範囲） は下図のようになります。
ここで注意すべきなのは、このプランが適用されるのが"チームごとである"ということです。
ひとつのアカウントが属するチーム数に上限はありませんが、チームの中の自由度を増したい場合にはProfessional へグレードアップが必要、というわけです。
なので、一つのアカウントでStarterのチーム・Professionalのチーム・Professionalのチーム２など、異なるプランのチームに並行して加入することも可能です。
が！
あくまで"チームごと"、つまり支払いもチームごとになります。
この場合、異なるProfessionalのチーム２つに加入しているためそれぞれのチームにて料金を支払う必要があるので、チーム・プロジェクトの構成は慎重に！
Starterの場合、一つのチームに対して編集権限を持つことができる人数が2人という制限があり、私たちのプロダクトでは少なくとも3人以上の編集権限が必要と判断したので、 Figmaを利用する場合もやはりProfessionalを購入すべきという結論に至りました。
各ツールの料金面でのメリット まとめ
Adobe XD
- アカウントごとでの課金形態のため、支払金額計算がわかりやすい
- 課金後はファイル数などに限りはなく、クラウドも100GBまでは自由に利用可能
Figma
- Editor権限のみ課金対象となるため、編集権限が必要なメンバーが少ない場合は費用を抑えることができる
- 利用方法次第（チームに対して編集権限は２人、プロジェクト3つ以内）ではStarterにて無料で利用可能
今回の調査で、料金設定自体は大差ないものの、きちんと利用フローを考えてから選定を行うことが重要だとわかりました。
弊社では、少なくとも5人以上の人数でのやり取りすることを想定していたことに加え、プロトタイピングツールを導入するのが初めてでありファイル管理がどのようになるか想像がつかなかったため、料金面ではAdobe XDを用いるのが妥当であるという判断になりました。
プロジェクトのおおまかな枠組みが決まっている場合、Figma のほうがより費用を抑えられるケースも十分あると思うので、プロトタイピングツール選定の軸の１つとして、プロジェクトの規模と料金の兼ね合いを考えてみてください！
本記事がプロトタイピングツールの選定に迷っている方の理解の助けに少しでもなれば幸いです。
