Adobe XDベータ版6月リリース！シンボルのオーバーライドと一括更新など

Adobe XD アップデート

夏が来ました！仕事を休んで天気を楽しむ間も、素晴らしいデザインは生き続けています。デザインワークフローを加速させる、いくつかの新しい方法をmacOSとWindows 10向けにご提供できることを嬉しく思います。

Mac版とWindows版の新機能

シンボルのオーバーライドと一括更新

UXデザイナーは、ボタン、ナビゲーションバー、スライダーや、デザイン全体で繰り返し使用するその他たくさんのコンポーネントを作成します。しかし、デザインは、急に変わることがあります。シンボルは、時間を節約し、スムーズな作業を可能にします。Adobe XDの6月リリースでは、個々のシンボルインスタンスのテキストとビットマップをカスタマイズできるようになり、より柔軟なデザインが可能になります。個々の変更をシンボルのすべてのインスタンスに適用する場合、コンテキストメニューから「すべてのシンボルを更新」を選択して、その変更を適用できます。シンボルのオーバーライド機能の概要については、Macチュートリアル（01:49～）またはWindowsチュートリアル（09:37～）を参照してください。

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

Windows版の新機能

シンボル（オーバーライドと一括更新を含む）

Windows 10にシンボルが導入されます。アプリケーションウィンドウの左下隅のアイコンをクリックするか、ショートカットキー（Shift+Ctrl+Y）を使用して、「シンボル」パネルにアクセスします。シンボルを作成するには、キャンバスのオブジェクトを選択して、パネルの「+」をクリックします。次に、Ctrl+Kを押すか、コンテキストメニューから「シンボルを作成」を選択します。オブジェクトのハイライトカラーが青から緑に変わり、オブジェクトをキャンバスで複製、またはパネルからドラッグして、リンク付きのインスタンスを作成できるようになります。インスタンスのシェイプ、ポジションまたはスタイル/プロパティを編集すると、すべてのインスタンスがすぐに更新されます。シンボルの機能の詳細については、Windowsチュートリアル（09:37～）を参照してください。

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

線形グラデーション

今回のリリースでは、XDでベクトルオブジェクト内の線形グラデーションを作成および編集できます。また、IllustratorのグラデーションをAdobe XDへコピー＆ペースとすると、カラーストップなどを含んだグラデーションを簡単に利用できます。線形グラデーションを作成するには、グラデーションを適用するオブジェクトを選択し、カラーピッカーを開いて、塗りタイプで「グラデーション」を選択します。グラデーションがオブジェクトの既存のカラーに基づいて表示されます。ポップアップ上部のバーでカラーストップを追加、選択、移動、削除して、グラデーションをカスタマイズできます。好みのカラーピッカーおよび外観コントロールを使用して、各ストップカラーおよび透明度を変更します。

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

グラデーションは、キャンバス上で直接操作することもできます。ベクトルオブジェクトの塗りを「べた塗り」から「グラデーション」に変更してグラデーションを作成すると、コントロールラインがシェイプ内（キャンバス上）に表示されます。このコントロールラインを使用すると、グラデーションの終点や角度を調整できます。また、新しいカラーストップを追加し、コントロールラインに沿ってスライドさせ、位置を調整することもできます。

美しいグラデーションの作成を楽しんでください。完成した作品は、#MadeWithAdobeXD のハッシュタグを付けてTwitterで公開してください。

レイヤーのドラッグ＆ドロップ

先月Windows版のレイヤー機能を導入しましたが、そのレイヤーパネルをさらに使いやすくする拡張機能、ドラッグ＆ドロップを追加します。これにより、レイヤーパネル内から、アートボードのオブジェクトのZオーダーを変更できるようになります。パネル内でレイヤーをドラッグ＆ドロップするだけで、キャンバス上で直接、レイヤーの順序を変更できます。ドラッグ＆ドロップ機能では、新しい要素を既存のグループに追加することもできます（Windowsチュートリアル（04:42～）を参照してください）。レイヤーについてのご意見や、さらに使いやすくするためのご要望をUser Voiceからお寄せください。

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

テキスト範囲スタイル

6月リリースでは、さまざまなテキストスタイルをエリアおよびポイントテキスト内で作成できます。スタイルを変えたいテキストの一部を選択し、プロパティインスペクターを使用して、選択したテキストの書体、サイズ、文字間隔、カラーをカスタマイズできます。

ビットマップをクリップボードにコピー

XDからのコピーを別のアプリケーションにペーストできるようになりました。アートボード、要素またはグループを選択すると、システムのクリップボードにビットマップとして保存され、これを他の多くのアプリケーションで利用できます。

XDでは、毎月何かが新しくなります。今後のアップデートにもご期待ください。XDを利用して、User Voice、FacebookまたはTwitterからご意見をお聞かせください。

ソーシャル

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

Adobe XDを使っているUXデザイナーをこちらで紹介しています。UXデザインの始め方、進め方、実際の作品に加え、作業中に聞いている音楽もわかります。ぜひご覧ください。

#MadeWithAdobeXD

Behanceでプロトタイプをシェアする際は、タグに #MadeWithAdobeXD を付け、使用ツールに Adobe Experience Design を設定してください。Adobe XD Newsletterで特集される場合があります。

ヘッダー画像 (XDで制作): Norah Park

この記事は、2017/5/13にポストされたJune Update of Adobe XDを翻訳したものです。