Adobe XD 画像はAdobe XD公式ページより

Adobe XD で作成したカンプデータをPSDにする方法

この記事では、少し前に登場したUXデザイン用アプリケーションAdobe User Experience (XD)で作成したデータを
PSDに変換する方法をお伝えします。

簡単な方法ではありますが、ポイントを押さえていないと、
色が変になったり、データサイズがデカすぎたりと
せっかく作ったデザインデータがWT◯な状況になり兼ねないので、
備忘録も兼ねて解説します。

前回の記事と同じく、時間ができた時にSSなどを付けて詳しく解説します。

必要なもの
・Adobe XD
・Adobe Illustrator

Adobe XD単体で契約しているケースは少ないと思いますので、
フル契約ならAIもお持ちでしょう。

オンライン上のコンバートなども有るが、思いしおかしい PSD が出来るケースも多かったので、
この方法をおすすめしたい。

1, AdobeXDでデザインデータを作成する
2, AdobeXDでデータを PDF に書き出す
ショートカットキー

Cmd / Ctrl + E

3, 書き出した PDF を AI で開く
4, ファイル > 書き出し > 書き出し形式… で、PSDに書き出す。※ここに注意点有り
– カラーモードをRGBにする
– 解像度をスクリーン (72ppi)にする
– デフォでは 150ppi になっているので大きすぎる
– レイヤーを保持
– テキストの編集機能を保持 と 編集機能を最大限に保持 にチェック
– アンチエイリアスはお好みで
– WEBデザインなどであれば、おそらく文字が多いだろうから 文字に最適 の方が良いでしょう
– IICプロファイルを埋め込む にチェックを付ける
– これをしないと色がおかしくなる可能性あり

XDを持っている先に、デザインを提出するときは XD で共有すればよいが、
まだ若いソフトなので、導入していないところも多いであろうし、
実際、PSDで要求されることも多い。
いつかXDがデファクトスタンダードとなる日が来ればありがたい。

P.S.
略称が XD なのだが、完全に顔文字でしかないので気に入ってます。

投稿者:

Alex.G.S

CTO兼プロダクトマネージャー ゲームとプログラミングが大好きです。 早くこのブログのデザイン変えたいなぁ 弊社のAlex.jsとは名前が似てるけど、別人です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です