【動画】Adobe XD 2018年6月の新機能まとめ

先日TwitterでXDの新機能についてまとめた動画をアップしたところ、軽くバズってこの記事の公開段階で250RTちょい850likesちょいまで伸びています。
引用RTやリプライなどでコメントまでして頂いて、嬉しかったです（小並感）。ありがとうございます。

デザインデモはこちら(https://xd.adobe.com/view/6b243e13-8dd9-47f2-5817-9540bfcac789-1d15/)
PW : Goebiebi3
ただこの動画はあくまでキャッチアップで、説明が少なくなってしまっているのでフォローアップとしてこの記事を合わせて読んで頂けるとさらに理解が深まるかと思います。
（Twitterの動画は2分20秒の制限があるのでめちゃ辛い）

プロパティ入力の数式サポート

プロパティ入力に四則演算が使えるようになりました。
サイズや位置、角度などのプロパティ入力欄に

足し算は +
引き算は –
掛け算は *
割り算は /

で式を書くと自動計算をしてくれる機能です。
大体のデザインツールには当たり前にある機能なので、待っていた人も多いかと思います。

実際の活用方法として、オブジェクトをX/Y方向に任意のピクセル数移動させたいという時に「+」、「-」で入力出来るように。画像を80%縮小したい時などに「*0.8」の式で出来るように…etc。

シェイプに配置した画像の調整

シェイプに配置した画像は調整出来なくなる時代もあったんだなぁ…。くらいの理解でいいと思います。
でも、せっかくなのでXDにおけるマスクの方法について復習しておきましょう。

以前は右のマスクでないと、画像の位置やサイズの再編集が出来なかったのですが今回のバージョンアップからはいずれの方法でも再編集可能となっています。
個人的には、真ん中のシェイプに直接ドロップする方法が一番スマートなマスクの方法だと思います。

固定オブジェクト

今回の目玉新機能その1です。
名前の通りオブジェクトをアートボード上の特定位置に固定表示する機能です。
ヘッダーやメニューなどの要素を画面上に固定表示出来るので、より完成品に近い状態でプロトタイプを作成出来ます。

ちなみに、固定する要素が必ず最前面に来るわけではないので固定オブジェクトをオブジェクトの後ろに潜り込ませることも出来ます。
それと、ファーストビュー内に収まっていないオブジェクトを固定オブジェクトにすると、消えます。（画面外に固定されてる？）
文章だけじゃ分かりにくいので以下を見てみてください。

アートボードのオーバーレイ

今回の目玉新機能その2です。個人的にはこれが一番すごい。
アートボード上に別のアートボードを被せて表示させることが出来るようになりました。
ドロップダウンメニューやモーダルの表示はもちろん、使い方によってはインラインスクロールやカウント要素も再現可能です。

こちらに関してはまた今度、動画にて紹介します。

プライベート共有

プロトタイプやデザインスペックのオンライン共有を招待制で行える機能です。
公開した動画でガッツリ間違えてしまっていました…。申し訳ございませんm(_ _)m
動画内で紹介したのは、パスワード共有でした…。
「Create Public Link」の下に「New Private Link」というボタンがあり、そこからプライベート共有に関する設定が出来ます。
招待性なので、パスワード漏れなどの心配もなくより強固なセキュリティでデザインを共有出来るのでクライアントに喜ばれる機能です。（招待にはAdobe IDが必要になるみたいですが、Adobe ID自体無償で作成出来るので問題ないでしょう）

まとめ

以上がAdobe XD 2018年6月の新機能でした。
今回のバージョンアップで更に使いやすく、更に完成に近いインタラクション体験が可能になりました。
僕が心待ちにしていた「固定オブジェクト」「アートボードのオーバーレイ」が実装され、テンションと勢いだけで作った動画に沢山のリアクションを頂きありがとうございました。
公開プロトタイプ上にコメントを頂いた方までいて本当に嬉しかったです。

このバージョンアップをきっかけにXDユーザーが増えることを願っています。（ちなみにXDは無料で使えるのでAdobeユーザーではない方でも直ぐに使えますよ！）
僕はエンジニアなのでデザインでXDを使うことは少ないのですが、XDの恩恵を受けるのはデザイナーだけではないので！
それでは、良いXDライフを！