Vol.155


キーワード: Adobe XD UI UX デザイン

動的コンテンツ作成に、Adobe XD
動作確認の効率化や共同作業の促進に。業務フローが変わる、Adobe XD。
前号でUI(ユーザーインターフェース)とUX(ユーザーエクスペリエンス)の重要性が高まっているというお話をしました。
コミュニケーションツールの主役がアナログからデジタルに移行し、この傾向がますます強まっています。
今回、Webやアプリなど動的なコンテンツのデザインに適したツール、Adobe XDをご紹介します。

グラフィックデザイナーやDTPオペレーターにとって必須のツールであるIllustrator、Photoshop、InDesign。
DTPに詳しい方であれば、ご存知だと思います。

近年、これらのアプリケーションに加えてAdobe XDを利用するケースが増えてきました。
Adobe XDとは、主にWebサイトやモバイルアプリなどの設計段階で利用され、快適なUIやUXの構築に有効なツールです。
動作が軽く、ワイヤーフレームと呼ばれるWebサイトのレイアウトを定める設計図の制作などに便利です。

動的コンテンツ作成に、Adobe XD
動的コンテンツ作成に、Adobe XD

グラフィックデザイナーやDTPオペレーターにとって必須のツールであるIllustrator、Photoshop、InDesign。
DTPに詳しい方であれば、ご存知だと思います。

近年、これらのアプリケーションに加えてAdobe XDを利用するケースが増えてきました。
Adobe XDとは、主にWebサイトやモバイルアプリなどの設計段階で利用され、快適なUIやUXの構築に有効なツールです。
動作が軽く、ワイヤーフレームと呼ばれるWebサイトのレイアウトを定める設計図の制作などに便利です。

最大のメリットは、デザイン段階から、ページの遷移やコンテンツの動きをお客様に確認していただける点でしょう。
動的コンテンツの動きが容易にチェックできるため、関係者間で認識違いを起こすことなく、円滑なやりとりが可能です。
Webサイトの制作時、従来はコーディング後のテストサイトで動作確認を行い、思っていた動きと違う場合は手戻りが発生。
余計な手間が発生していましたが、それを防ぐことができます。

またWindowsやMacの他、Android、iOSなどのOSやデバイスを問わず、さまざまなプラットフォームでプレビューができます。
さらに他のデザイナーやエンジニアと、クラウド上に保存したドキュメントを同時に編集でき、遠方のスタッフとも
リアルタイムに作業を進められます。
別々に制作したドキュメントを統合する作業も不要です。

その他、閲覧者がコメントを残せるため、デザイナー同士で意思の疎通を図ったり、
クライアント側が要望を書き込むこともできます。

最近では、紙だけでなく、PDFでの校正も増えてきましたが、Adobe XDならブラウザ上で
アニメーションやページの遷移などの動作確認ができるので、これまで以上にチェックが容易になるでしょう。
今後、普及にともない業務フローが変わるかもしれません。

比較的自由度が高いツールなので、ワイヤーフレームやデザインカンプの他、提案書や社内資料、
セミナー用スライドなどの作成に利用するという方も少なくありません。
今後、Adobe XDの名前を聞く機会や使う機会が、より増えてくるのではないでしょうか。


動的コンテンツ作成に、Adobe XD
「Vol.155 動的コンテンツ作成に、Adobe XD」の
PDF版はこちら