Adobe XD 1月アップデートリリース!Zeplin連携、Dropboxプレビュー、円形グラデーションなど #AdobeXD

連載

Adobe XD アップデート

Adobe XDの2018年最初のアップデートで、サードパーティ製プロトタイピングツールやハンドオフツールとの連携、カラーモデルの切り替え、円形グラデーションの追加、オブジェクトの一括エクスポート対応など、皆様からご要望いただいた多くの機能を実装しました。

日本時間1月24日午前2時~1月26日午前10時(米国太平洋時間 1月23日午前9時から1月25日午後5時)にUXのトップデザイナーがAdobeLiveでAdobe XDの最新機能をご紹介するデモを行います。ぜひご覧ください。

サードパーティのワークフローとの連携

XDで作成したデザインを、広く使用されているプロトタイピングツールとハンドオフツールで利用したいというご要望に応え、XDと、Zeplin、Avocode、Sympli、ProtoPieおよびKite Compositorとの連携を実現しました。XDで開始したデザインを使い慣れたツールと連携させることで、開発者へのハンドオフ(デザイン仕様の受け渡し)がすばやくでき、高度なアニメーションが制作できます。サードパーティ連携の詳細は、こちらのブログをご覧ください。なお、現在Mac版のみの対応しております。Windowsユーザーの方は、連携を希望するツール名をこちらからお知らせください。

https://blog.adobe.com/media_4a3d4663f617448c486ba7c3d9cca4001d801cda.gif

大容量ファイル操作時のパフォーマンスを大幅に改善

XDの基本理念として、簡略化よりも品質を重視する方針を掲げています。そのため、常にXDをできるだけ軽量かつ高速化できるよう開発に取り組んでいます。私たちは、どれだけ多くの新機能を追加したとしても、思考と同じ速度でデザインできなければ意味がないと考えています。今回のリリースでは、ズームのパフォーマンスを飛躍的に向上させ、数千枚のアートボードを含むカンバスを瞬時に遅延なく拡大縮小することができるようになりました。以下のビデオでご確認ください。

DropboxでXDファイルをプレビュー

Dropboxに保存されたXDファイルがプレビューできるようになりました。ホームアートボードがプレビュー表示されるため、XDファイルをダウンロードして内容を確認する必要がなくなりました。詳細は、こちらのブログをご覧ください。

https://blog.adobe.com/media_9e33497a7d8ae3660d2d998e0dd4dd0b77d75334.gif

カラーモデル(HEX、RGB、HSB)の切り替え

最新リリースでは、カラーピッカーのドロップダウンメニューから3種類の標準的なカラーモデル(HEX、RGB、HSB)に切り替えに対応しました。従来のカラーピッカーでは、HEXコードまたはHSB値のみが使用可能でした。カラーモデルが追加されたことで、開発者とデザインチームにカラーをより的確に伝えることができ、XDをHEX、RGB、HSBをサポートするPhotoshop、Illustrator、InDesignなどのCreative Cloudのデザインツール上でシームレスに使用することが可能になります。

https://blog.adobe.com/media_42660ead9bb6ecb1a8c8892ad0c66f565c9e0581.gif

円形グラデーション

デザインにおいて、カラーは製品の出来栄えを左右する重要な要素の一つです。マルチトーン効果は近代デザインを大きく進歩させました。今回のリリースで導入した円形グラデーションを活用することで、光源のシミュレーションや円形パターンを適用することで独自のカラー効果を簡単に作成できるようになりました。円形グラデーションでは、線形グラデーションと同じ直感的なインターフェイスでカラーストップを追加、削除および操作できます。

https://blog.adobe.com/media_2c87ffee36b80a444709a6f5c7d073a4c408e81b.gif

デザインスペック(ベータ版)の改善

デザインスペック(ベータ版)の利用とナビゲートがより効率的に行えるよう改善しました。デザインをインスペクトした際の計測値の表示場所を調整し、より読み取りやすくしました。また、キーボード操作を拡張し、タブキーでのナビゲートや+/-キーでのズームイン、ズームアウトが可能になりました。

引き続きデザインスペック(ベータ版)の改良と機能追加に取り組んでいます。今後のアップデートにご期待ください。

フルスクリーンでのアートボードの100%表示

プロトタイプを共有する際に、デザインが画面サイズに合わせて拡大縮小されるのではなく、フルスクリーンモードで実際のサイズで表示されるようになりました。これは、レビューする人が見る表示領域のサイズが予測できないWebサイトのデザインに特に有効です。実際のサイズで表示した際にデザインの一部が画面の外に出てしまう場合は自動的にスクロールされます。

フルスクリーンモードでのアートボードのスケールは変更されますが、標準ビューでは引き続き画面サイズに合わせて拡大縮小されます。将来のリリースでは、スケール設定に関するオプションを公開時に設定できるようにする予定です。

バッチ書き出し

複数のオブジェクトを一括で書き出しできるようになりました。これまでは書き出す際に毎回オブジェクトを手動で選択する必要がありましたが、バッチ書き出しでは、書き出すアセットを選択するプロセスが簡素化、効率化されました。この機能によって、サードパーティツールへの書き出しや開発者との共有が簡単に行えるようになります。レイヤーパネルのマークアイコンをクリックしてマークできます。あとは「ファイル」メニューの「書き出し」で「バッチ」オプションを選択すれば、マークしたオブジェクトだけを一括で書き出せます。


https://blogs.adobe.com/creativestation/files/2018/01/batch-export.png

Adobe XDの1月リリースはこちら、またはCreative Cloudデスクトップアプリからダウンロードしてください。

Creative Cloudデスクトップアプリに最新リリースが表示されない場合は、アドビサポートをご覧ください。

より良いユーザーエクスぺリエンスの構築および提供に、Adobe XDの拡張機能をぜひご活用ください。

UXコミュニティ

これからもコミュニケーションを続けていきたいと思います。アップデート情報は、Twitterで@AdobeXDをフォローしてください。Twitterでハッシュタグ#AdobeXDを付けて投稿すればXDチームにも届きます。また、Facebookでビデオやアップデート情報を公開していますし、Facebookライブセッション中(英語)にはご質問にもお答えします。

また、UXに関するインサイトをお届けするAdobe XDニュースレターにぜひご登録ください。

#MadeWithAdobeXD

Behanceでプロトタイプをシェアする際は、タグに#MadeWithAdobeXDを付け、使用ツールにAdobe XDを設定してください。Adobe XDニュースレターで紹介させていただく場合があります。

日本のユーザーコミュニティ

日本においても、ほぼ毎月Adobe XD勉強会というユーザーコミュニティが積極的な活動をおこなっています。最新アップデート情報や使い方のTIPSなどをユーザー同士が共有しています。

この記事は、2018/1/23にポストされたJanuary 2018 Update of Adobe XDを翻訳したものです。