下塗りをやってみよう~ゲーム画面を彩る職人CGグラフィッカーの第一歩~

下塗り

CGグラフィッカーって?

みなさん、こんにちは! 採用推進大使の小玉です。

さて、今回は「CGグラフィッカー」というお仕事をご紹介したいと思います。

絵を描くのは好きでCGグラフィッカーにも興味はあるけど、具体的にどんな感じで作業していくの?

という方、多いのではないでしょうか?

そんなわけで、ここでは分かりやすくその流れをお教えしましょう!

CG製作の流れ

CG制作

 

こうして並べると、1枚のCGを仕上げるのに多くの作業工程を踏まなければいかないことがわかります。

CG制作過程では、上記の流れを、チームで分担しながら進めていきます。

1枚の絵であっても、たくさんの人の協力があって初めて良いものができるのです。

 今回はこの中で、慣れてしまえば誰にでもできる「下塗り」にフォーカスを当てていこうと思います!

これは基本中の基本になる大事な作業になります。

丁寧にご説明していきましょう!

Photoshopの使い方

下塗りはPhotoshopのペンツールを使用し、パスを使っての作業になっていくのですが、まずはPhotoshopの説明から行いましょう。

Adobe Photoshop CC 12か月版 (最新版)
アドビシステムズ (2013-10-18)
売り上げランキング: 1,212

Photoshopとは画像編集に特化したソフトであり、パスや色調調整、フィルターなど、塗りにも加工(効果)にも便利な機能が充実しています。

CG制作においても、下塗りはPhotoshop、彩色にもPhotoshopを多用することもありますが最近はsaiをメインで使用するメーカーさんが多いようです。

それでも、最終的な調整はPhotoshopで……というのが一般的なようです。

もしPhotoshopをお持ちでない方は是非体験版をダウンロードしてみてください!

https://creative.adobe.com/ja/products/download/photoshop

そうそう……安価なPhotoshop Elementsというシリーズもあるのですがこちらのソフトウェアはパスを使用することができませんのでご注意ください。

Adobe Photoshop Elements 12 Windows/Macintosh版
アドビシステムズ (2013-10-11)
売り上げランキング: 22

 それでは、Photoshopを立ち上げてみましょう。ツールボックス

 

下塗りにはここのツールボックスにあるペンツール(ペン先のようなアイコン)を使用します。

ペンツール

ツールボックスが表示されていない場合は一番上の右から二番目にある【ウインドウ】から【ツール】を選択し、表示させてください。

 次にペンツールの使い方をご説明します。

 1、最初に点を取りたい場所をクリックします。

パス

 

 

 

 

 

 

 

 

 

2、次に点を取りたい位置をクリックしてドラッグ

パス

 

 

 

 

 

 

 

 

 

3、真ん中のアンカーポイントをAltを押しながらクリックするとポイントが消えます

パス

 

 

 

 

 

 

 

 

 

4、2~3を繰り返しながらパスで選択範囲を取っていきます

 パス

 

 

 

 

 

 

 

 

パス

 

 

 

 

 

 

 

 

 

 

5、取り終えたら、パスウインドウの下、左から三番目のアイコン【選択範囲として読み込む】をクリックし、

選択範囲を作成します。(パスウインドウが無い場合は一番上の右から二番目にある【ウインドウ】から【パス】を選択して、ウインドウを表示させてください)

パス

 

 

 

 

 

 

 

 

 

 

 

パス

 

 

 

 

 

 

 

 

 

選択範囲として読み込んでいる間は、点線で表示されます。

 

6、ツールボックスの一番下から3番目のカラーピッカーから色を選択し、Shift+F5で塗りつぶします。(塗り終えたらCtrl+Dで選択範囲を解除できます)

描画色の変更

 

 

 

 

 

 

 

 

 

 

パス

 

 

 

 

 

 

 

 

 

お次は小玉が下塗りの一部を体験!

 

下塗りをやってみよう

 

それでは、実際に下塗りに入る前に覚えておくと便利! なショートカットキーも幾つかご紹介しておきましょう。

役に立つ、ショートカットキーたち

 

その1:Ctrl + space

 

……拡大できます。

 

その2:Ctrl + Alt + space

 

……縮小できます。

 

上記の二つを組み合わせて、線からはみ出さないように、確認を取りながら作業を進めていきます。

 

その3:Shift + F5

 

……塗りつぶしできます。

 

一気に色が塗れるから、便利!

 

 

これらを覚えておくだけで、作業効率がぐぐっとアップしますよ!

 

というわけで、早速チャレンジ!

先輩CGグラフィッカーの渡邉さんに教えてもらいます。どきどき!

線画

 これは下塗りする前の画像です。

 

まだ真っ白ですね。線だけです……。

 

この白いキャンバスが、いったいどのようになっていくのか、楽しみですね!

さあ、下塗りをがんばりますよ!

 

 

先ほどのペンツールを使い、

今度は基本的には線画の線にそって、パスを取り、同じように色を置いていきます。

下塗り

 

 

 

 

 

 

 

 

 

その際に注意するのが、パーツごとにレイヤーを変えるということです。

レイヤーというのは、もともと透明なもの、色を置いた場所以外は透明なままです。

それを利用して、レイヤーを重ねていくようにして下塗りをしていきます。

レイヤー構成

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

