Webサイト制作を外部に依頼する際、「どんなツールでデザインを作っているのか？」を気にしたことはありますか？ 近年では「Figma（フィグマ）」というツールを使う制作会社が増えており、それまで主流だった「Illustrator」や「Adobe XD」とは異なる点が多くあります。
一見すると制作会社の内輪の話に思えるかもしれませんが、実はこの「どんなツールでデザインを行うか」は、発注する側にも大きく関係するポイント。修正の伝えやすさ、確認のしやすさ、コミュニケーションのスムーズさなど、プロジェクト全体の進めやすさに直結するからです。
この記事では、代表的な3つのWebデザインツール「Illustrator」「XD」「Figma」の違いを比較しながら、なぜ今Figmaが注目されているのか、そして発注者目線で押さえておきたいポイントを解説していきます。
Webデザインツールの役割とは？
Webサイト制作における「デザインツール」とは、単に見た目を整えるためだけのものではありません。レイアウトや配色、テキスト、写真などを組み合わせて、サイト全体の設計図を作る――つまり、発注者と制作者が「どんなサイトにしたいのか」を共有するための“共通言語”とも言える存在です。
また、デザインツールは単に画像としての完成イメージを作るだけでなく、「ボタンを押したらどう動くか」「ページ間の遷移はどうか」など、UX（ユーザーエクスペリエンス）を視覚的に伝えるプロトタイピング機能も重要になってきています。
発注者にとっても、完成イメージを“動き”や“全体構造”を含めて確認できることで、「思っていたのと違った…」というトラブルを防ぐことができ、制作会社とのやり取りもスムーズになります。つまり、ツールの選定はそのまま「どれだけ見える化できるか」にも関わってくるのです。
各ツールの特徴とメリット・デメリット
Illustrator（イラストレーター）
Adobeのグラフィック制作ソフトとして有名なIllustratorは、元々は印刷物やロゴなどの制作に適したベクター画像編集ツールです。Webデザインでも一時期よく使われていましたが、現在はやや主流から外れつつあります。
- メリット：細かいパーツやロゴなどの制作に強く、印刷物との連携がスムーズ。
- デメリット：Webデザイン全体の構造や遷移の確認には向かず、修正・確認がしづらい。
Adobe XD（エックスディー）
AdobeがWeb・アプリUI設計に特化して開発したデザインツール。画面遷移やクリックアクションのプロトタイプ作成が可能で、Illustratorの後継として多くのWeb制作会社が導入してきました。(現在は新規の開発を終了しています)
- メリット：インタラクションや画面遷移の動作確認がしやすい。Adobe製品との連携にも対応。
- デメリット：共同編集機能に弱く、クライアントがブラウザで確認・コメントするのがやや手間。
Figma（フィグマ）
クラウドベースで動作するFigmaは、共同作業に特化した次世代型デザインツールです。ブラウザで閲覧・コメントが可能で、開発者やクライアントとの連携にも優れています。アトラボでも現在はFigmaを標準ツールとしています。
- メリット：ブラウザでURL共有すれば即確認でき、コメントも直接書き込める。複数人での同時作業が可能。
- デメリット：グラフィック制作や印刷物向けの詳細な調整には不向きな場面も。
このように、ツールごとに得意・不得意があり、制作の目的や体制によって最適な選択は異なります。中でもFigmaは「修正指示の出しやすさ」や「確認のしやすさ」において、クライアントとの相性が非常に良いツールといえるでしょう。
クライアントから見た「Figma」の嬉しいポイント
Web制作の現場で「Figma（フィグマ）」が支持されている理由は、デザイナーにとっての使いやすさだけではありません。クライアントにとっても、確認・指示・共有が非常にスムーズになるという点が高く評価されています。
1. ブラウザだけで確認・コメントができる
Figmaはインストール不要で、URLをクリックするだけでデザインを閲覧できます。専用ソフトもアカウント作成も不要なので、社内の他部署や上司にも簡単に共有でき、「見せたい人にすぐ見せられる」ことが最大のメリットです。
2. 修正指示がその場で書き込める
Figmaにはコメント機能があり、デザイン画面上の任意の場所に「ここをもう少し大きく」「この文言を変更」といった指示を直接書き込めます。メールやPDFで修正点を伝える手間が省け、伝達ミスや見落としのリスクも減ります。
3. スマホでも確認しやすい
多くのWebサイトはスマートフォンで閲覧されるため、Figmaではスマホレイアウトのデザインもそのまま確認可能です。デザインの見え方がPCとスマホでどう異なるか、事前にしっかり把握できるのは安心ポイントです。
4. 最新デザインが常に共有されている
修正を加えるたびにデータを再送付…という手間はありません。常に最新のデザインが同じURLに反映されているため、「どのバージョンが最新？」といった混乱もなくなります。
このように、Figmaはクライアントと制作側のコミュニケーションを効率化する点で大きな力を発揮します。特に「初めてのWeb制作」や「社内に専任担当がいない」場合でも、プロジェクトをスムーズに進めやすいのが特長です。
実際にアトラボがFigmaを導入して変わったこと
アトラボでは以前、Webデザインには主にIllustratorを使っていました。しかし、プロジェクトが増えるにつれて「確認・修正のやりとり」にかかる時間と手間が大きな課題となっていました。そこでFigmaを導入したことで、社内外のコミュニケーションが大きく変わりました。
1. 修正対応のスピードが向上
従来は、修正のたびにPDFや画像を書き出し、メールで送付して確認してもらっていましたが、Figma導入後は同じURLで常に最新の状態を見てもらえるようになり、細かなやりとりの手間が激減。「ちょっとだけ直して、すぐ確認」というフットワークの軽さが大きな強みになっています。
2. 社内共有・社外確認の効率がアップ
社内ディレクター・デザイナー間の連携はもちろん、クライアントとのやりとりもスムーズになりました。FigmaのURLを共有するだけで、PCでもスマホでも確認できるため、「最新デザインを誰にでもすぐ見せられる」環境が整いました。
3. クライアントとの共同作業も可能に
コメント機能を活用すれば、デザインの上に直接「ここを●●に変更」などの指示を書き込んでもらうことができます。これにより修正指示の精度が上がり、作業の無駄も減少。まだまだ事例は少ないですが、ITリテラシーの高いクライアントとは「共同でプロジェクトを進めている感覚」が得られることもあります。
もちろん、Figmaの活用方法はクライアントのITリテラシーに応じて柔軟に変えています。メールでの確認やPDFでの共有も併用しながら、Figmaの利便性を徐々に実感していただけるようサポートしています。
「デザインツール」で選ぶべき制作会社とは？
ホームページ制作を依頼する際、「どんなデザインツールを使っているか」まで気にしたことはあるでしょうか？ 実はこのポイント、制作会社の“進め方の姿勢”や“仕事の透明性”を知る上で、意外と重要なヒントになります。
クラウドベースか、ローカル作業か
Figmaのようなクラウドベースのツールを使う会社は、クライアントとのリアルタイムなやり取りを重視している傾向があります。URLで簡単に共有できるということは、「見せること」「確認をもらうこと」に積極的だということ。一方、Illustratorなどのローカル作業メインのツールを使っている場合は、完成まで見えにくいブラックボックス型の進め方になってしまうこともあります。
「見える化」に取り組む会社は、柔軟でオープン
Figmaを導入している制作会社は、進捗の見える化やフィードバックのしやすさといった点を重視していることが多く、特に初めてWeb制作を依頼する方にとっては安心材料になるはずです。また、クライアント側のリテラシーに合わせて、PDFや印刷物でも確認できるよう柔軟に対応できる会社なら、なお安心です。
制作ツールの違いは「進め方と関係性の違い」
ツールそのものよりも大切なのは、そのツールをどう活用して「伝わる」デザインとコミュニケーションを実現しているかという点です。気になる制作会社があれば、「デザインツールは何を使っていますか？」「デザインの確認はどのように行いますか？」と聞いてみるのも、失敗しない会社選びの一歩です。
まとめ：デザインツールの選び方も、“制作パートナー選び”のひとつ
Web制作において使われる「デザインツール」は、見た目の仕上がりだけでなく、制作の進め方やクライアントとの関係性にも大きく関わってきます。
Illustratorはプロフェッショナルな制作に長年使われてきた信頼性の高いツール、XDはAdobe製ならではの連携性が魅力、そしてFigmaは共有性とスピード感を重視したツールとして、近年ますます注目されています。
もし、「ちゃんと話を聞いてくれて、丁寧に進めてくれる会社にお願いしたい」と思っているなら、どんなツールを使い、どんなふうにデザインを共有・確認しているかを確認することで、その会社の姿勢や対応力が見えてくるかもしれません。
デザインツールの違いは、制作の「やり方の違い」。自社に合った進め方ができるパートナーを見極めるための、ひとつの判断材料として活用してみてください。
コメント