メニュー

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

目次

追記

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

あわせて読みたい
【Unity】AdobeXDで作成したデザインをUnityへコンバートする方法 Unity #2 Advent Calendar 2018 10日目の記事です。普段はさまざまなDCCツール(Digital Content Creationの略。PhotoshopとかMaya等のツール)を扱っているので、今回は...

以下過去記事

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

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

AdobeXDでのエクスポート

サンプルデータを用意

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Adobe XDに関する参考記事・ツール・書籍のまとめ

Adobe XDに関する記事を下記にまとめました。

Adobe XDのソフトウェア購入

Adobe XDの参考書籍

この記事も読まれてます

目次
閉じる