「かみながしじま~輪廻の巫女~」 背景モデル制作フロー

「かみながしじま~輪廻の巫女~」 背景モデル制作フロー

こんにちは!第1事業部<TWILO> デザイナーの藤村と申します。
非対称型オンラインアクションゲーム「かみながしじま~輪廻の巫女~」で背景制作にを担当しました。 残念ながらサービスは終了していますが、このゲームにおける背景モデルの制作過程やポイントをご説明させていただきたいと思います

ゲームの背景制作を始めたばかりの人や、これからゲームの背景制作を始めたい人には参考になる内容かと思います!

「かみながしじま~輪廻の巫女~」について

このゲームは、ヒルコ(カミ)と少女たち(ヒト)に分かれて戦う非対称型オンラインホラーアクションゲームです。

少女たちは特殊な結界に閉ざされた島で、ヒルコからの妨害を避けつつ結界を解除して仲間と共に脱出を目指します。 ヒルコは少女たちには見えない「霊体」の姿で自在に移動しながら、島の動物たちに憑依して攻撃したり、強大な力を持つ巨大で恐ろしい姿の 「顕現体」へと変化したりすることで少女たちが島から脱出することを阻止します。

スマートフォン向けゲームの背景制作

背景制作において重要なポイント

スマートフォン向けゲームの背景モデルでは、下記の3点のポイントを押さえて制作します。

「軽い」 : 動作が軽い(計算処理が早い)
「キレイ」 : 見た目がかっこいい、美しい
「おもしろい」 : ルールを理解しやすく、おもしろい

「軽い」「キレイ」な背景モデルを作るために

家庭用ゲーム機のゲームは、誰もが同じ環境で遊べますが、スマートフォン用ゲームは、それぞれスペックや環境が異なる端末で遊びます。 その為、できる限りデータ量や計算負荷が少ない「軽い」モデルを作り、ゲームでの動作をスムーズにする必要があります。

背景モデルは「軽い」「キレイ」がバランスよく両立するように制作しています。その為に様々な工夫をしますが、詳細は次項で説明します。

 

遊んで「おもしろい」背景モデルを作るために

背景デザイナーは、企画のレベルデザイン担当者と相談を重ねながら制作を進めます。

「おもしろい」ゲームにするためには、<わかりやすい><ルールが伝わりやすい>点も重要です。 それらを踏まえてゲームプレイを繰り返し、問題点があれば何度も修正を重ねていきます。 レベルデザインの変更に合わせて、マップデザインもその都度変更していきます。

レベルデザイン担当者が作成した図

マップ全体を上からみた地図のようなものです。何をどこに置くかを記載してあります。(※地形がバレてしまうので一部の表示です。)

背景モデルの制作フロー

背景モデルの制作は、はじめに企画担当者がゲーム性を確認するためのプロトタイプを作成します。 並行して背景デザイナーはディティールを作成していきます。

Unity(ゲーム開発プラットフォーム)で地形を作成し、その上にMaya(3DCG作成ソフト)で作成したモデルを配置していきます。

1.マップのプロトタイプを作成

レベルデザイン担当者が作成した図を元にマップのプロトタイプを作ります。

下図は仮テクスチャとボックス型モデルで各要素を配置した状態です。 このマップで仮キャラクタを操作し、実際に遊んでみて「おもしろい」かどうか、おもしろくするにはどうすればいいのか、を確認していきます。

2.デザインの方向性を決めて資料収集

このゲームは下記のような設定の「和風ホラー」です。
・ヒト側のキャラクターは日本人の女の子たち
・カミ側のキャラクターは日本の神話をベースにする
・時代は少し前の平成の日本
コンセプトアートを作成するだけではなく、イメージを共有する為の資料も多く集めます。

※画像は加工しています。

3.コンセプトアート作成

企画とデザイナーでコンセプトの方針を決めて、コンセプトアーティストにコンセプトアートを描いてもらいます。 (背景デザイナーの裁量に応じて、背景デザイナーがコンセプトアートを描く場合もあります。)

↓背景全体のコンセプトアート

↓プロップのコンセプトアート

4.モデルの本制作

様々な場面や地形に合わせて柔軟に配置できるように「プロップ」と呼ばれる個体ごとに「Maya」でモデルを制作します。

「プロップ」は本来「小道具」の意味ですが、サイズの大小に関係なく「プロップ」として扱います。

◆プロップの制作

◆LODモデルの作成、設定

<LODとは>

近くに配置するプロップは<高密度なモデル>に、遠くに配置するプロップは<低密度なモデル>で表現することで処理負荷を減らす手法です。 LODとは「Level of Detail」の略であり、「モデルの細かさの度合い」を意味しています。

