こちらは ノベル/ADV制作者によるアドベントカレンダー 参加記事です!!
\ みなさ~~ん! ゲームで背景ってどうしてますか~~~! /
えっ……3D空間……? オリジナルドット? 背景外注………??
なるほど…………………知らない子ですね。
この記事では素材サイトさんからお借りしてきたり、背景アセットを買ってます私がゲームの雰囲気に合わせるためにやっている加工をご紹介する記事です!
ついでに(Adobe税は支払えないので)イラストに使っているクリスタで基本的に加工します。
記事の中では写真を使っていますが、イラストのときも実は同じようなことをしています。
そして本日のお写真は全て撮影者あきらとなっております。
準備編
どれにしようかな~~!
あっこちらのファイル管理ソフト見やすいでしょう?
Eagleって言います!
これむっちゃ便利なのでおすすめ! って記事を過去に書きました(お金をもらってないダイマ)
選んだ画像は最初にゲームに必要なサイズに縮小拡大してトリミングしておきましょう。
概ねゲームの解像度になるのではないでしょうかっ!
加工していくよっ
線を潰す
フィルターのイラスト化、もしくは調整レイヤの階調化あたりで画像の細やかさを潰します。
どれくらい潰すかは本人の好み次第……と思うんですけど、今どきのイラストは細部にわたって、細やかに、繊細に描き込んでいる感じがするので、そこまでやらなくて良いんじゃないでしょうか。
あんまり潰しすぎる2010年くらいっぽいゲームの背景になる!と思ってます。
それと、イラスト素材を調整する時はこの作業はあまりしないです。
する事もあります。
複数の素材をお借りするときは、統一感のためにしたりします。
その場合階調化が多いかな??
雰囲気を作る
色味を決める
みんな大好きグラデーションマップ!!!
アセットストアに行けば色々目移りするくらいおいてある!!!!
作りたい雰囲気っぽい色合いのを選んでオーバーレイかスクリーンにするのが王道な使い方だと思うんですけど……私もそうするんですけど……
こういった派手でむしろぜんぜん違う色!ってのを選んで「除外」「除算」「減算」のようなモードもおすすめ。
今回はこれを除算したよ!!
きれ~~~~~~~!!
ちなみに、定期的に「表示レイヤーをコピーして結合」しています。
1枚のレイヤじゃないと出来ないこともあるし、区切りにもなるしね!!!
それと、グラデーションマップ以外にもオートアクションでも色味をいじれるものがあります。
イチオシは「アクアレモンフィルター」
どういう原理なのか良く分かってませんが、とりあえず青/レモン/ピンクっぽいエモーショナルな色になります。
◇素材◇
質感フィルター
貼り付けてオーバーレイ!!!!!!!
もしくはスクリーンや焼き込みカラー。
この手のテクスチャ素材はクリスタのアセットストアよりDesigncutやpixiv、DLsiteで手に入れることが多いかも?
◇素材◇
プラスアルファ!
このままじゃまずい!
それはそうと、なんか右側が白くなりましたね?
まあ、これはこれで良いんですけど、そういう時やってる加工もせっかくだから解説です。
\ ぽんっ! /
ということで、葉っぱのついた枝をぽんっとスタンプしました。
植物系の素材はクリスタアセットにたくさんあるのでとてもおすすめです。
ついでに、ちょっとだけぼかしをかけておくと背景に馴染みやすいと言うか、手前の物がぼやけてる感じします。
◇素材◇
模様をつける
可愛い系の同人乙女ゲームだと良く背景に模様がついています。
(ノベコレさんなどでも見つけられます)
私も好きです。
そういうのはタイル素材を敷き詰めて白か黒×オーバーレイかスクリーンでつけることが出来ます。
せっかくデジタルでいくつでもパターンを見比べることができるので色々やってみると面白いですよ!
後可愛くなる。とにかくかわいい。
◇素材◇
一応状況を変えてみたり
天気の変更、時間の変更が必要だったらクリスタで描き足します。
今回は特に必要なかったけれど、お天気雨が大好きなのでお天気雨にしてみました。
◇素材◇
完成っ!
お疲れ様です!!!!!!!!!!
ものすごい早足&スクショ数で気圧されたかも知れませんが……今回丁寧にやってるだけで! 半分くらいの作業しかしないものです。
そしてこちらが完成品をゲームに組み込んでみせた所。
だいぶ写真みが薄くなったのではないでしょーかっ!
そして、私はいかにもエモーションな色合いと雰囲気が好きなので大満足です。
別パターンたち
上のとこで終わっても良かったのですが……
もうちょっと書けそうなことがあったのでエクストラターン!
別の画像を加工するところもちょっぱやな早足でご紹介したいと思います。
車内画像
こちらの(奇跡的に誰も居なくなったので、全力でゲーム用に取りまくった)電車内写真を加工しますっ!
前のと何が違うかって言うと「人工物細かくてしんどい」「室内は誤魔化しづらくてしんどい」と言うことです。
加工しやすく加工する
フィルターや補正などを使わない場合、jpegらしいぶつぶつがあったりします。
クリスタにはそれをワンクリックで取り除く機能があるので適当に何回かかけておきます。
もーゴチャゴチャして見るからに写真なのでとにかく明るくしてあげます。
明るくしてると白くボケるので、ちょっとコントラストもあげてるのが↑のスクショです。
そのご微妙に彩度を上げたりなんだりして、とにかくボケない範囲で明るくします。
頑張った結果です。
模様をひねり出す
室内(車内)は「良くわからないけれどこれをオーバーレイかスクリーンすると良い感じになるよ」系のテクスチャが違和感出ると言う逆境なので、ペンで謎の光を描き足してます。
この時使うペンは漫画用のコマの後ろを埋めるペンや良い感じのふわふわを描いてくれるペンが優秀です。
写真に置くときはイラストっぽいやつ、イラストに置くときは実写っぽいやつを使うとエモーショナルで今どきな描き込み多めのイラスト……に勘違いさせやすい! 気がする!!
◇素材◇
枠をつける
これはゲームエンジン側でやるべきことかも知れませんが、ケース・バイ・ケースということでここで紹介してみます。
ぽんっと背景画像を置くよりも、上下全体をぐるっと枠で囲んであるほうが雰囲気が出ると思います。
いややっぱりゲーム側に組み込んでやるべき事かもしれない……
良い所は「画像ごと好きな演出にできること」「組み込んでる時管理する素材数を減らせること」
画面にいっぱい画像出してると、画像の表示順とかで頭パンクしちゃうよぅ!
◇素材◇
完成~~~!
とゆうわけで枠付き車内背景でした~~!
そもそもキレイな加工しながら素材撮っちゃっえ~~!
私は年がら年中ゲーム制作のことを考えているので、遠出や旅行ではひたすら人の居ないゲーム向け背景素材をひたすら撮っています。
ってな感じのを今回放出しながら記事にしているのですが……
もう既に青くてエモーショナルじゃないですか?
同人サイトのバナーになってそう!! むしろ私がしてそう!!!
ちなみに船上です。(海の写真が多い?? 私が海好きすぎるんだよ!)
これはB612と言うキラキラめのフィルターをかけながら撮影するアプリで撮った写真です。
ここまでくればもう色調補正すら要らないですね!
いきなり模様をつけたり枠を付けたり
模様になる素材を貼って、
枠つけて、
かんせ…………
っなんか背景の高さ変じゃない!?!?!?!?
これっていわゆるアイライン……じゃなくてあ、あいしゃどう……あい……あい……あい…………………[google検索]…………アイレベル!!!!!!!!!!
なんかその水平線的なあれが変みたいな。
もちろん知識がないんで合わせられません!!!!!!
でもとりあえず、背景の街灯がキャラより低いのは嫌だったのでなんとかしま……
した!!!!!
知識がある人の知恵待ちです。
まとめっ
以上が私がゲーム用背景でしている加工ですっ!
なにかの参考になったら良いなあと思っています。
それと、今回作った背景画像は素材としてまとめておいたので、気になる人は見たり使ったりして下さい。
別ページにまとめておきます。
また、似たような画像加工記事はちょいちょいあげてるのでもっと見たい~~と思った奇特な方は見ていってくださいな!
◆◆素材ページ◆◆
◆◆過去記事◆◆
※2つ目はR18サイトです。
さいごに:ノベル/ADV制作者によるアドベントカレンダー
冒頭でも申しましたがこちらの記事は「ノベル/ADV制作者によるアドベントカレンダー」参加記事ですっ!
私の100倍すごいゲーム作ってる人たちが参加してるので、みんな他の記事も見に行こうぜ!
※コメントは最大200文字、3回まで送信できます