「Studio F#」さんの連載コラム 第11回

「Studio F#」さんの連載コラム

作者様:ホームページブログニコ生Twitter
作品:天使の証(体験版)シュガードロップ・ブレイクアウト
Studio F#さんの連載コラム:01020304050607080910
1112131415




■立ち絵を作ろう!

鱧天での立ち絵の作り方について解説します。
立ち絵は使わない! という場合はスルーしてください。

今回は画像ファイルのお話。




■形式が決まっています

鱧天では、全ての立ち絵を統一したタグで呼び出して使えるよう、用意すべき画像の形式も決まっています。
ちょっと面倒ですが、形式に沿った画像を用意するところから始まります。

まず、立ち絵が立っているところを見てみましょう。








こんな感じですね。
では、この立ち絵の元ファイルはどんな感じのものかというと





みたいな感じのファイルです。よこ700px×たて600pxが鱧天での立ち絵ファイルのサイズとなりますので、そのサイズのPSD画像を用意しています。

ちょっと見づらいので、レイヤー構成を拡大。





こんな風になっております。身体と、表情と、前髪を別レイヤーで分けた状態を保持しておく感じですね。
さらに表情は、数は好きなだけ用意すれば良いのですが、目の開いている表情については、ひとつにつき、





こんな感じで3パターン作って、わかりやすいよう表情のレイヤーフォルダを切って格納しておきます。
目パチ用です。
※目パチが不要な場合はこの差分を作る必要はありませんが、画像の準備方法については、目パチがある場合と同じ工程をとる必要があります。

これは、実際のファイルを見て頂いた方が早いと思いますので、こちらの作例ファイルを参考にしてみてください。

▼鱧天立ち絵切り出し用PSD作成ファイル
(スクリーンショットがSAIでしたが、PSDファイルなのでもちろんPhotoshopで編集できます)

立ち絵構成のひな形としてご利用ください。
たぶん、絵を描く方ならファイルを見て頂ければ、だいたい分かるかなと。
今回のこれは絵柄的に前髪は不透明でそのまま上にかぶせちゃってますが、透明度つけて用意しても大丈夫です。




■バラバラに書き出す

そして、このPSDファイルから、実際にゲームで読み込むPNG画像(背景透明にしておいてください)を書き出していきます。
保存場所は

graph/fgimage/

に、キャラごとにディレクトリを切って保存します。
今回の作例ファイルであれば、

graph/fgimage/erin/

という感じにディレクトリを用意して、





こんな感じです。
※大きい立ち絵も入っていますが、こういう使い方もできます。無くても大丈夫です。

(保存するファイルの内容)
(1)erin/
身体のみのファイルをそれぞれわかりやすい名前をつけて保存。
画像サイズは全て700×600px

(2)erin/face1/、erin/face2/……
表情のファイルを保存します。表情セットごとにフォルダを分けて保存。
表情ファイルの作り方と保存の方法は後述します。

(3)erin/exp1/
前髪のファイルを保存します。
ポーズが変わると前髪も複数必要になりますので、私は「01」「02」……と連番で保存しています。
画像サイズは全て700×600px

★また、今回スクリーンショットのキャラには使っていないのでディレクトリが無いのですが、
同じ領域に「exp2」「ware」というディレクトリも作れます。(ここも画像サイズは全て700×600px)
ここには、眼鏡とか、ほっぺの紅いのとか、表情マークなど、立ち絵の上からくっつけたいものを格納します。
必要に応じてご利用ください。

レイヤーの重なり順は、下から

body
face
ware
exp1
exp2
mat

となっておりますので、例えば、wareに眼鏡、exp1に前髪、exp2に表情マーク、などのような感じで
使い分けて用意しましょう。




■表情ファイルの作り方

「face1」「face2」などに入れるファイルの作り方ですが、まず、書き出し用PSDの方で、