下図の電柱のモデルを例にご説明します。 左のLOD0用モデルのフェース(ポリゴン数)に対して、右のLOD1用モデルのフェースは6割ほどに削減されています。 例えば、LOD1モデル支柱の円柱部分は直方体になっていますが、表示する際はカメラから離れているのでポリゴン数の少なさは気になりません。

◆使いまわせるプロップ作り

下の絵ですが、何種類もの岩を作成して配置しているように見えるかと思います。

ですが、実際に使用している岩モデルは下図の2種類だけです。 少ないパーツでバリエーション豊かな表現ができるようにしています。

このように使用する元モデルの数を抑えることで、 計算負荷と作業工数を抑えることができます。 見た目の質は下げずに、モデルのコストを下げる 工夫をしています。

加えて、岩の空側部分のみに緑の苔テクスチャが 表示されるように設定して、さらに効果を高めて います。

5.地面を作る

◆Unityで地形を作成する

地形のベースは、Mayaは利用せず、Unity上でTerrain機能を使い制作します。

↓上:地形だけの状態 / 下:地形にモデルを配置した状態

のテクスチャを作成し、それを読み込むとペイント形式で草を生やすことができます。風を設定し草を揺らすこともできます。 地面の起伏や凹凸、地面のテクスチャもペイント形式で作成していきます。

↓地面テクスチャの描き分けと草 地面のテクスチャに合わせた草を生やしています。

6.モデルを配置する

「5」で作成した地形に「4」で作成したプロップを配置していきます。 「4~6」の工程は、並行して企画担当者がゲーム性を確認しながら進めます。 ゲームで遊んでみて問題がある箇所は、見た目とのバランスに気をつけながら修正します。

◆マップ全体にゲームで必要なモデル要素を配置する

「ゲームに必要な要素」と「見た目を良くするために必要な要素」を配置していきます。

◆「現代物プロップ」を配置する

ヒトと一緒に現代からこの島に呼び込まれてしまったさまざまなオブジェクト「現代物プロップ」を配置しました。

7.仕上げ

◆環境系要素を追加

空間全体のフォグ 、 エフェクト(霧、ゴッドレイ、空中を飛ぶ光る虫)等の要素を入れて仕上げていきます。

↓上:仕上げ前/ 下:仕上げ後

 

フォグはこのゲームのホラー感の演出において大事な要素です。 見通しが良くないことで恐怖を演出したり、ゲーム性を高める役割があります。

8.完成!!

実際のゲームプレイの様子です!

…背景モデルの制作フロー」は以上になります。

背景デザイナーを目指す人へ

背景デザインのたのしいところ

自分が思う背景デザインのたのしいところは、ゲーム内の「画面の一番広い部分」を制作できる点です。 現実にはない世界を作ることができて、その空間を縦横無尽に動き回れることもうれしいです。しかし、ゲームにおいてはあくまでも「背景」なので、主役ではありません…! 「いかにキャラクターやゲーム性を引き立たせることができるか」を考えながら作っていくことにも背景デザインのおもしろさがあります。

大切なのは描けることよりも視点

「背景デザイナーは絵を描ける必要があるか、否か」は同業者の中でよく話題になります。 絵が描けることは必須ではないですが、自分がデッサンを勉強した時に学んだ「物の見方」は役に立っていると感じることが多々あります。
背景デザイナーには「小さい物のディティール」から「広大な空間」まで見ることができる幅広い視点が必要だと思います。 そこを意識して「さまざまな情報」を蓄積していくことがそのまま役に立つ仕事です。「さまざまな情報」は多岐にわたります。 (いつも見ている風景、散歩や旅行をして観た景色、ゲーム、映画、アニメ、漫画、動画、設定画集、誰かがアップした写真 等…)
そうして自分が得たさまざま情報を元に、現実には存在しない世界を作り出せることが背景デザインの醍醐味だと思います。

デザイナーを募集中です

あなたもAimingで背景デザイナーとして一緒にゲームをつくりませんか? オンラインゲームを作る仕事には主に「企画」「運営」「エンジニア」「デザイナー」「QA」…の役割がありますが、 Aimingは、各役割ごとの壁を感じずにフラットに相談や提案をしやすい雰囲気があります。 社内の交流を活発にすることでコミュニケーションがとりやすい環境づくりに努めています。 年齢や経験を超えてご自身のクリエイティビティを発揮できる社風なので、ご興味があればぜひご参加いただきたいです!

Aimingではデザイナーはもちろん色々な業種を募集していますので、ご興味がある方は下記をご覧ください!!

株式会社Aiming第1事業部<TWILO>では一緒にゲームを作る仲間を募集中です!!
詳しくは採用ページと事業部紹介ページをご覧ください!
■採用ページ
https://recruit.aiming-inc.com/career/
■事業部紹介ページ
https://recruit.aiming-inc.com/twilo/