背景の描き方~現代編~




自作ゲームで最も用意するのに苦労するもの。それはずばり背景でしょう。 音楽や効果音なら素材でありますし、キャラクター画師さんなら探す事もできますが、 背景となると写真ばかりで、実際イメージぴったり!なものを探すのは難しい事と思われます。 という訳で、ここでは背景に苦労しているどーじんゲーム制作者の皆様に、私流背景の描き方をお教えしたいと思います。 あくまでも同人の領域ですので、上の完成品を見て、「フッ、この程度か」と思われた方は読むだけ時間の無駄です。 なお、ここもう少し詳しく解説してくれっ!と言うのがありましたら、素材系掲示板までご意見およせ下さると助かります。 ちなみにこの講座はフォトショCS英語バージョンを使用してお送りします。ペンタブ必衰です。


それでは、いざ、参りましょう。



1:写真選び

さて、背景画像と聞いてまず思う事は、しんどそう、時間がかかりそう、っつーか3D空間わかんないからっ!と いう事かと思われますが、しんどいのは否定できないとして、時間と3D空間はある程度誤魔化す事ができます。 妥協と適当を許す精神が大事です。(爆)という訳で第一歩。

写真を用意します。(爆)これを基本にしてアナログっぽく掘り起こしていく ので写真は良いものを選んでください。写生と同じなんで著作権を気にする必用は無いと思いますが、心配なら適当にパーツを変えておきます。 ちなみに突っ込まれた時の為、この写真は買った素材なので著作権云々を気にする必用は最初からありません。(爆) なるべくイメージに合った写真を選びましょう。現代モノは特に楽ですね。


2:ラフ画

写真が用意できましたら、その上に新規レイヤー(Shift+Ctrl+N)を作成。 写真の背後に白で塗りつぶしたレイヤーを設置し、写真の透明度を30%ぐらいになるまで下げます。邪魔にならない程度にうっすらと写真が 見える状態で、一番上のレイヤーにラフ画を起こして行きます。この辺でイメージに合わないパーツを書き換えたり、付け足したりします。 ザッカザッカとペンタブで3pxぐらいのペンを使いラフ描きます。 なるべく丁寧に書いた方が良いのですが、面倒なので私は見て解る通りかなり大雑把です。(爆)



