Adobe XD 2019 年 8 月、2019 年 10 月、2019 年 11 月リリース
Adobe XD は、Web アプリやモバイルアプリケーション用の UX をデザインし、プロトタイプ化するためのベクターベースのツールです。ワイヤーフレーム、ビジュアルデザイン、インタラクションデザイン、プロトタイプ化、プレビュー、共有間の切り替えが簡単な、オールインワンの強力なツールです。
XD は、UX/UI デザイナー、インタラクションデザイナー、エクスペリエンスデザイナー、製品デザイナー、web デザイナー、アプリデザイナー、ビジュアルデザイナー、起業家など、あらゆる種類のクリエイター向けのツールです。
XD の 2019 年 11 月リリースには、次のような強化機能が搭載されています。
共同編集（ベータ版）を使用すると、他のデザイナーとリアルタイムで共同作業できるため、ワークフローがスピードアップし、作業の重複や競合が回避できます。同じドキュメントを編集している他のユーザーのアバターを見ることができ、編集内容はすべてリアルタイムでブロードキャストされます。
共同編集を使用すると、デザインチームの作業が高速化するとともに、デザインプロジェクト全体を通して信頼できる単一の情報源を維持できます。
ベータ版の機能は XD ユーザーがお試しで利用できる新機能であり、これらの機能を使用する準備を整えながら、フィードバックを送ることができます。ベータ版の機能には、品質とパフォーマンスに問題がある場合があります。
詳しくは、デザインの共同作業と共同編集を参照してください。
コンポーネントの複数のステートを使用して、様々なユーザーインタラクションに対するバリエーションをデザインできます。例えば、ボタンコンポーネントをデザインした後、ボタンにカーソルを合わせたとき（ホバー）や、ボタンを押したときのような異なるステートを作成できます。
複雑なインタラクションを実現するために、複数のアートボードを作成して接続する必要がなくなりました。
ステートを持つコンポーネントがある場合、ホバートリガーをプロトタイプモードで使用して、特定のデザイン要素の上にカーソルを置いたときにホバー効果を指定できるようになりました。
この機能を使用して、新しいレベルのインタラクティブ機能をプロトタイプに追加しましょう。
ドキュメント履歴を使用して、クラウドドキュメントで作業しているときに、保存の履歴を参照できるようになりました。場合によっては、以前のバージョンに戻して、XD ドキュメントの最後の変更を復元することもできます。
前のバージョンに戻すには、ドキュメント履歴からドキュメントのバージョンを開き、コンテンツをコピーして現在のバージョンに貼り付けます。
早速、デザイナーと協力して作業しながら、ドキュメントの進捗状況を経時的に表示しましょう。
詳しくは、デザイン改訂の管理
を参照してください。
プロトタイプモードで 1 つのデザイン要素またはオブジェクトに対して、複数のインタラクションを指定できます。
1 つの要素から複数のワイヤーをドラッグして、オブジェクトやアートボードを複製せずに、タップやドラッグなどの様々な入力のインタラクションを追加します。
インタラクションがバラバラになることは、もうありません。
詳しくは、インタラクティブプロトタイプの作成 | 概要を参照してください。
タイトル：複数のインタラクション
視聴時間：4 分
刷新されたプラグインマネージャーを使用して、XD のプラグインを参照、検出、インストールすることができます。多様なカテゴリーとコレクションのプラグインを参照して、特定のプラグインや用語を検索します。また、各プラグイン、説明、言語サポートなどの情報が豊富なプロファイルリストを表示します。
詳しくは、以下の XD のプラグインを参照してください。
タイトル：刷新されたプラグインマネージャー
視聴時間：2 分
新しい共有モードにより、共有機能が一元的な場所に統合され、デザインの共有や、仲間のデザイナーとの共同作業が容易になりました。デザインレビューと開発のような組み込みのシナリオベースのプリセットを組み合わて、共有リンクを管理または更新する方法を完全に制御できます。
刷新された新しい共有モードの利点についての詳細をご覧ください。
詳しくは、デザインおよびプロトタイプの共有を参照してください。
タイトル：共有モード
視聴時間：3 分
Creative Cloud ライブラリにアクセスして参照して、コンポーネント、グラフィック、カラー、グラデーションおよび文字スタイルなどのアセットを XD から Creative Cloud ライブラリに追加します。また、XD 内や XD プロジェクトで直接使用できます。
XD アセットを CC ライブラリに追加して、他の Creative Cloud アプリケーションで使用することもできます。
ブランドカラー、グラフィックス、ロゴなどの共有アセットを使用して、組織内のクリエイティブチームと繋がります。
詳しくは、XD 用の Creative Cloud ライブラリを参照してください。
デザインシステムで作業するときに、再び作り直すことなく、Sketch アセットを読み込んで再利用できます。
Sketch のシンボルと要素は XD コンポーネントに変換されるだけでなく、リンクされたアセットとして使用することもできます。
詳しくは、Sketch ライブラリの変換を参照してください。
XD の 2019 年 10 月リリースには、次のような強化機能が搭載されています。
XD 23.0 以降では、非破壊的なブレンド効果を適用して、画像またはグラフィックアセットのスタイルを設定できます。
ブレンド効果を使用すると、オブジェクトのカラーとその下にあるオブジェクトのカラーのブレンド方法を変えてデザインを変化させ、デザインに活気を与えることができます。
ブレンド効果の適用について詳しくは、ブレンド効果の適用を参照してください。
XD 23.0 以降では、これらのキーボードショートカットと矢印キーを組み合わせて、UI 要素の位置とサイズをグリッドサイズ単位で正確に制御できます。
正方形グリッドが有効な場合：
デザインモード
XD 23.0 では、command キーを押しながらクリックまたは Ctrl キーを押しながらクリックのキーボードショートカットのビヘイビアーが拡張され、デザインカンバスとデザインスペック上で、Z 軸の上から順に次々とオブジェクトを選択できるようになりました。目的のレイヤーに移動したら、キーボードを使用して微調整したり、右クリックして対応するコンテキストメニューを表示したりできます。
複数のレイヤーが上下に積み重ねられている場合、command キーを押しながらクリックまたは Ctrl キーを押しながらクリックすると、選択したレイヤーの下にある次のオブジェクトが選択されます。一番下のレイヤーに到達してからさらに同じキーボードショートカットを使用すると、最上位レイヤーに戻ります。
デザインスペック
デザインスペックでレイヤーの下に隠れているレイヤーを表示して確認するには、アートボード上の特定の領域にカーソルを合わせて右クリックします。これにより、レイヤーのリストと、そのピクセルポイントでのコンテキストの詳細が表示されます。command キーを押しながらクリックして、レイヤーのプロパティを上から順に次々と表示することもできます。
重なり合うレイヤーへのアクセスについて詳しくは、オブジェクトのサイズ変更と回転を参照してください。
XD の 2019 年 8 月リリースには、次のような強化機能が含まれます。
XD では、Adobe Photoshop との統合が強化されました。これにより、Photoshop で直接 XD 画像を開いて編集し、リアルタイムでそれらを更新できます。Photoshop で画像を編集して保存すると、XD により統合されたファイルが保存され、（編集されたファイルではなく）ビットマップが XD に配置されます。
詳しくは、外部アセットの操作を参照してください。
視聴時間：3.20 分
XD の最新リリースでは、デザインカンバスと共に、XD ユーザーエクスペリエンス内から直接 XD プラグインを起動して操作できます。レイヤーおよびアセットパネルと同様に、新しいプラグインパネルでは XD 内からプラグインを簡単に表示して変更できます。これにより、XD デザインの作業中にクリエイティブフローを維持できます。
詳しくは、プラグインの表示とインストールを参照してください。
視聴時間：4.30 分
デザインの機能的な Web サイトへの変換を簡単にするために、デザインスペックから CSS コードスニペットをコピーして、コード内に貼り付けることができます。
CSS コードは、デザインスペックの公開時に開発用に共有ウィンドウで出力先として「Web」を選択した場合、自動的に生成されます。デザインスペックを公開すると、XD によって、選択したレイヤーの CSS コードスニペットが自動的に表示されます。
詳細については、XD でデザインスペックを確認するを参照してください。
視聴時間：2.58 分
コンポーネントでは様々なオーバーライドがサポートされ、様々な画面サイズに合わせてシームレスにサイズ変更されますが、効果を適用したりオブジェクトを再編成したりする際に使用が困難になる場合があります。以前のバージョンの XD では、元のマスターコンポーネントの境界外にオブジェクトを追加すると、コンテンツが切り取られました。
コンポーネントの境界に関する問題の解決策として、マスターコンポーネントを選択し、右クリックして「境界をコンテンツに合わせる」を選択します。コンポーネントの境界は、インスタンスだけでなくマスターコンポーネント内のすべてのクリップされたオブジェクトを表示するように調整されます。
コンポーネントを新規作成する場合：
視聴時間：4 分
HiDPI 画面用に設計する場合、フラクショナルピクセルによりコンテンツが歪みます。XD 22.0 以降では、デザインの摩擦や画像の歪みをなくすために、オブジェクト、コンポーネント、画像マスクのグループのサイズを変更するときにピクセル値が丸められます。ただし、XD 22.0 より前に作成したコンテンツの小数値は XD により保持されます。
視聴時間：3.20 分
すべてのアートボードのレイアウト情報を含むデザインフローの全体像を把握するには、画面の左上にあるプロトタイプ名またはデザインスペック名をクリックします。デフォルトのグリッドビューから、グリッドビューとフロービューの間を切り替えて、次を表示することもできます。
詳細については、XD でのデザインスペックのナビゲートを参照してください。
