Adobe XD 2020年6月のアップデート

こんにちは、みおです。

6月16日に、Adobeの大きなアップデートがありましたねー！
今回一番話題になっていたのはやはりアプリアイコンの変更でしょうか。
今回のアップデートについてはこちらのAdobe Blogでまとめられていますので、そちらでご確認ください！
https://blogs.adobe.com/japan/cc-general-creativecloud-june-2020-update-list/

さて、本題のXDのアップデートです！
今回でなんともうVer.30！！
そんな6月のアップデートはこちら。

デザイントークン
スクロールグループ
スタック
共有リンクの強化

では、順番に見ていきましょう。

デザイントークン

アセットパネルでカラーや文字スタイルにカスタム名を追加することが可能になりました。
カスタム名をつけてデザインスペックを共有すると、開発者はすべてのトークンを含んだCSSファイルをダウンロードできます。

デザインスペックを共有するには、『共有』で『開発』を選ぶか『カスタム』で『デザインスペックを含める』を選択できます。
そのとき、『書き出し先』を『Web』にしていないとCSSが表示されないので注意してください。

スクロールグループ

これまではカルーセルなど、画面の一部がスクロールするものを表現しようとすると、自動アニメーションを使って作る必要がありました。
今回追加されたスクロールグループを使うと簡単にスクロールするデザインが作れるようになりました。

『グループ』と名前についていますが、グループじゃなくても使えます。

複数組み合わせたバージョンも。

CC道場でデモがありましたが、スクロールグループと自動アニメーションを併用することで、自動で動くスライダーがマスクを使わずに作ることもできます。

スクロールは、プレビューや共有されたプロトタイプで動かす場合、マウスだとうまく動かせないことがあるので注意が必要です。
（ホイール操作だと横スクロールがやりにくい）

スタック

今回のアップデートで一番うれしかったのはこれかもしれない…スタック！

スタックを設定すると、オブジェクトを拡大・縮小したときや、並び替えた時に間隔を保ったまま自動で適応してくれます。
グループを選択すると、プロパティインスペクタに『スタック』という項目が現れ、チェックを入れるとスタックの方向を自動で検出してくれます。

デザインしていてオブジェクトの順番を変える必要があったり、テキストの長さが変わったりというのはよくあることかと思います。
そういった場合、これまでは手動で位置や間隔の調整をしていましたが、それを自動でやってくれるので、作業がかなり楽になるのではないでしょうか。

共有リンクの強化

これまでは、『共有』でリンクを作成する際に選べるリンクのアクセス権（『リンクへのアクセス』で設定）は『リンクを知っているすべてのユーザー』（公開リンク）と『招待されたユーザーのみ』（非公開リンク）の2種類でしたが、今回から『パスワードを知っているユーザー』（パスワードリンク）が追加されました。

公開リンクまたは安全な非公開リンクで共有していた場合、任意の時点でアクセス権の設定をもう一方に変更できます。
アクセス権を変更しても、リンクURLは同じままで、リンクに追加された招待者は保持されます。

パスワードリンクを発行したあとは、リンクアクセス設定を変更できません。
そのため、アクセス権を変更する場合は、新しいリンクを作成する必要があります。

社内でプロトタイプやデザインスペックを共有して確認する場合とクライアントに確認してもらう場合でアクセス権を変更したいときも、同じURLで簡単に変更できるようになったので管理がしやすくなりますね。

まとめ

今回のAdobe全体の大型アップデートは、本来なら初開催となるAdobe MAX EUのタイミングでの更新となる予定だったとのことですが、残念ながら昨今の状況により開催が中止になったため、このタイミングでの発表となったそうです。

XDのアップデートもかなり大型のものとなり、特にスタックやスクロールグループはデザインする上でとても便利な機能だと思います。
ますます便利になったXD、みなさんもぜひ新機能を試してみてください！！