【Adobe XD】作成したデータをPSDデータに書き出す方法

追記

新機能を使ってPSDに変換する方法をこちらの記事に書きました。

以下過去記事

AdobeXDで作成したデータをパーツ分けた状態で、フォトショップに持って行きたかったので試してみました。

実際にはXDにPSDの書き出し機能はないので、別ソフトをまたいでのコンバート方法になります。

AdobeXDでのエクスポート

サンプルデータを用意

• オプションボタン＞書き出し＞PDFでデータを出力します

イラストレーターでの読み込み

• 普通にPDFをインポートします（データ名つけてもすべて無くなっています…）

クリッピンググループの中に要素が入っています。

例えばこのままPSD書き出しすると、クリッピンググループは統合された状態で読み込まれます。

イラストレーターでのデータ整理と書き出し

ということで、データ整理します。

まずはクリッピングマスクを一括解除します

• Ctral+Aで全てを選択
• オブジェクト > クリッピングマスク > 解除でクリッピングマスクを一括解除
• あとは結合したい要素を選択してグループ化（終わったら選択しないようにロック）
• さらに単一のレイヤーが並んでる部分もPSD化すると結合される事があったので、要素一つでもすべてグループ化しておきます。

• 最後にファイル＞書き出し＞書き出し形式からPSD出力

フォトショップで読み込み

• 普通にデータを開きます。

イラレのデータ整理通りのレイヤー階層です。

※ちなみに文字データはもちろん画像化されてしまっています。

作成したデータをPSDデータに書き出す方法まとめ

結局UIパーツの作り込みは別ソフトになるので、AdobeXDにaiとかpsdで書き出しできる機能が欲しい。。。