Adobe XDと聞いて、「ああ、あれね」とピンとくる方もいれば、まだまだ全然どんなアプリケーションかもイメージが付かない人も多いのではないでしょうか？
今回はそんなAdobe XDの最初の最初の超入門的な話から、Adobe XDを導入してみようかなとなってもらいたく、まとめて解説していきます。特にWeb制作の現場では使って損はないツールですので、ぜひこの機会にAdobe XDに触れてみてはいかがでしょうか。
第1回の今回は、XDが全然初めての方、初心者でなんとなく触っている方に向けた内容になっています。とにかくXDを知ってもらって、そのメリットや使い勝手の良さを実感してください。そして実際に仕事での現場で活用してみてほしいです。
目次
それでは、XDについてどんなアプリケーションなのか、説明していきましょう。
Adobe XDの紹介文でよくあるのが、PhotoshopやIllustratorとは違って「効率的・直感的に操作ができるので、初心者でも簡単に使える」ツールというもの。そして共同作業にとても向いているといった説明がされることが多いです。
しかしこの説明ですと、なんとなく簡単に使えるツールだけど、「じゃあ実際に使おうかな」とまでいかない人も多いのかなとも感じます。PhotoshopやIllustratorで作れていたら尚更そう思われるのではないでしょうか？
もう少しXDを使うメリットについてわかりやすく表現しますと、以下のようなことが挙げられます。
いかがでしょう？
メリットたくさんのXD、便利で使いやすそうだと感じていただけたでしょうか。
では、実際にどういうふうに使われているのかご紹介しましょう。Web制作の現場で見るとわかりやすいです。
XDの大きな特徴としては、PhotoshopやIllustratorにない手軽に作れちゃう便利さです。これは少し勉強すればディレクター職の人でも簡単に使えるツールです。
なので例えば「こういうふうに作って」というディレクターの指示もXDで作れて、それをそのままデザイナーに共有されて、続きを作れてしまいます。
簡単なものだとドラッグだけで作れてしまうので、ワイヤーフレームをディレクターが、そこからデザイナーが作り上げるといった、同じツールで完結できるので便利です。
ここが勘違いポイントで導入しない人も多いのですが、UI/UXの現場だけでなくWebサイトのデザインがこれで作れます。そんなことから普通にWeb制作会社で導入されているところも増えてきました。
前述したように、Webサイトは、パソコン・タブレット・スマートフォンのそれぞれの画面をとても簡単に作ることができます。レスポンシブのデザインが自動的に変換できる機能もあります。
XDの特別な特徴でいうと、共有性が高いところです。
PhotoshopやIllustratorでWebデザインを作成したら、ディレクターやクライアントにチェックしてもらうときには画像を書き出して、メールや共有アプリなどで見てもらうことになりますが、XDではオンライン共有ができ、デザインが表示されるURLを書き出してそのURLをチェックしてもらいたい人に伝えるだけで完了します。
一番の利点は、XDを持っていなくても確認することができるし、ブラウザで見るので実際のサイトに近いイメージでチェックすることができます。
またオンラインではセキュリティ面で不安な場合は、ページへの埋め込み共有もできるので、Basic認証などでパスワード保護してクライアントに見せることも可能です。
そして、リンククリックでページ移動もできますし、アニメーションの動きも確認できるので、本当に実際のWebサイトとしての動きを、共有・確認することができます。
便利なXDですが、その反面で機能をギュッとシンプルにしている分、できないこともあります。そこをしっかり理解することで、さらにXDを使いこなすようになれます。
例えば、ボタンは作れますが、バナーを作るのには機能不足です。テキストも加工したものというのは作りづらく、あくまでブラウザ表示を考えたテキストの設計をする必要があります。
このことから、凝りに凝ったリッチなデザインには向きませんが、シンプルでスマホなどで見やすいWebサイトを作るには十分機能を発揮できるツールだというのがわかります。
XD、他にデメリットがあるかというと、とても細かいところで見ると個人で不満点はあるかもしれませんが、一般的に考えてこの程度しかありません。どんなデザインを作るかしっかり組み立てれば何も問題なくWebデザインに活用できます。
今回は、Adobe XDで何ができるか、導入するに値するツールなのかについて解説しました。結論としては、ワイヤーフレームやシンプルなWebサイトにはとても有効なので、Web制作の現場、特にチームで制作する会社などで活用できるツールだと言えます。
第2回ではさらにXDの理解を深めるために、Webの現場で起こるモヤモヤなどを取り上げて、そこでAdobe XDがどう役立つかを解説していきます。
Webデザイナー、ディレクターを目指して勉強中の方、またクリエイターとして現職でバリバリ活躍しながらステップアップの転職をお考えの方にも知っていて損はないAdobe XDについてシリーズでお届けしますので、次回もお楽しみに！
また、Adobeの各ツールのスキルを活かした仕事をお探しのクリエイターの皆さんにお薦めなのが、トリサンクリエイター関西です。クリエイティブ職に特化して転職支援を行っており、大阪をはじめとした関西エリアに強い地域密着型の転職エージェントです。
ステップアップの転職を考えているクリエイターの方は、一度無料カウンセリングで相談してみてはいかがでしょうか。
ディレクターやクライアントとの…