なぜレイヤーをパーツごとに変えるのかというと、彩色の際に、影などを塗りやすくするためです。

下塗りをした上に新しくレイヤーをつくりCtrl+Alt+Gを押すと、

このように表示され(クリッピングマスクといいます)、下のレイヤーの塗った部分しかぬることができなくなります。

 

クリッピングマスク

 

また、肌など下に来るレイヤーはわざとはみ出して塗る事でレイヤー同士に隙間が出来るのをふせぐことができます。

下塗り

そんなわけでレイヤーを重ねながら作業し、終了。

 

 

※下塗りの最初に塗る色は、はみだしがあった場合のわかりやすくするため、奇抜な色をしています。

全部塗り終えたら、このように、Ctrlを押しながらレイヤーの窓をクリックすることで、

選択範囲の取り方

選択範囲として読み込んで新しく色で塗りつぶし、色を変えることができますのでご安心を!

下塗り

塗り塗り、ぬりぬり、ヌリヌリ、NURINURI…………。

 シナリオの小玉、現在下塗り作業に燃えております(笑)

 さて、気になる完成は……。

初めての下塗りは

 

こちらっ!

下塗り

 

今回初めて下塗りをやってみたのですが、

だんだん作業を進めていくうち、何もない真っ白なところに命が吹き込まれていくような……

そんな思いを感じました。

全体の作業のほんの一部分でしたが、人生の道筋に残るようないい体験をすることができました!

いえ、大げさなことは何も言っていませんよ?

そのくらい、楽しかったってことなんです!!

ビバ、下塗り!

こうやって下塗りの後、彩色から効果の作業を経て、

1枚のCGが完成するのです。

ちなみに、最終的な完成系はこちら↓

 

CG

 

 

やっぱり光や影が入ると、雰囲気ががらっと変わりますね!

キレイです!

まとめ

 最後に、下塗りの際の注意点をば。

下塗りは、はみ出し厳禁。ここではみ出してしまうと実際に仕上がるイラストも汚く見えてしまいます。

丁寧に作業していきましょう。

今回のお仕事紹介で、CGグラフィッカーという仕事にもっと興味を持って下さったなら幸いです。

では、小玉とはこのへんでお別れです。

また逢える時まで……。

私が体験したCGグラフィッカーの業務内容、インターンシップの中身

こんにちは! 今年の4月からひつじぐもの社員になりました渡邉といいます。イラストを描く仕事がしたい!という思いを胸に、在学中の就職活動を経てひつじぐもへ入社しました。

まずはインターンシップ

昨年の10月15日からインターンが始まりました。

実際にインターンが始まるまでには、書類選考・実技専攻などを通過しなければなりません。

本当に自分にやれるのかと、PhotoShopの機能を復習しつつ、やや緊張気味に初日を迎えました。

時期はちょうど【女王蜂の王房~めのう編~】の制作中!

忙しい中でも先輩にはいつも丁寧に教えていただきました。

先輩のご指導のおかげもあり、2週間後には無事内定をいただきインターン生を卒業、アルバイトとして働けるようになりました!

作業開始

インターン初日はCGの下塗りからです。

下塗りはPhotoShopのパスを使い塗り分けていきます。焦らず丁寧にしていくことがコツです。

レイヤーの構成や色パレットの存在を教えてもらいつつ、初日は2~3枚が限界でした。

もっと早く手を動かせるようになろうと決意をかため、

先輩にいただいた大事なことを忘れないようにメモを取り1日目終了。慣れていくと、だんだんとペースも上がって自然と枚数をこなすことができるようになりました。

数日後には、待ちに待った背景作業を任せてもらえる事になりました。背景を描くことが人物の次に好きな私は気合を入れ頑張ります。

まずは色つきのラフを簡単に書いて、先輩に見てもらいます。

そこでパースの狂いはないか、汎用背景との違いはないか、人物との大きさの対比は確かかなどを確認してもらいOKが出たら線画に入っていきます。

そして彩色まで終わったら、もう一度先輩にチェックをもらいます。

そこでおかしなところや違和感があれば再度修正、OKが出るまで何度も繰り返します。

最初に描いたCG背景は床でしたが2ヶ月後には難易度の高いものも任され、描き上げていました。見比べてみると自分の成長をひしひしと感じます。

彩色作業

初めて背景を任されてから数日後、人物の彩色も任せていただけるようになりました。

人物の塗りは、筆の設定から塗り方まできちんと設定されており、頭ではわかっていても実際に塗りに入るとどうしても髪の毛が難しく、頭部だけで3~4回塗りなおすということもありました。

それでも何とか、枚数をこなすうちに慣れていきます。

その後、適切な効果の入れ方なども習い、一通りの作業をこなす事ができるようになりました。

そしてついに、デバックに突入です!

CGの表示に間違いはないか、差分がきちんと切り替わるかなどを確認し、タイトルの作業終了となります。

デバックもなかなかの集中力が必要で、彩色や背景作業よりも腰や肩にきます(笑)

原画家さんの線画に色を塗って背景をつけるという作業は世界そのものを構築し色をつけていくようで、難しいですがとても楽しいです。

日々勉強ですが、「アンタの絵を眺めていたら一日が終わったわ!」といっていただけるようになることが今の夢です。

これからは社員として、皆様に元気になっていただける、愛していただける作品を世に送り出していけるようひつじぐもと一緒に頑張っていきます!