ぱれっとLaBO

乙樹とみのる二人によるイラストのこと趣味のこと、少しでも誰かの役に立てるような事を書いてます。

ぱれっとLaBO

【illustrator】ロングシャドウアイコンの作り方チュートリアル

illustratorロングシャドウチュートリアル


【ロングシャドウアイコンの作り方】

 

 

イラストの後ろについた斜めの影、みたことありませんか?

斜めについた長い影を付けるとなんとなくかっこいい…少しおしゃれに見える気がしているのですが^^

カンタンに作ることが出来ます!

 

「ロングシャドウ」という影を使ったアイコンの作り方をillustratorを使って紹介します!

 

 

 

 

アイコンにするイラストを用意する

まずはアイコンの土台と、イラストを用意します。

アイコン部分は角丸長方形ツールで描きます。

 

illustratorロングシャドウチュートリアル

 

 

イラストと組み合わせて・・・

illustratorロングシャドウチュートリアル



アイコン素材完成です。

(アイコン土台部分は影などを入れておくとよりボタンらしくなる。今回は何も入れていません)

 

 

 

 

 

コピーして配置

アイコンのイラスト部分(クマ)を2つコピーして、斜めに配置します。

 

illustratorロングシャドウチュートリアル

 

コピーする2つのイラストは、一色に塗りつぶします。

(選択して、パスファインダーで合流 )

 

 

 

ブレンドオプション

 ブレンドオプションを使って影になる部分を一気にコピーする作業をします。

使用する前に、ブレンドオプションを設定しておきます。

 


オブジェクト → ブレンド → ブレンドオプション

 

 

 

ブレンドオプションを開いて、間隔ステップ数にし

数値を大きめの数値に入力します。

 

illustratorロングシャドウチュートリアル


 

今回はステップ数100くらいにしました。

数値が大きければ大きいほど、2つのオブジェクトの間隔に詰まる数が増えます。

数値が低すぎると間隔が開くので端がうまく繋がったように見えなくなると思います。

 

 

 

ブレンド作成

 

オプション設定が終わったら、2つのイラストを選択して

 

オブジェクト → ブレンド → 作成

 

し、つづいて

 

オブジェクト → 分割・拡張 → パスファインダーで合体(または合流)

 

 

illustratorロングシャドウチュートリアル


結合までしたのがこちら(↑画像)

 

これがシャドウ部分になります。

 

 

 

シャドウを配置する

 シャドウをイラストの下に配置します。

illustratorロングシャドウチュートリアル

 (↑今回作ったアイコン、はみ出し部分が大きすぎました)

 

シャドウ部分をアイコン部分にクリッピングして完成!

 

illustratorロングシャドウチュートリアル

 

色の組み合わせによって、かっこよくおしゃれにも可愛くもできそうです!^^

手軽に奥行きが出ていい感じです。

 

カンタンなのでいろんなロングシャドウアイコンを作りたくなります♪

 

 

 

ロングシャドウアイコン販売中

ロングシャドウを使ったアイコン、PIXTA他ストックサイトにて販売中です。

ぜひご覧ください♬

 動物の顔ロングシャドウアイコン/いつき 

 

 

 WEBロングシャドウアイコン/みのる 

  



 -ストックイラスト-

PIXTA 
PIXTAいつき PIXTAみのる

Shutterstock 
Shutterstockいつき Shutterstockみのる

Adobestock 
Adobestockいつき Adobestockみのる

istock 
istockいつき istockみのる

photolibrary 
フォトライブラリーいつき フォトライブラリーみのる

123RF 
123RFいつき 123RFみほみのる

イラストAC 
イラストACいつき イラストACみほみのる

-Twitter-

Twitter@miho_minoru Twitter@1tsuki__


©2019 ぱれっとLaBO

 お問い合わせ / プライバシーポリシー