このように、正方形(デフォルトでは100px四方)のマットを表情の下敷きにします。
全部の表情がマットからはみ出ないように位置を調整します。
絵が大きくて100pxの正方形では表情が収まらない場合は、正方形サイズを大きくしてもOKです。
そして、





この四角形で切り抜きます。
で、このファイルを表情切り出し用として別名で保存。(元のPSDは元のまま保存しておいてください)
さらに、





四角形のサイズの3倍の横幅にリサイズ。
(100px四方の場合は、300×100pxに)





その後、元のマットを2つ複製して、目パチの差分をマットにリンクさせて画像のようにぴっちり並べます。





目パチアニメ用画像なので、マットと表情との位置関係が1ピクセルでもずれると目パチがずれますので気をつけてください。

※目パチが不要な場合は、左端の表情を3つコピーして並べてください。ニコニコ顔など、目パチが不要な表情も
基本表情を3つコピーして並べてください。

そして、この、表情が3つ均等に並んだ状態のファイルを透明度付PNGで保存します。
ファイル名は「名前_a.png」とします。「_a」は必須なので必ずつけてください。





こんな感じに。私は表情は番号で管理しているので、こういう感じのネーミングになっています。


立ち絵の、画像の作り方は以上です。
次は、こちらをスクリプトから呼び出して使うときのやり方をご説明します。

(つづく)




●感想をTwitterでつぶやいてみよう!

このコラムをご覧になられた方は
是非一度Twitterで感想をつぶやいてみて下さい♪


このエントリーをはてなブックマークに追加


最近更新したコンテンツ

2016年01月29日
ニュース
アニメ「この素晴らしい世界に祝福を!」がゲーム化
BD&DVD1巻の特典として収録
2016年01月28日
新着ゲーム
「消灯時刻」
終末世界で起きる、残された人達の物語
2016年01月27日
ニュース
Web漫画「おじさんとマシュマロ」が面白い
おじさんとOLの、微妙に噛み合わない恋愛風景
2016年01月26日
ニュース
漫画「ステラのまほう」がアニメ化決定!
女子高生達が同人ゲームを作る4コマ漫画
2016年01月24日
新着ゲーム
「レミリアケツKicker」
レミリアさんのお尻を蹴るゲームが出たよ
2016年01月21日
新着ゲーム
「凍れる心がとける時」
短編ADV。ファンタジーな世界での恋する学生のお話
2016年01月18日
新着ゲーム
「ゆぼひくっ!」
勇者を作って冒険する?超簡単な暇つぶしゲーム
2016年01月17日
新着ゲーム
「ワーズ・アンド・マジック」
スマホやタブレットで遊べるタイピングRPG
2016年01月15日
新着ゲーム
「東方紅輝心」
レミリアと咲夜の3DアクションRPG
2016年01月14日
新着ゲーム
「TS:NONUPLE NINE ノナプルナイン」
ちょっと(?)エッチな探索型ADVゲーム
2016年01月12日
新着ゲーム
「森でクマさんテラヤバス」
可愛い少女・OLと紳士なクマさんの追いかけっこゲーム
2016年01月12日
コラム
「リド・カイン」さんの連載コラム 第5回
「ゲーム制作一人で出来るもん!データベース作成編」
2016年01月11日
新着ゲーム
「KATHARSIS?禁断病理の子供達?序章」
フルボイス!?「医能伝奇」バトルADV
2016年01月09日
新着ゲーム
「リセマラ勇者」
ガチャを回して勇者を集めてよう
2016年01月06日
新着ゲーム
「ハンスとグライフ」
【18禁】女性向けのダークファンタジーゲーム
2016年01月05日
コラム
「道玄斎」さんの連載コラム 第42回
「非グリム的童話の世界へ」
2016年01月03日
コラム
「眠田 直」さんの連載コラム 第4回
「ゲッペルスちゃん3」制作報告コラム・その4

個人、同人の創作ブログ更新情報

サブコンテンツ

このページの先頭へ