東京都府中市、渋谷区のWEB制作会社Maromaroのブログです

2017.04.17

Sasaki

これからのWebワイヤー作成はAdobe XDで決まり!

※この記事は2017年4月14日時点に執筆したものです。(2017年5月16日アップデート)
こんにちは佐々木です。

早速ですが、みなさんWebサイトを作成する時に、ワイヤーは何のソフトウェアで作成されていますか?
エクセル?、ワード?、パワーポイント?、もしくはブラウザベースのサービスですか?

ワイヤー作成となると、その人それぞれのポリシーがあって色々な形式で作られていますよね。

ところがほとんどの場合、そもそもワイヤー作成用のソフトウェアじゃないですよね。

きっと、何のソフトウェアで作るのが正解なのか、モヤモヤした事があるはずです・・・。

そんな中ついにAdobeから「Adobe XD」が登場しました。

まさにWeb屋のワイヤーを作るためのソフトウェアです! 素晴らしい!
まずはWindows版を使ってみました。

Adobe XDのスタート画面
このスタートアップ画面からして、Webのためにという感じが出ていますね。

Adobe XDの画面
チュートリアルで全体像がつかめますので、まずはチュートリアルを確認してみましょう!
チュートリアルのように1つのファイル内で複数のページを完結できます。

Adobe XDのプレビュー画面
実際に設定している画面遷移等も試せます

Adobe XDでリンクをシェアした様子
画像のように、リンクを先方に伝えるだけで、ブラウザ上で閲覧ができます。
もちろん画面遷移なども実際に試せますので、毎度印刷の必要がなくなりそうですね。

Adobe XDを使ってみた感想(メリット)

まず、動作が軽快でストレスなく利用できました。
他のソフトですともっさりとした動作のものが多く、ブラウザベースのサービスと比べるとかなり軽快に動作してくれます。

Adobe XDは、ワイヤーを作成するための機能に特化しているため、機能がミニマムです。
ワイヤー作成に必要なことだけに専念できます。

下記が特に良いなと思ったオススメポイント!
・アートボード(ワイヤーの1ページに相当)同士をリンクして、実際に手でクリックしながらページの動線を確認できる。
・共有機能を使うと、共有用のURLが発行されて、お客様に実際の画面幅や動線などの体験をしてもらえる。
(お客様との認識違いを埋めることができる)
・共通パーツを使いまわすためのシンボル機能がある(現時点ではMac版のみ対応)

Adobe XDを使ってみた感想(デメリット)

デメリットというものはほとんどありませんが、
現時点で致命的なのが、Mac版とWindows版で機能の違いが大きすぎる、です。
Mac版で使える機能がWindows版でほとんど使えません。
ワイヤー作成をするWebディレクターな方は、大半がWindowsかと思います(恐らく)。

2017年4月現時点で、個人的にWindows版で使えなくて困った機能
・シンボルが使えない(ヘッダーや、フッターなどの共通パーツに使える)
・PDF書き出しができない(Macで書き出して使いました・・・)
2017年5月16日のアップデートでPDF書き出しが可能になりました!

ただし、Windows版も1ヶ月単位で更新されていくようですので、月日が経てば機能が追い付いてくるかと思います。

Windowsユーザーの方は、逆に慣れるなら機能の少ない今が覚えやすいかもしれません。

私は現状Windowsで利用しましたが、問題なく利用できましたし、今後のアップデートに期待が持てました。

Maromaroでは、ワイヤー作成の際にAdobe XDを利用することに決定しましたので、次回は細かい使い方を記事にできていければと思っています。

Adobe XD公式で機能追加の歴史と、予定を公開していますので下記から閲覧してみると面白いと思います。
Adobe XDの新機能
Adobe XDのブログはこちら

以上佐々木でした。

Adobe XD のショートカットキー チーとシート(早見表)の記事はこちら!