Illustratorでミクさんをアニメ塗りする3/9(ミクの日)

イラスト/2015/03/29
20150309mikuanim

今回はIllustratorを使ったアニメ塗り(セル塗り)メイキング。相変わらず自己流まっしぐら。
イラレでの製作過程紹介はこのブログで初めて…でしょうか?

39の日にミクさんを描く様子を画面キャプチャとともに綴ります!

 

 

ミクの日2015

下描きを用意する

まずは線画作成の準備から!
01
新規作成したキャンパスに

 

02
紙にシャーペンで描いた下描きをコピー&ペーストします。
(今回はiPhoneのスキャナーアプリで取り込んでPCに送信後、イラレに貼り付けました)

 

03
線画を置いたレイヤーを「テンプレート」の設定にします。

(レイヤーオプションはレイヤーパネルでレイヤーをダブルクリックすると表示されます。)

 

下描きから線画を描き起こす

04
線:黒
塗り:透明

鉛筆ツールでなぞっていこうと思います。

 

05
Photoshopなどのペイントツールと同じくして、
下描きの線にそってなぞるように描画していきます。

鉛筆ツールの設定「精度」「滑らかさ」で手ブレをうまく綺麗に補正してくれるので、ペンタブレットが苦手な私はPhotoshopより早く綺麗になぞれます。

白矢印ツールで都度アンカーポイントとハンドルを微調整

06
白矢印ツールでアンカーポイントを移動したりハンドルの長さ・角度を変えて
思い通りの曲線になるように調節します。

(アンカーポイントの微妙な移動には十字キーもオススメ。
※十字キーで移動する単位はイラレの設定で変えられます。
微調整がむずかしければ設定をいじってみても。)

なぞる箇所によって手ブレ補正度を調整しながら

07
鉛筆ツールオプションの「精度」「滑らかさ」をいじって
手ブレ補正の度合いを調節します。

手の指など細かい微妙な曲線を表現したい箇所は数値を低く、
髪の毛などの「長くてきれいな曲線」を描きたい箇所は数値を高くします。

飛び出したところも丁寧に修正しながら

08
ざっくりざっくりなぞっているので、隙間が開いていたり
重なって飛び出してしまっているところが出てきます。

09
こういう部分は問題のアンカーポイントを掴んで

10
十字キーで移動させて引っ込めたり伸ばしたりします。

時間を急いでいるときは、こういう線画の細かい部分は妥協してしまうこともありますが、主線の精度にこだわるか否かで完成物のクオリティが大きく変わってきます。できるだけ丁寧に整えましょう!

そして線画が完成します

11 12 13 14 15 16
時々鉛筆ツールオプションの設定を変えつつ、
そんなこんなでミクさんの全身が描けました。

 

ライブペイントツールでの着色①準備

今回、色の仕分けを「ライブペイントツール」というものを使って行います。

17
まず、

1,なぞりきった線画全体を選択してグループ化

2,そのレイヤーを複製

18
3,2枚になった線画のあるレイヤーの片方をレイヤーロック

19
4,塗るのに使うもう片方のレイヤーの線画全体を選択した状態で
オブジェクト - ライブペイント - 作成 で
ライブペイントを作成する

20
ライブペイントツールで色を流し込んでいきます。
あとで色の変更は一気に簡単にできるので悩まずドンドン流していきます。

21
同じパーツは全く同じ色、
ちがうパーツは似ていてもちがう色にするように気をつけてください。

(後ほど色を基準に一括選択を利用するためです)

 

 

今回、ミクの青緑の髪の色を統一させた色にし、
服の青緑の色を髪の色とは微妙に変えて統一した色にしました。

22
すべてのパーツにベースカラーを流し込みました。
この時点でもまだ決定していない仮の色で大丈夫です。

ライブペイントを終えたら、

オブジェクト - ライブペイント - 拡張 で
ライブペイントを拡張しておきます。

これからアニメ風に影をつけていきます。

 

ナイフツールを活用して影を落としていく

23
ライブペイントを終えて拡張したあとは勝手に何段階かに
オブジェクトがグループ化されているので、線と塗りは「グループ解除」でバラバラにしておきます。

24
そういえば影に着手する前に影のない状態のレイヤーを複製して
予備としてとっておくといいですよ。

25
まず肌に影を落とすために肌の塗りを一括選択します。

どこかの肌色を選択した状態のまま、

選択 - 共通 - カラー(塗り)
で、
肌色の部分を一気に選択します。


26
こんな感じ。

28
使いますのはナイフツール

27
29 30
ナイフツールで肌色部分の影の輪郭を描いて、ぶった切っていきます。

31
そして、影になる部分だけを選択(手作業)したら
カラーピッカーで色の変更。

32
これが

33
こんな感じに。

34
選択を解除すると爽快感!アニメっぽいかも!

ナイフツールでも手ブレを補正できるので楽に線が引けてストレスフリー!

35
他のパーツも同様に、

共通の塗りで選択 - ナイフツールで影の部分を分ける - 色変更
で影を落としていきます。

(あとでよく考えたんですけど、ナイフツールの時点では
パーツごとでなく全体を選択した状態で
スパスパ切って行ってもいい気もする)

36
これを地道に続けると…
(地道と言ってもこの精度をPhotoshopとかでやると大変そうだからだいぶ楽ちん)

着彩完了!

37
ばばーん!ミクちゃんが塗れました!

髪の毛のハイライトは鉛筆ツールで新しくオブジェクトを重ねました。
(線のみで描画した後に塗りと線を入れ替えて塗りのみにすると早くて楽です)

あとの作業はPhotoshopのほうが慣れているので、
コピー&ペーストでPhotoshopに移動して背景などをつけます。

ミクの日2015
こんな感じ。イラレでもここまでを似たような感じで実現可能と思いますが、
今回は3/10になってしまいそうで急いでいたのデス…

でも結局遅刻して、TWITTERに公開出来たのは3/9を十数分過ぎた頃でした。(・ω<)てへぺろ

 

 

いま続編で鏡音リンちゃんの線画を書き終えたところです!
塗るのが楽しみだぁ〜〜

38
 

 

使っているペンタブレット(筆者の使用しているサイズはM)





Adobe Illustrator
(筆者が使用しているバージョンはCS5.1)



今週はこんな記事が人気です

santnoreは、Amazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

post date*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)