Adobe XDに「読み込み」した、PSDやAIの元ファイルを修正したのに変更が反映されない。
PhotoshopやIllustratorのように、リンクとして配置できないの？
と言う疑問を解消します。
その手順について
- 都内のデザイン制作会社に勤務している現役デザイナー
- グラフィックデザイン歴約17年
- Webデザイン歴は約12年
の私が解説します。
本記事の内容
- 結論：リンク配置はできる。ポイントはCCライブラリにファイルを保存すること。
- CCライブラリとは？
- CCライブラリへのファイル登録方法
- PSDファイルを修正する際の注意点
- まとめ：効率的なファイルの配置・管理方法
結論：リンク配置はできる。ポイントはCCライブラリにファイルを保存すること。
ファイルメニューから「読み込み」をしたり、ファインダーからファイルをドラッグ&ドロップをしてはいけません。
リンク配置したいファイルは、一旦『CCライブラリ』に登録し、XDの『CCライブラリパネル』からファイルをドラッグしてオブジェクトを配置しましょう。
こうすることで、元のCCライブラリ上のファイルを修正すれば、変更がXDにもすぐに反映されるようになります。
CCライブラリとは？
画像・色・テキストスタイルなど、デザインする過程で使いまわしたい要素（アセット）や、複数のデバイスで共有したい要素を、クラウドスペースに保存しておける機能です。
CCライブラリへのファイル登録方法
PhotoshopからCCライブラリへの登録方法
登録したいファイルを開きます。
「ウィンドウ」メニューから「CCライブラリ」を選択します。
ウィンドウ上部にあるファイル名の部分を、CCライブラリパネルにドラッグ&ドロップします。
IllustratorからCCライブラリへの登録方法
タイトルをIllustratorで作成する前提で説明します。
ファイを開き「ウィンドウ」メニューから「CCライブラリ」を選択します。
対象のオブジェクトを選択して、CCライブラリパネルの左下にある「＋」マークをクリック。
「グラフィック」を選択して登録しましょう。
【注意】
ここで「テキスト」を選ばないようにしましょう。理由は「テキスト」ではレイヤーを持たせられないためです。
【ポイント】
「なぜレイヤーを持たせる必要があるのか？」
それは、非アウトラインのAIデータをXDに配置すると表示が崩れるため、アウトラインレイヤーを作り、非アウトラインレイヤーは非表示の状態で保存しておきたいからです。
その手順は以下の通りです。
【手順】
１：アウトライン前のデータをCCライグラリに登録
２：CCライブラリパネルから該当ファイルを開く
３：ベースのレイヤーを複製し、アウトラインを作成
４：非アウトラインのレイヤーは非表示にして保存。
以上です。
PSDファイルを修正する際の注意点
配置したPSDファイルを修正する手順に若干「クセ」があります。（慣れの問題かもしれませんが）
PSDを修正する場合は、必ず「CCライブラリパネル内のファイルをダブルクリック」してPhotoshopで開きましょう。
アートボード に配置したファイルを「右クリック＞Photoshopで編集」はNGです！
この手順だと、レイヤー情報がいなくなるんです。
ファイルが多くなってくると、ライブラリでPSDを探すのが大変なので、この方法で元ファイルを修正できると非常に便利なのですが、本記事執筆時点ではできないので、今後のアップデートに期待したいです。
まとめ：効率的なファイルの配置・管理方法
XDにPSDやAIファイルを配置する場合は、CCライブラリに保存し、リンクとして配置するようにしましょう。
こうすれば、元ファイルの変更がすぐにXDに反映されるので、「読み込み」で画像をレイアウトするよりも断然修正しやすく、数段効率アップできますよ。
今回は以上です。