+ MENU +






管理人 : 香月清人
プロフィール

usui@pq.moo.jp
kasasiti@hotmail.com

お仕事募集中です。
現在多忙のため不可
管理人にメール
臼井の会 RPGツクール 作成講座


主にマップチップとか背景とか。
ここは香月が素材を作るときにどうしているかを
ダラダラとつづったページです。

香月自身、若輩な者なのでこんな講座を描くのも
おこがましいのですが… 
一部の意見で「どうやって顔グラ作るんだ、教えてくれ!」
との声がありましたので書いた次第であります。
説明ベタですが、興味のある方は読んでみてはいかがでしょうか。

っていうか全部読むのは相当面倒くさいので

グラフィックに興味ある方か、本気で作ってやろうと思う方以外は
見てもあまり面白いものでもないかもしれません。




はじめに

文章中に一部、専門用語が出てきますが、
この文章自体が、”ある程度 Photoshopを使える人”を対象としているので
あらかじめその旨をお伝えしておきます。





※以前はPhotoShop5.5のみの講座でしたが
CS3をGETしたのでCS3の対応もしてます。




以上をご理解頂いた上での講座になりますがご了承下さい。

では、作成に参りましょう。







1、(ラフ)絵を描く


まぁ、当然といやぁ当然なンですが…
絵は自身で描いて下さいね(笑



ちなみに香月はエンピツで描いてます。
最初はSAIで丁寧に線描いてたンですがあまりにも時間がかかる上に
どうせ縮小するので意味ないと判断して線画修正は最低限にしました。

※2009年現在 結局SAIで描いてます…





2、スキャナで取り込む


別にPCで直描きできるぞ! って方は取りこまなくても
いい気がします(笑

俺は無理なので取り込みます。

取り込むときの解像度は
香月は、グレースケールの360で取り込んでいますが、
600ぐらいで余裕で取り込めるPCスペックがあれば
それぐらいでもいいかもしれません。





3、線画修正


線画を取り込んで、「*1 線画抽出」したら、
線画を修正します。

塗るときに線と線の間が開いてると、塗りつぶしにくいですからね。


-----------------------------------------
*1 【線画抽出】  そのままの意味です。
一応、わからない人のために操作方法を…

 1、Ctrl + A (全選択)
 2、Ctrl + X (削除) *削除はされてますが画像はコピーされてます
 3、チャンネルタブに行く→ 新規チャンネルを作成
 4、チャンエンルタブで Ctrl + V
    (ここでアルファチャンネルに先ほどの線画が出ます。)
 5、できたアルファチャンネルのレイヤーに
   Ctrlを押しながらクリックして選択範囲を取る
   それの選択範囲を反転
 6、レイヤータブに戻り、新しいレイヤーを作成
 7、新しいレイヤーに先ほど選択した部分を任意の色で塗りつぶし
 8、終了





4、塗り分け


後で修正する可能性も考えて、パーツごとに色分けします。
めんどくさい作業ですが、やっておくと後でとても楽です。

ああ、そうそう、カラー塗るときに
モードをRGBに変えておくことを忘れずに。









5、ひたすら塗る


がしがし塗ります。
塗り方については個人個人なのでとやかく言えないので
ご自由に頑張って下さい(笑



↑左側にある小さいウインドウ(赤丸)は、全体を確認するためのウインドウです。

 絵というものは、常に拡大して見るものではなく、全体で捉えるものです。
 とか偉そうなこと言ってますが、単に離しながら絵は見たほうがいいよ、という
 先人の教えであります。

 ちなみにやり方は、Photoshopの上のタブメニューの「ビュー(V)」から「新規ビュー」で
 新しいビューができます。このビューはメインで作業しているのと
 同時更新がされるので(正確にはどちらも同じものなので)、全体像を見ながらの
 作業には最適です。

■PhotoShopCS3での新規ビュー■
一瞬、新規ビューがなくなったかと思いましたが、
上のタブメニューの「ウインドウ」>「アレンジ」>「~の新規ウインドウ」で
上記と同様の効果が出ます。







というわけで塗り終わりました。




6、切り取る


塗り終わったキャラを今度は
素材用に加工します。

そのためにまずは、レイヤーで分かれているキャラを統合し、
それを単体で使えるようにしなくてはなりません。


まずは、うっかりミスしておじゃんになってしまわないように
「複製コピー」をします。




複製コピーをした後、
そのデータの「背景」レイヤーを非表示にし、
残りのレイヤー(塗ってある表示レイヤー)を統合します。



これでキャラが統合された状態かつ、透明部分との差別ができました。






7、配置を決める


作成したキャラを他のデータ(VX元素材など)との
大きさと配置を決めます。

これはかなり重要で、他のキャラと大きさが違うと
結構目立つので、香月は個人的にはかなり気を使う箇所です。




上記の画像のように
「大きさ合わせ.psd」などのファイルは
別途に用意する必要があります。


※作り方がワカラン!という方のために
 香月がpsdで用意しました。
 zipで圧縮されていますがまぁ、なんとかなるでしょう。
 sozai_sample(1.56MB)


ファイルの内容は
元素材にあるキャラ1体を持ってきて、(96x96で取って)
解像度を無理やり360にしたものです。

その後、周りの選択範囲を
黒で取っているだけなんですが…







(図9-a)



先ほど作った、キャラデータを選択範囲を使って適当な大きさに取り、
「大きさ合わせ.psd」のほうへ持ってきます。(図9-a,b)

(図9-b)














このままだと大きさの調整がしずらいので、
レイヤーの透明度を変え、下の画像と比べられるようにします。(図10)

(図10)














大きさと配置が決まったら、余計な描画部分を削除します。(図11)
*2 Ctrlを押しながら、黒フチのレイヤーを選べば、黒フチの選択範囲が取れますので、
キャラの描いてあるレイヤーに移動してDeleteすればOKです。

(図11)














余分な部分が取れたら、今度は *2 Ctrlを押しながら、
キャラのレイヤーをクリックします。(図12)
(キャラの描画部分を選択範囲として取る)

(図12)



-----------------------------------------
*2 【Ctrlを押しながら】 
5.5では、Ctrlを押しながらレイヤーをクリックすると
そのレイヤーに描画してある部分が選択されます。

※CS3では、わかりにくいんですが
 レイヤーの透明部分っぽいサムネイルをクリックすると
 選択できます。微妙にわかりにくくなってる…。


正規にやっている操作方法は、
「選択範囲(S)」→「選択範囲を読みこむ(L)」

という操作なのですが、ここではショートカットの
つもりで表記しています。
-----------------------------------------




キャラの選択範囲が取れたら、次の工程へ進みます。





8、実サイズへの加工


ここからようやく実サイズへの加工が始まります。


(図13)


上記にあるようなファイルを別途に作ります。

ファイルの内容は
キャラの本データの1体のサイズ(96x96)の正方形を
縦2つ、横4つ並べたものです。
解像度は72。
元素材と同じ大きさをこれで作ります。(384x192)
(図13)



図13の右側のレイヤー構成に色々な名前がついているのは
香月がわかりやすくするためにキャラに暫定的な名前をつけているからなので
気にさらぬよう。







先ほどの「大きさ合わせ」のファイルの解像度の変更を行います。
現在の「大きさ合わせ」のファイルの解像度が360なので、
これを72に変更します。
(図14)
(※注意:上画面の”サイズ”は適当な数値なので無視して下さい)

すると、解像度が減るので画質は落ちます。
しかしこのサイズが正規のサイズなので
ここから頑張りましょう。

このファイルはそのままの大きさで使用できます。











で、この変更済みの「大きさ合わせ」にあるキャラデータを
さきほどのファイルに持ってきます。
(図14)

余分な部分を切り取りつつ、96x96の枠にうまく合わせます。(図14)















9、表情をつける


※この項は「おれは表情なんて書かないぜ!」っていう方は
 次の項へ飛んで下さい。








まずは、キャラの画像を横にコピります。(Vを押しながら移動)

(図15)


ちと変ですが、表情を描きやすくするために
眉と口を消します。(図15)
(上から上書きで無理やり消してる)

直接上書きするのではなく、レイヤーを作って作業したほうが無難です。









1個、そういうのを描いたら残りのスペースにもコピります。(図16)

(図16)

キモイけど、これ、重要なのよね。







後は根性で表情描きます。


…なんの参考にもならねェ…













10、アルファを付ける
★この項目は5.5以降のバージョンの方はやらなくてもいいです。
 とりあえず7.0からは透過pngができることは確認済みなので
  7.0以降の人は飛ばしていいです。


ツクールXPからの仕様のようですが、
ツクールVXでは素材に”アルファチャンネル”をつけないと
ダメな仕様になってます。
(透過部分をキチンとアンチ切って抜けば上記のようにしなくてもいいんだが…)

こんなことするからゲームが重くなるのに
何考えてんでしょうね! …まぁそれはいいとして。



アルファチャンネルとはわからんという方は
透明度を管理できるチャンネルとでも思っておいて下さい。
使い方によってはとても便利な機能なので。(重いけど)

今まで作ったキャラデータも、そのまま選択範囲を取って
アルファをつけてもまぁ大丈夫と言えば大丈夫なのですが、
どんな背景にでも合うようなアルファの取り方のほうが
いいですよね?

というわけで自分は、
「なじませカラー」レイヤーを使用しています。(図17)

(図17)

ここではブラウンですが、黒でもいいとは思います。
この色を下地に使うことでキャラの周りの色がなじみます。(個人的に)
これを下のレイヤーにおきつつ……














(図18)

キャラの選択範囲を取ります。(図18)(Ctrlレイヤークリック)

チャンネルタブに行き、
選択範囲を *3 白で塗りつぶします。(図19)
(Dを押すと描画色と背景色がデフォルトの白黒になるので利用しよう)
(図19)






-----------------------------------------
*2 【白で塗り潰す】 
なぜ白なのかというと、白が不透明だからです。
ちなみに黒は完全な透明です。

では灰色は…?

透明です。濃度的には50%と言ったところでしょうか。
今回は使用しませんが、幽霊やなんかに使うことがあるかも?
-----------------------------------------






(図20)

最後に微妙に塗り潰しきれてない箇所があれば
白で塗ります。
隙間かもしれないので、そのへんは確認しながらやって下さい。















11、保存


いよいよ完成です。

★この項目も7.0以降を持っている方は別のやり方で保存するので
 気にしなくていいです。
  ちなみに7.0以降のやり方は
 
   
透明状態を維持したままpngで保存 すると勝手に透過pngの完成です。

  やったね!



画像を統合し、アルファがあることを確認したら、
「別名で保存」を選び、(別に普通に保存してもいいが、このほうが色々と便利なので)

png形式にして、
”アルファを保存しない”にチェックがはずれていることを確認したら
保存完了です。



というわけで…













完成じゃい!!













御疲れ様でした!!



























12、楽屋

今回は俺のくだらない講義に付き合って頂いてありがとうございました。

俺のやり方はある意味、我流なのでアラが目立ちますけど
とりあえずいつもこうやって作ってます。

顔グラは早ければ2時間で作れることもありますけど、
いつも表情や大きさで詰まるので、それ以上がほとんどです。
表情はこだわりたい所ですしね。


…まぁ、最後に言いたいのはですね…

































見るのは(使うのは)一瞬だけど、

(顔グラフィック)描くのは(思った以上に)大変なんだよ!!(涙)