doors doors

Illustrator|画像効果

Illustrator|画像効果

Illustrator|画像に可逆的効果を与える

WEBデザインや印刷物デザインを行う場合にIllustrator(以下、AI)を使いますが、画像に効果を加える場合にPhotoshopへ移行するのも面倒です。
上の画像に下の画像のような効果を加えるのをAIだけで行う方法をご紹介します。

アートボードの大きさは任意です(今回は画像とほぼ同じ大きさにしています)。
画像と同じ大きさのオブジェクトを作り、画像にクリッピングマスクを設定します。
クリッピングマスクにするのは後で説明するメッシュオブジェクトを内包するためです。グループ化でも良いですが、意図せずグループ解除した場合に面倒です。

クリッピングされたオブジェクト(画像)は、クリッピンググループになるので画像をダブルクリックするとグループ内レイヤーに移行します。

クリッピンググループ内にメッシュオブジェクト用の矩形を作ります。矩形のサイズは画像より大きくても構いません。黒の矩形の下に画像が配置されている状態です。

メッシュツールで対角線に2点ほどクリックしてメッシュを作ります。メッシュツールはクリックした点を縦横の交点とするので、見た目は4つの点がオブジェクト内にできています。

4つの点、それぞれに色を設定します。周囲の点(ポイント)は黒のままですが色を変更しても構いません。

最後にメッシュオブジェクトのレイヤー効果を変更します。「スクリーン」「乗算」など試してみてください。
この状態はPhotoshopのレイヤー効果と同じ状態なので、メッシュオブジェクトを削除すれば元の画像になりますし、メッシュオブジェクトの色を変更することで違う効果を加えることもできます。
また、メッシュオブジェクトを残して画像を変更すれば、同様の効果を別の画像に与えることも簡単です。

関連記事

【デザイン脳への道】#01|カラーリングとキーワード

こんにちは。犬の事ばかりじゃないか!とお叱りを受けそうなので、この辺りでデザイナー的なハナシでも。。昭和から平成を股にかけデザインをオシゴトにしてきた中でこんな...

AfterEffectsでボーリングやってみよう

最近無性にボーリングがやりたくなる自分です。昔のようにパワーがないので、行く人に声かけて、グループ分けして、賞品考えて… なんてことを考えると急に億劫になってし...

Photoshop|画像アセット

Photoshop|画像アセットで一括管理 Illustratorにもアセットの書き出し機能があり、WEB制作では非常に便利です。Photoshop(以下PS)...

WEB:企業サイト、PRサイト、ランディングページ、バナー制作やCMS構築、モーショングラフィックス、VP、動画制作、パンフレット、ポスター、チラシ、DMなど制作から印刷・納品まで。 お気軽にお問い合わせください。東京・名古屋近郊の打合せもご相談ください。

花粉症との戦い

花粉症の季節がやってきてしまいました。 今年は去年より多いそうで、筆者は戦慄して...

進化したGoogle レンズ

写真や画像に関連する情報を取得したいなら、「Googleレンズ」が便利です。 こ...

もうすぐ節分!ことしは2月2日

早いもので1月があっという間に過ぎ、2月を迎えようとしています。 2月といえば節...

右横文字のアイキャッチ画像

はたらくクルマの“右横書き”に見る、風習や習慣の変化について。

トラックや業務用車両の右側面によく見かける、右から左に向かって書かれている「右横...