ライブラリパネルビューでは、一部のライブラリを表示し、他のライブラリを質問やアイデアを共有するには、Adobe XD コミュニティに参加します。皆様からのご意見や作品をお待ちしております。
最終更新日 :
2023年2月17日
- Adobe XD ユーザーガイド
- はじめに
- デザイン
- アートボード、ガイド、レイヤー
- シェイプ、オブジェクト、パス
- テキストとフォント
- コンポーネントとステート
- マスキングと効果
- レイアウト
- ビデオと Lottie アニメーション
- プロトタイプ
- 共有、書き出し、およびレビュー
- デザインシステム
- クラウドドキュメント
- 統合とプラグイン
- XD iOS 版および Android 版
- トラブルシューティング
- 既知の問題と修正された問題
- インストールと更新
- 起動時のクラッシュ
- クラウドドキュメントおよび Creative Cloud ライブラリ
- プロトタイプ作成、公開、レビュー
- 読み込み、書き出し、その他のアプリの操作
ここでは、XD で Creative Cloud ライブラリを使用してデザインシステムを作成し、共有する方法について説明します。
Creative Cloud ライブラリでは、デザインやブランドシステムのアセットをチームで大規模に一元管理して、配布できます。
まず、XD クラウドドキュメントで、デザインとブランドシステムを構成する一連のコンポーネントとスタイルを伴う、ステッカーシートをキュレートします。より広範なチームと再利用可能なそれらのアセットを共有する準備ができれば、適切な権限により、ステッカーシートのクラウドドキュメントをライブラリとして公開して、チームを招待できます。
チームがライブラリの招待を承諾することで、ライブラリのアセットを再利用して、今後のライブラリの更新時に同期できます。
Creative Cloud ライブラリを使用する理由
Natalia（デザインライブラリの所有者）の場合
「デザインライブラリの所有者として、自分のデザインアセットとコンポーネントをライブラリに公開し、他のユーザーにデザインシステムライブラリを使用するよう促したい。」
Pedro（デザインライブラリの利用者）の場合
「デザインライブラリの使用者として、ライブラリの共有アセットをシームレスに再利用し、Natalia が共有アセットを変更したときに通知を受け取りたい。」
同じように感じたことはありませんか？ここでは、すべてのアセットとコンポーネントをライブラリに公開し、他のユーザーに XD でそのデザインシステムを利用するように招待する方法について説明します。
始める前に
必要に応じて、XD に関する以下の概念を確認してください。
リンクされたライブラリの公開と共有
ライブラリを介してデザインシステムを構築および配布するには、ソースのクラウドドキュメントのドキュメントアセットパネルでデザインシステムアセット（カラー、文字スタイル、コンポーネント）をキュレーションします。
デザインシステムアセットを定義したら、それらのアセットをソースドキュメントにリンクされたライブラリとして公開します。それらをグループと共有して、すべての XD プロジェクトやその他の Creative Cloud アプリで一貫して再利用します。
リンクされたライブラリを公開するには、次の手順に従います。
- ツールバーのライブラリをクリックし、ドキュメントアセットパネルビューを開きます。
- 「ライブラリとして公開」をクリックして、ライブラリマネージャーを開きます。
- ライブラリマネージャーで、公開をクリックします。または、新規作成をクリックして、リンクされたライブラリを公開をクリックします。
公開されたライブラリには、ソースドキュメントのドキュメントアセットパネルにあるすべてのアセットが含まれています。
注意：
リンクされたライブラリにアセットを追加できるのは、ソースドキュメントからのみですが、Creative Cloud アプリでアセットを使用することはできます。新規作成／空のライブラリを作成を選択した場合、クラウドドキュメントにリンクされていない通常の Creative Cloud ライブラリを取得します。任意の Creative Cloud アプリから通常の Creative Cloud ライブラリにアセットを追加できます。
チームライブラリの公開
Creative Cloud グループ版またはエンタープライズ版をお持ちの場合、個人用ライブラリを公開するだけでなく、チームライブラリを公開できる場合があります。チームライブラリは所有権を共有しています。
チームライブラリを公開するには、次の手順に従います。
- ライブラリマネージャーを開きます。
- 新規作成／空のライブラリを作成またはリンクされたライブラリを公開を選択します。
- チームスペースを選択し、チームライブラリを公開します。
チームライブラリとその利点については、ビジネス用の Creative Cloud ライブラリを参照してください。
ライブラリを公開すると、共有ダイアログが表示され、チームメンバーを招待できます。
- 共有をクリックして、ライブラリを共有するチームメンバーを追加します。
- 編集可能権限を設定すると、チームメンバーは新しい更新をライブラリに公開できます。閲覧のみ権限を設定すると、チームメンバーはライブラリのコンテンツを利用できますが、ライブラリを更新または変更することはできません。
チームメンバーを招待すると、メールまたは Creative Cloud デスクトップアプリを介して、ライブラリの招待を承認するよう求められます。
ドキュメントの共同編集者を編集権限のあるライブラリに招待する
クラウドドキュメントの権限は、リンクされたライブラリと自動的に同期されません。そのため、ライブラリを公開する際は、必ずドキュメントの共同編集者全員を編集可能権限
のあるライブラリに招待してください。
ドキュメントの共同編集者がライブラリに対する編集権限を持っていない場合はどうなりますか？
リンクされたライブラリは、クラウドドキュメントに 1 つだけです。そのため、ドキュメントの共同編集者をライブラリに招待しない場合、共同編集者は、ライブラリが既に存在することを知らなくても、同じドキュメントから新しいライブラリを公開できます。共同編集者が新しいライブラリを公開すると、そのライブラリはドキュメントにリンクされ、元のライブラリはリンク解除されます。
共同編集者を閲覧のみ権限のあるライブラリに招待すると、共同編集者にはライブラリを更新するオプションが表示されません。ソースドキュメントのライブラリウィンドウには、最新の状態が表示されます。
例で学ぶ
- Natalia は、XD ドキュメント Brand_Systems の所有者であり、Pedro を共同編集者としてドキュメントに招待します。
- Natalia は、ドキュメントからリンクされたライブラリを作成します。このライブラリには、Brand_Systems という名前も自動的に付けられますが、Pedro をライブラリに招待するのを忘れています。
- Pedro はドキュメントに新しいアセットを追加し、リンクされたライブラリが存在することを知らずにライブラリを公開しようとします。
- Pedro は、ドキュメントのライブラリウィンドウで「公開」ボタンを選択し、これにより、リンクされた新しいライブラリ、Brand_Systems(1) が作成されます。 Brand_Systems(1) を作成すると、元のライブラリがドキュメントからリンク解除されます。
- Natalia は、別のドキュメントからライブラリ内のアセットへのリンクが破損していることに気付きました。
元のライブラリは共同編集者によってソースドキュメントからリンク解除されたのでしょうか？ライブラリのソースドキュメントとの再リンクを参照してください。
ベストプラクティス
- リンクされた新しいライブラリをクラウドドキュメントから公開する際は、必ずドキュメントの共同編集者全員を編集可能権限のあるライブラリに招待してください。共同編集者がライブラリアセットを利用できるようにする場合にのみ、共同編集者を閲覧可能権限のあるライブラリに招待します。
- ドキュメントに新しい共同編集者を招待する際は、リンクされたライブラリに招待し、必要な権限を付与してください。
注意事項
- ライブラリを初めて公開する場合、サイズによっては公開に数分かかる場合があります。ライブラリ公開の進捗状況は、ライブラリマネージャーの進捗状況インジケーターから確認できます。
- ライブラリへの招待を初めて承諾する場合、ライブラリの同期に数分かかることがあります。ライブラリの同期状態は、Creative Cloud デスクトップアプリのクラウドアイコンをクリックして確認できます。ライブラリが完全に同期されると、XD や他の Creative Cloud アプリからもライブラリにアクセスできます。
ライブラリの利用
ライブラリの招待を承諾すると、XD や他の Creative Cloud アプリでライブラリのアセットを使用できるようになります。ライブラリのアセットを XD で使用するには、以下の手順を実行します。
共有ライブラリのアセットの使用
利用するアセットがあるライブラリをクリックします。
カラーまたは文字スタイルの適用
カラーや文字スタイルをカンバス上のオブジェクトやコンポーネントに適用し、コンポーネントをカンバスにドラッグして、リンクされたアセットにすることができます。
ドキュメント内にあるリンクされたアセットの表示
ドキュメントアセットパネルビューに切り替えると、1 つまたは複数のライブラリで使用されているすべてのローカルアセットやリンクされたアセットを表示できます。
ライブラリパネルビューでは、一部のライブラリを表示し、他のライブラリを非表示にすることができます。
- ライブラリマネージャーを開きます。
- ドキュメントアセットパネルビュー：パネルの上部にある「ライブラリとして公開」をクリックします。
- ライブラリパネルビュー：「+」または「ライブラリを管理」をクリックします。
- トグルを使って、ライブラリの表示と非表示を切り替えます。
- ライブラリマネージャーを閉じます。
公開されたライブラリの更新
XD クラウドドキュメントからライブラリを公開し、ソースクラウドドキュメント内のアセットを修正すると、最後にライブラリを公開してからの変更点が以下の方法で XD により通知されます。
- 公開済みライブラリを変更すると、アプリ内メッセージが表示され、ライブラリの更新プロセスが容易になります。
- ドキュメントアセットパネルの「ライブラリとして公開」にある青いバッジは、アップデートが発行可能であることを示します。
ライブラリへの更新を公開する準備ができたら、次のいずれかのオプションを使用します。
アプリ内メッセージからの更新
アップデートの公開準備ができたことを通知するために、アプリ内メッセージで今すぐ更新をクリックします。
ライブラリマネージャーからの更新
ドキュメントアセットパネルビューで「ライブラリとして公開」をクリックして、ライブラリマネージャーを開きます。更新をクリックして、最新のアップデートをチームにプッシュします。
ライブラリのアップデートのプレビューと受け入れ
ライブラリを更新して公開するとどうなりますか？デザインプロジェクトでそれらの更新されたリンクアセットを使用する仲間のデザイナーが、次の通知を受け取ります。
- ドキュメントアセットパネルビュー：更新が保留中のリンクされたアセット上に青いバッジ
が表示されるとともに、パネルの下部に「すべてアップデート」ボタンが表示されます。 - ライブラリパネルビュー：青いバッジ
（ドキュメントアセットの横）に、ドキュメントで保留中のアップデートの数が表示されます。
ドキュメントアセットパネルビューまたはデザインカンバスからの更新のプレビュー
リンクされたカラー、文字スタイル、コンポーネントの青い更新アイコン にカーソルを合わせます。
ドキュメント内のリンクされたカラー、文字スタイル、およびコンポーネントをすべてアップデート
青い更新アイコンをクリックするか、ドキュメントアセットパネルビューの下部にある更新をクリックします。
ドキュメントアセットとライブラリのサイズが大きい場合、検索機能とフィルター機能を使用すると便利です。
ドキュメントアセットパネルビューで、検索語を入力してドキュメント内のアセットを検索します。ライブラリパネルビューで、アクティブなすべてのライブラリ全体からアセットを検索します。
XD には、プロジェクトで使用するアセットを絞り込むための次の 3 つのフィルターメカニズムが搭載されています。
- アセットタイプ：表示するアセットタイプ（カラー、文字スタイル、またはコンポーネント）でフィルターします。フィルター結果には、ローカルアセットとリンクされたアセットの両方が表示されます。
- ローカルアセット：ローカルドキュメントアセットのみを使用する場合は、ローカルアセットフィルターを選択します。
- リンクされたアセットのソース：複数のクラウドドキュメントまたはライブラリからアセットがリンクされ、その中の特定のソースからのアセットのみを使用する場合は、目的のライブラリまたはリンクされたソースドキュメントをフィルターから選択します。
リンクされたアセットの特定のスタイルやプロパティを試して変更する場合には、各自のドキュメントでそれらのアセットを使用している他のユーザーに影響が及ばないように、リンクされたアセットをローカルアセットに変換します。
- ドキュメントアセットパネルビューで、リンクされたアセットを選択します。
- アセットを右クリックし、「ローカルにする」を選択します。
注意事項
リンクされたアセットをローカルアセットに変換すると、ライブラリ内のリンクされたアセットに変更が加えられても通知が行われなくなります。同じリンクされたアセットを持つ他の XD ドキュメントは引き続き更新を受信します。
「ローカルにする」は、ライブラリのアセットを使用する場合や、リンクされたコンポーネントをドキュメント間でコピー&ペーストする場合、またはリンクされたアセットが壊れている場合に機能します。
リンク解除されたライブラリをそのソースドキュメントに再リンクする方法について詳しくは、ライブラリのソースドキュメントとの再リンクを参照してください。
ライブラリの非公開
ライブラリが不要だと判断した場合は、ライブラリマネージャーからライブラリを非公開にすることができます。ライブラリを非公開にするには：
- ライブラリのソースドキュメントからライブラリマネージャーを開きます。
- 共有の横にある 3 つのドットをクリックして、非公開をクリックします。
ライブラリが非公開になると、このライブラリからリンクされていたアセットがリンク切れとなり、赤いバッジで示されます。リンク切れのアセットは削除するか、ローカルアセットに変換することができます。
注意事項
- ライブラリを非公開にした後、再公開しても、そのライブラリからのリンクが切れたアセットが、再びそのライブラリにリンクされることはありません。
Creative Cloud アプリで作成されたライブラリのアセットの使用
XD を使えば、お客様やお客様のチームは、Photoshop や Illustrator などの異なる Creative Cloud アプリで作成されたアセットを簡単に使用できます。着想を呼ぶグラフィックコレクションのライブラリ、Adobe Stock の画像、ソースドキュメントへリンクしない再利用可能なカラーや文字スタイルのコレクションのライブラリなどから、アセットを Adobe XD で再利用できます。
グラフィックをライブラリからデザインにドラッグすると、バッジで示される形でリンク化グラフィックになります。Photoshop や Illustrator でそのリンク化グラフィックグラフィックに変更を加えると、デザインですべてのリンク化グラフィックインスタンスが自動更新されます。リンク化グラフィックをリンク解除するには、リンクバッジをクリックするかコンテキストメニューを使用します。
ドキュメントにリンクされていないカラー、文字スタイル、グラフィックのコレクションを使って XD で同様のライブラリを作成するには、ライブラリマネージャーで新規作成／空のライブラリを作成を選択します。
注意事項
- コンポーネントをライブラリに追加するには、ドキュメントをライブラリとして公開することが必要です。
- ライブラリではカラーや文字スタイルを編集できません。
- 3D 変形グラフィックスをライブラリに追加すると、3D 変形が失われます。
ベストプラクティス
- ライブラリアセットの更新の実行、チームによるそれらの更新のプレビューと承認、およびチームによる最新の変更の確実な同期をさらに効果的に管理するため、この記事で概説されるようにドキュメントからリンクされたライブラリを公開することをお勧めします。
詳細情報
XD でライブラリを操作する方法については、以下のビデオをご覧ください。
視聴時間：6 分
次のステップ
ライブラリの公開と共有の方法を最初に説明しましたが、一歩進んで、デベロッパーとデザインスペックを共有する方法を学んで、デベロッパーがデザインを Inspect できるようにします。
ご質問または共有するアイデアがある場合
