Illustrator→Photoshopに展開する際にレイヤー構成を残したままシェイプパスとしてペーストする方法

Illustrator→Photoshopに展開する際にレイヤー構成を残したままシェイプパスとしてペーストする方法をスピードアートにしたマニアックな内容です。

Illustratorで作成したベクトルデータをコピー、Photoshopでペーストする際に、ペーストオプションの「レイヤー」を選択するとシェイプパスとしてレイヤー構成を残したままデータを引っ張ってくることが可能です。

私の場合、Illustratorで原型を作りPhotoshopでブラッシュアップを行うことが多く、シェイプパスだとIllustratorとデータを行き来させる必要がなくなるためこの方法を活用することがあります。

制作の流れ

主な工程としては、

  1. Illustratorでデータを作成、コピー
    →効果・線をなくすためアピアランスを分割、パスのアウトライン(線はお好みで)
  2. Photoshopでペースト
    →ペーストオプションのラジオボタンをレイヤーに
  3. Photoshopでシェイプパスを色変更

となります。

制作ポイント

IllustratorのデータをPhotoshopでレイヤー分けされたシェイプにするための仕様

  • Illustratorのシンプルな線・塗りの構成の場合のみPhotoshopでシェイプパスとして活用可能
    →Illustratorの線はそのままPhotoshop上で線として活用可能
     →波線もそのままPhotoshopで波線として使えます
     →線として活用するかアウトライン化して塗りにしておくかはケースバイケース
  • Illustratorのアピアランスに効果を含むとラスタライズされる
  • Illustratorのアピアランスの線・塗りを重複させるとラスタライズされる
コネクリ

ウェブデザイナーとしてキャリアをスタートして、スマートフォンの台頭によりUI/UX・ゲームデザインを担当、現在はインハウス寄りのディレクター兼リードデザイナー。
社内外のディレクション・ワイヤー設計・デザイン・コーディングを行う。
自社、受託ともにウェブ・アプリ・グラフィック・ゲームの実績多数。

本サイトやTwitterYouTubeにてPhotoshopとIllustratorの作例を発信中!

個人としての仕事は、動画制作「【アーティストに学ぶ】#33 Adobe Illustrator iPad版 xコネクリ – アドビ公式」、オンラインセミナー「光と色をコントロールすることで デザインのディテールを追い込む Photoshop & Illustrator」、著書「デザインのネタ帳 プロ並みに使える写真加工 Photoshop(MdN/共著)」など。

おすすめ書籍

PhotoshopやIllustratorの使い方についての書籍ではありませんが、イラストを主軸に活動している方は元よりデザインに関わるすべての方におすすめできる書籍です。

どちらかというと中~上級者向けの書籍で、光が色に及ぼす影響や配色の理論から技術的なテクニックまで根本から学べます。

私はディレクションすることも多々あり、今まで感覚的に伝えていた部分の言語化に大いに役立てることができました。

PREVIOUS POST スタンプをつくろう - 応用編 -!鳥シルエットのタイポグラ...
NEXT POST 4/10はフォントの日!様々なフォントを使ったタイポグラフィ...
PAGE TOP