ブログ

2018.05.28

photoshopとillustratorの互換性について
photoshopとillustratorの互換性について

Web制作

こんにちは。制作部の神谷です。
今回は、photoshopデータをillustratorで編集したい!というときのやり方についてです。

ホームページ制作の際、最も使用頻度が高いソフトといえば、やはりphotoshopだと思います。
ところが先日、ホームページ用に制作したデータを印刷したいから、同じものをai形式でほしい、という要望をいただきました。
ネット全盛期ではありますが、まだまだ紙媒体も必要よね…と、対応しかけたところ、なんとphotoshopからillustratorへデータを変換するやり方がわからず…;;
文章をちまちまとコピペしながら思いました。
「絶対に、もっと、簡単な方法があるはずだ…!」
無事変換終了後、調べたら案外簡単だったので、本日はそのやり方+αをお話ししたいと思います。

*やりたかったこと
Photoshopからillustratorへの変換 + 配置後のサイズの微調整 + 色彩調整

*これはダメでした!パターン集
パターン1:フォトショデータをイラレ上にドラッグ&ドロップ
結果:全てピクセルのままなのでフチがバリバリ、拡大縮小非対応、透過解除

パターン2:フォトショ機能の「書き出し→illustratorへのパス書き出し」
結果:aiファイルが作成されるも、開いたら真っ白。
慌てて調べて「アウトライン」で表示をするも色情報、レイヤースタイル共になし。

パターン3:SVGで書き出し
結果:レイヤースタイル解除

パターン4:フォトショをコピペ
結果:反応なし

という事で、1時間近く戦ってもテキストのみがなんとか画面にいる…という惨敗ぶり。
これでは1日かかっても終わらない!と、再度調べて何とか見つけました。
やり方はずばり、

「psdファイルのうえで右クリック → illustratorで開く」!!!

たったこれだけです!
このワンクリックでテキストも編集可能なまま、背景透過も効いたまま、オブジェクトがベクターに置き換わったキレイなデータが開けます!
もうこれだけで感無量でした。

しかし、まだまだ問題が出てきます。
レイヤースタイルが持ってこれない…!!!
(当然といえば当然ですが…)
今回のデータではいくつかの個所にスタイルを当てていたのですが、どうしてもベクターになりません。
これでは困る、という事で調べてみたのですが…ほぼすべてのレイヤースタイルはベクターに置き換わらないようです。
唯一、パターンオーバーレイのみ「ベクター画像+ラスター(バリバリ)パターン」というデータになりました。
よってパターンの大小の変化はないけど、外側の形のみ構うかもしれない…というときには対応できます。
ただやはり、外枠も変化を付け、中のパターンも縮めたい…!となった時は、パターンの複雑さにもよりますが、スウォッチなどにして互換性をもたせるしかないようです。
Photoshop-illustrator間はスウォッチのやり取りができるので、スウォッチさえできてしまえば後はらくちんなのですが…繰り返しパターンのスウォッチを作るのはなかなか大変だったりします。
このあたりについては、今後も何かいい方法を探していきたいと思います。

さて、今回はphotoshopからillustratorへのデータのやり取りでした。
イラレ形式のものをフォトショへ入れ込むことは多々あるのですが、その逆がこんなにも大変だとは思いませんでした。
もし、もっといい方法や、この部分はこうするともっと簡単!というやり方等がありましたらそっと教えていただけるとありがたいです。

お問い合わせ

メールフォームからの
お問い合わせ