ちなみに、実際に使うサイズの二倍のサイズで描いております。800×600の背景を利用する予定でしたので、今回の解像度は1600×1200です。 メモリー1GBは無いと厳しい作業となります。(^^;




出来上がりはこんな感じ。ちゃっちゃかと次行きましょう。


3:べた塗り

うぉい、清書はどうした!?∑( ̄口 ̄;)と思われた方。ご心配いりません。
そんなモノ描きません。(爆) ぶっちゃけ面倒だしゲーム制作で最も無いのは時間なので、私は最初描かず、どうしてもキレの無い部分にだけ後で描き足します。



でっかくてのっぺりした物からベタ塗って行きます。先ずは壁。パスツールでパスを引き、 絵のように、パスの下にある塗りつぶした○までドラッグアンドドロップすると、パレットの背景にあったカラーが塗られます。 色は後でいくらでも変えられるので、イメージが無ければ適当でOKです。
こんな感じに出来上がります。 壁は全てにおいてレイヤーを分けた方が楽です。絵が小さくて見にくい場合は、クリックして原寸をごらん下さい。
ベタ塗り終了。小さい小物や細かいパーツなど、パスツールで取りにくい部分は無視して、後で付け足します。


3:ベッドを描く

えー、影付けです。ここまでで大体消費時間は3時間ぐらい。遅いですが、私は基本的に絵が描けないので、ここに来るまでの段階で、 何度も画像を反転させ、物理的にどーみてもおかしいだろっ!∑( ̄口 ̄;)っと言うような部分はちまちまと修正してます。 凡人相手ならごまかせそうだわ。と思う程度の設計ミスは黙します。<待て

さて、先ずは一番簡単なベットの影付けから始めます。全ての影つけに共通する事ですが、時間を短縮させる為、最低限にしか影はつけません。 基本は三つ。Shadow,Midtone,highlightの三つです。濃い影、薄い影、ハイライト。先ずは 一番深い影を右の絵のように、適当に描きます。クリックして拡大させると解りますが、見事なまでに大雑把に描き込んでます。 所要時間3分以内でキメテ下さい。(爆)
さて、影付けに最も重要なのは、ブラシのセッティング。 右上にあるBrushパネルをドロップダウンで選択し、筆圧チェックを、サイズと濃度にチェックします。 この場合、shape Dynamics と Other Dynamicsですね右にある鍵のような絵をクリックすると 設定をロックする事ができ、何度も変更しなくても良くなります。
筆をセッティングして、影付け適当にしたら、 指ツールを選択肢、雑な筆さばきを滑らかにして行きます。(笑)
えー、うっかり途中過程保存するの忘れました。(爆) ので突然ですが、最終形態。薄い影とハイライトを筆圧セッティング同じで描きいれ、なんか寂しかったので、パターンをオーバーレイで乗せました。 クリックで拡大できます。


4:窓を描く。

パーツが多いので、特にひねりのない部分は飛ばして行きます。次はパスを使った塗りをやってみましょう。

機械的な部品は、パスツールで描く事が多いです。ふにゃふにゃっとしたアナログも良い雰囲気を持っているのですが、 背景が個性を持つと、凡庸度が下がるので、あえてきちんと描きます。先ずはパスツールで窓枠をてっとり速く描き起こし、 下図のようにできたパスを○印までドラッグあんどドロップして、パスを描写します。 ちなみに、ドラッグした時にパレットで選択されていたツールで、パスを描写します。ので、私は最後に円形ブラシ1pxを選んでおきました。
透明レイヤーに描写された窓枠を、マジックワンドで選択し、ペイントツールでベタ塗りします。 私は全てのパーツでレイヤー別けします。その方が便利なので。
んで、ここでちょっとした小技なのですが、 マジックワンドは自動的に領域選択をしてくれる便利な代物なのですが、あくまでも、線の内側までしか選択されません。 ようするに、そのまま塗ってしまうと、線の裏側が空白のままになってしまうんですよね。これが実は後で線を透明化する時に 問題になったりと色々大変。よって、マジックツールで選択した後には必ず、選択→変更→拡張 で、1px分(線の分)選択領域を拡大します。そうすれば、線の裏側までベタ塗りされるという寸法です。
ついでなので、簡単なカーテンの描き方を説明します。 カーテン・・・というか上から下に垂れ下がる布って意外と皺つけが面倒。なので、私はまず適当にザカザカと 筆圧ONにしたブラシで影を描いたあと、フィルターのモーションブラーをかけます。



垂直、90°でかけると、いっきに滑らかになりました。



5:床を描く

床とか、パターン計のパーツはフォトショ明利に尽きる所ですね。 簡単にちゃっちゃかさくさく描きましょう。まず、四方系の新規キャンパスに、床にしたい模様を描きます。今回は四角い木目パターンにします。 描いたら、編集→パターンの定義でパターンにして、保存しておきましょう。後々使いまわしにできます。(笑)

床模様ができたら、下のファイルに戻り、Fill(shift+F5)でパターンをべったりと塗ります。 画像が小さくてすみませんが、塗った後は、変形のねじる?・・・日本語コマンド解りませんが、そんな 感じのコマンドで、空間に合わせて変形。

するとこんか感じになります。ぶっちゃけ明らかに歪んでますが、細かい事は気にしません。(爆)てきとうに それっぽければOKとします。<オイ



5:仕上げ

はえーよオイっ!∑( ̄口 ̄;)と思われた皆様。大丈夫デス、他のパーツはみんな同じような応用です。 普通に影三種つけていけば終わりです。ので、ちまちまと全パーツ塗り終えました。背景は後々 時間差とかイベントに合わせて変えるので、ここで一旦セーブ。見て解るとおり、影の類を全く入れてません。



これに、影とハイライトをつけたり、ぼかしたりして利用します。完成品サンプルをご覧下さい。 それではー!とび足で第一弾背景講座終了です~。




This home page is written in Japanese Only.
chaos-island.org (c) 2005~ all rights reserved