イラレ大好きデザイナーがXDを1年間使ってみた結果

お久しぶりです。デザイナーの高棹（たかさお）です。

前回のブログから約半年が経ち、9月になればアンドスペースに入社して一年が経ちます。
この一年で転職して東京に転勤して引っ越しを2回しました。
そしてAdobeXDが使えるようになりました。（まだまだ勉強中ですが、、）

前職では紙もののお仕事がメインだったこともあり、Illustratorにゾッコンだった僕が、
アンドスペースに入社しWeb制作にXDを使うようになった結果、
「XD最高！！」となる瞬間と、「やっぱりイラレが恋しい」としくしく泣いてしまう瞬間を
今回のテーマにさせていただきたいと思います。
XD興味はあるけど触ったことない〜って方に届け！！！

XDの基本機能については、以前に今井さんが記事にしてくれているので、 初心者の方は「AdobeXD初心者のための、XDで覚えておいた方がいい8個の便利機能」も読んでみてください！
（僕もこの記事で勉強しました。）
それでは、よろしくお願いいたします！

XD最高！！となる瞬間

1：プレビューが作業と同時進行で反映される

更新ボタンを押さずとも、リアルタイムでデザインの確認ができる。
XDを使っていれば当たり前になりがちなこの機能、実はめっちゃありがたくないですか？

ただこれに関しては、画面が小さいノートパソコンや、ディスプレイが一つしかない場合は
画面が窮屈になってしまい、そこまで魅力を感じないという方もいるかもしれません。
ですが僕は、この機能の素晴らしさの真髄はスマホレビューにあると思っています。
AdobeXDのスマホアプリをインストールして、USBケーブルでPCと接続すればスマホ上でもリアルタイムでレビューができます！しかも軽いです！！
スマホで表示されることの多いバナーや、Webサイトのスマホ版を作るときに、
文字サイズの確認やキャッチの立たせ具合など、イラレだったらいちいち書き出して確認しなくてはいけなかったことが、制作しながら逐一確認できるのは本当に最高です！！！

2：スタックとコンポーネント神

スタックとは

整列が超カンタンで、修正などの作業がすごく早くなります。
やり方は、

1. 整列させたいオブジェクトをグループ化
2. スタックの矢印を選択
3. 数字を入力

すると、オブジェクトを入れ替えても削除しても、入力した数字分の間隔を保ち続けます。
しかも、そのグループ内であれば、オブジェクトを追加しても間隔を保ち続けます。
もし分かりづらかったらググってください！！本当に便利です！！

コンポーネントとは

「AdobeXD初心者のための、XDで覚えておいた方がいい8個の便利機能」でも紹介されていますが、このコンポーネントが神すぎます。

1. コンポーネントにしたい部分を選択
2. 「オブジェクト」の「コンポーネントにする」を選択

コンポーネントにすると、メインコンポーネントに加えた変更が一括で反映されます。
複数の同一デザインがあるオブジェクトに修正が入ったとき、
全デザインにひとつずつ修正を加えていたら10分かかる作業が、5秒で終わります。

動画では忘れてたのですが、色や文字の変更も一括で反映されます。
メインコンポーネント以外のデザインに修正があった時、修正した部分にはメインコンポーネントの修正が適用されないので注意が必要です。この辺は若干ややこしいですが使っていく内にすぐ掴めます。

スタックとコンポーネントの合わせ技

スタックとコンポーネントの合わせ技で作業がすごく捗ります。
他にもパディングという最高な機能もあるので、ぜひ調べてみてください！！

3：共同作業ができる

その名の通り、クラウド上のデザインデータなら複数人同時に作業することができます。
他の人が動かしている部分がリアルタイムで自分の画面でも共有されるので、
例えば、デザイナーがデザインの修正をしながら、ライターがコピーを直接書き換えていく！
とかも可能です。このときに上記のスタックとコンポーネントをうまく組めていたら、誰が触ってもルールが統一されるので素敵です。
また、相手が今どこを触っているかわかるので事故の心配もいりません！とっても便利！！

4：すごい！いいことづくし！

上記で書いたもの以外にも、

• 動作が軽い
• アセットをしっかり管理すれば、デザインルールが自然と統一される
• 感覚的に操作しやすい
• 共有や書き出しがしやすい
• プロトタイプの設定が楽しいetc…

書き出したらきりがないです。

イラレに会いたくなる瞬間

ここまで読んでくださった方はお気づきかと思いますが、たった一年で僕はXDの虜になってしまいました。でもたまにイラレが恋しくなる瞬間があります。

1：テキスト設定とか文字間調整激あま問題

イラレが恋しくなる理由の8割はこれです。
イラレにはカーニングという機能があって文字を詰めたり色々細かい設定ができるのですが、
XDにはそれがありません。
せめて箱組みしたときのここ

を揃えるくらいはできるようになってほしいなあと日々枕を濡らしております。

2：線幅と効果、角を維持して拡大縮小できない

コアラ、縮小してまん丸になっちゃいました。これイラレなら綺麗にカタチや線幅を保ってくれます。
そういうアプリではないとはいえ、アイコンなんかはどんなデザインでも結構多用するので
いつかアップデートされたらいいなあと思って毎日シャワーで泣いています。
一応TransformSessionというプラグインで解決しますが、いちいちプラグインから数値入力（％指定）はやっぱりめんどくさいですからね。

みんなちがってみんないい

思ってたよりイラレへの未練はなかったですが、やはりガッチガチに詰めたデザインをする際や
「Webに使うけどタイトルおもろく見せたい！」ってときとかは
イラレでタイトルだけ作ってXDに持ってきたり、使い所で全然使っています！

ツイッターなんかを見てると、
Web制作にイラレを使用してる方も結構いらしゃるのかなと思います。
たしかにイラレでコンマミリ単位を詰めてデザインすることに慣れているデザイナーさんであればあるほど
XDのチャラさにイラつくかもしれませんが、慣れればそこすらも愛嬌です。

今井さんの記事にもありましたが、XDはまだまだ進化途中のアプリケーションですので、
いわば未熟な成長期アプリです。今後もどんどん使いやすくなっていくんだと思います。
日々覚えることだらけな職業で、できれば使い慣れたアプリで楽しくデザインをしてたいなと思いますが、
なんだかんだ使ってみたら便利だったり、一線を越えたら楽しさに気づいたりもするので、
XDに限らず、なんか新しい風が吹いたなと感じたら、できるだけ頑張って追いかけてみたいと思います。