こんにちは、デザイナーの野尻です。
最近、食わず嫌いで手を触れてこなかったAdobe XDに触れる機会があり、その便利さに驚愕（今更）した経緯がありました。
まだ触った程度ではありますが、本格的に活用したくなる便利さを体感できましたので、今回は普段使いのIllustratorと比較して紹介したいと思います。
Illustratorからの乗り換えストレスが少ない
最初使うことになったとき、正直「イラレでいいじゃん」という拒絶反応が少々あったのですが、実際に触ってみた感想は「初見でも案外いける」でした。
その理由のひとつが「ショートカットがAdobe製品で統一されている」にあります。
感覚的に使い慣れたショートカットが意外と使えることが多く、初見でもIllustratorとほぼ同じ感覚で使用することができました。
以前トライしてみたSketchと比べても感覚的にかなり使いやすい印象です。
効率化を求めて新しいツールを使ったはずが逆に非効率的、という本末転倒な状況が起きにくい。まずこれは大きいです。
Web制作に特化した機能の数々
使ってみて、びっくりするくらい便利な機能が盛りだくさんでした
リピートグリッド機能
連続した特定のパターンを任意の領域に複製できる機能です。
例えばお知らせのブロックをひとつ作ると、それを任意の範囲にリピートすることができるというものなんですが、これが思いの他便利！
リピート要素をコピペして、整列していた手間を省けるだけでなく、リピート要素内のオブジェクト配置を変更すると、リピートされた要素の配置も変わる！（非常にイイ！）
個人的には「整列」の手間を省くことができることが非常に大きく、作業効率が向上する予感を大いに感じています！
プロトタイプ機能
WF（ワイヤーフレーム）を作成したとき、作成したビジュアルから、そのままプロトタイプ作成に移行することができます
最近はプロトタイプを作成する機会がなかったのですが、以前は下記のような手順でプロトタイプ作成していました
①ビジュアルを画像として出力
②外部サービスにアップ
③外部サービスでリンクなどを設定
④修正が入ると①に戻る
改めてみると結構大変ですね、、、
これがひとつのツール内でできるようになった、事実上①②の作業を省くことができるのは非常に効率的だと感じました！
ファイルの共有
これは前提としてXDのインストールなどがからんでくるので、基本的には社内での連携に便利な機能です。
作成したファイルをクラウド上で共有できるので、複数人で作業するとき、例えばデザイナーとコーダーが分業のときなどはものすごく便利な機能ですね！
余談ですが、今回私がXDを触るきっかけになったのは、クライアントがXDを導入していたためとなります。
アセット機能
プロジェクト内で使用しているカラー、文字スタイル、シンボルなどを特定のルールで管理することができる機能です。
例えば、ボタンのカラーを登録して、そのアセットを配置していくと、あとでボタンのデザインやカラーを変更したいときに、一括で変更ができるというもの。
まだあまり使っていない機能ですが、非常に便利そうですね！
要素のレスポンシブ表示
Illustratorと決定的に違うのがこの部分なのかと思います。
例えば文字を含む要素のブロックを拡大縮小するとき、
Illustorator
中身の文字も拡大縮小される
XD
範囲内でレスポンシブに拡大縮小される
これは実際に動かしてみると、ちょっと感動すら覚えます。
細かい便利機能
・動作が軽い
・画像の投入が楽（自動的にマスクしてくれる）
・等間隔への整列に強い
などなど
UIデザインに特化した様々な便利機能を兼ね備えています！
Adobe XDをもっと使いこなすヒント！
https://blogs.adobe.com/japan/serialization/web-xd-protips/
総括
非常に便利です！
これまでUIをデザインするうえで、「ここは変えたくない」と思ってしまうような面倒な作業を、一括で操作できるようにすることで、よりUIの完成度を高めるためのトライアンドエラーをしやすくなるというところが大きいと思います！
