【ウマ娘】グラフィックの秘密

今日は、文系でありながらもローカル通信で対戦可能なゲーム構築に携わった私が、ゲームのテクノロジーに関する記事をまとめようと思います。

文系の方にもわかりやすい解説を心掛けますので是非最後まで読んでいただけると幸いです。

1,ウマ娘について

2018年に事前登録が行われてからというもの、3年の時を経て

2021年2月24日ついに配信が開始されました。

このゲーム3年配信を延長した甲斐あってものすごくグラフィックが綺麗

ソシャゲの中でもかなり上位に食い込むのではないでしょうか。

このゲームでは疾走感を演出するために高速でグラフィック処理を行う必要があります。また、ウイニングライブというレース勝利後に開催されるライブでも高速かつ高品質な3Dグラフィック処理が求められます。

しかも今回は完全にモバイル端末がターゲット(3/10PC版も配信されましたがおそらくターゲットはモバイルでしょう)

正直こんなことを試みるのは、いくら資金力のあるサイバーエージェント様でも到底正気の沙汰とは思えません。

しかし、彼らの恐ろしいところは3年の歳月をかけ本当にやり遂げてしまった点です。

実際にプレイしていたただければ、ゲームにそれ程詳しくない方でも全身の毛穴が開くような体験をしていただけると思われます。

2、裏でどのような処理が行われているのか

①首から上、下で精細度を変えている

まず、ゲームで利用されている3Dモデルは、実はすべて三角形の板を組み合わせて構築されています。

球体の3Dモデル作成時の画像を添付しました。

この3Dモデルを見ていただくと、球体とはいいながらも三角形で構築された立体であるということがわかります。

一般に、この三角形のことを「ポリゴン」というのです。

なぜ、立体を生成する際には三角形の「ポリゴン」をもちいるのか。

そこには明確な理由があります。

なぜなら三角形というのは平面を構築する最小単位だからです。

3つの青い頂点の座標さえ指定してしまえば、おのずと面と辺がどこにあるのか求まります。コンピュータからしたら非常に単純明快、計算しやすくなります。

また、どんな図形であってもすべて三角形に分解することができます。四角形であれば三角形2つ分、五角形であれば三角形3つ分などのようにです。

この立体を構成する三角形をどれほどまで小さくするか、これに3Dモデルの完成度が関係してきます。

先ほどの球体の例であれば、構成する三角形が小さければ小さいほど頂点が目立たなくなりより球体に近づきます。一方頂点をある程度妥協し、大きな三角形で構築するとボコボコした球体(?)になります。

さて、3Dモデルがどのように構築されているかお話ししたところで、ウマ娘の裏側についてお話していきましょう。

ウマ娘では3Dモデルを作る際に表情を構築する部分(顔、髪)はかなり精巧に作りこんでありますが、首から下の体の部分は、大きめの三角形を用いて構築されています。

大きめの三角形を用いて立体を構築すると処理する数式も少なくなり、処理が軽くなります。

②スマホの「GPU」性能をいかんなく発揮

①の内容の補足になりますが我々の利用しているスマートフォンの中には「SoC」と呼ばれるチップが入っています。

その中には、スマホの頭脳となるCPUやNPU、GPUが詰め合わせられています。CPUは、アプリ制御からOSの制御までありとあらゆる計算を制御する最重要部品です。そして、GPUこちらの部品は簡単な計算を高速、かつ大量に行うことに優れています。

簡単な計算というのは、先ほど述べた三角形の頂点と頂点をつなぎ合わせ面や辺を生成するという仕事です。ですから3Dグラフィックの処理に非常に適しています。

ウマ娘はCPU性能、GPU性能をうまく使いこなしながら快適なユーザー体験を実現しているアプリといっていいでしょう。

③シェード処理を多用

先ほど説明した通り3Dモデルというのは頂点座標を与えられ、その点と点を結んだ三角形の組み合わせで構築されていると言いました。

ただし、頂点と頂点を結んだだけでは、それはただの骨組みで3Dモデルとは言えません。三角形の面となる部分に画像を張り付ける必要があるわけです。

この張り付ける画像のことを「テクスチャ」と呼びます。

ためしにピンク色のテクスチャを張ってみました。このテクスチャが実際は画像であったりするわけなんですが、多く種類のテクスチャを用意するとそれはそれで処理が必要になります。つまり、凝った3Dモデルを作ると処理が大変になるわけです

それでは、ウマ娘のなかでも処理が大変であろうレースの画像とウイニングライブの画像を見てみましょう

手先、顔以外のパーツはちょっとガビガビしていること、お分かりいただけたでしょうか。また、服についても赤、紫などなるべく単色で表現されていることお分かりただけますか。恐らくこれについてもサイゲームスの努力の跡でしょう。

3,サイバーエージェント様の札束の力

ウマ娘の下半身の処理は解説しました。しかし、どうにも気になることがあります。

表情、手のしぐさ、異常なほどリアルなのです。

私も3Dモデルを制御する際にはかなり苦労させられた記憶があります。

おそらく優秀なスタッフを囲い込み、相当な時間、労力をつぎ込んで制作された努力の結晶だと思われます。

サイゲームスの親会社、サイバーエージェントは2019年世界最高水準かと思われる移動式の3DCGスキャンスタジオ「AVATAR TRACK」を導入しました。

論より証拠この動画見てください・・・

いい意味で札束でぶん殴ってる感がすごいです。

今後の事業展開にもかなり期待の持てそうなサイバーエージェント

最近だとAbemaTVがどうやらそこそこうまくいっているらしくウマ娘からのウマという導線もあるのではないかと考えている今日この頃です。

4,まとめ

今回は「文系にもわかる」テクノロジーの話として解説してきました。恐らく、プロの方が見れば、もっとサイゲームスの凄さであったり、私の解説に疑問を持たれる方もいるかもしれません。その辺はコメントしていただけるとありがたいです。

また、Game-iさんのセルラン予測によりますと、3/16時点で月間71億の売り上げ予想をたたき出しています。すごいですね。うらやましい・・・

クオリティはかなり高いと思いますので、ぜひ一度プレイしてみてどうでしょう

出典:Game-i

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。