Unityで3D惑星にHPバーと大気表現を実装した｜Mother Planets
前回は、Twitchで!joinすると自分の名前を持った惑星が生成され、属性色と表面模様が付き、自転しながら公転するところまで進みました。今回はそこからさらに、HP表示やShader、大気表現まで追加して、「動く惑星」から「ゲーム画面に置ける惑星」へ仕上げました。
惑星の名前やHPバーの表示
まず少しハマったのが、惑星の名前やHPを表示するHUDでした。最初は惑星と一緒に3D空間へ置いていたのですが、公転すると細い文字やHPバーの縁がチラついて見える問題が出てきました。
いろいろ試した結果、読ませる情報は3D空間に置かず、Screen SpaceのUIとして表示する方式へ変更しました。惑星の3D座標を毎フレーム画面上の座標へ変換して、その位置へ名前・HP・HPバーを追従させる方式です。
これでチラつきはかなり改善しましたが、今度は惑星がカメラへ近づくほどHUDとの距離が離れて見える問題が発生しました。そこで惑星のRendererの上端を基準にして、そこから画面上で一定距離だけ上へHUDを置く方式に変え、かなり自然に追従するようになりました。
惑星表面のShader
次は惑星表面用のShader Graphを初めて作りました。Textureの模様と属性カラーをShader内で掛け合わせるようにして、現在は同じ表面Textureを使いながら、PlanetStateの属性によって色を変えられる構成になっています。
ここで自転が一度動かなくなるトラブルもありました。調べてみると、これまでの自転は惑星そのものを回していたのではなく、MaterialのTexture Offsetを動かして「回っているように見せる」方式だったため、新しいShaderへ変更したことで効かなくなっていました。
せっかくなので、このタイミングでPlanetRotationViewも整理しました。現在はTextureを動かすのではなく「惑星のTransformそのものを回転させる」本当の意味での自転になっています。
大気的なものを追加
さらに惑星の外側へ、少し大きなSphereをもう1枚重ねて大気も追加しました。Fresnelという、カメラから見て物体の縁ほど強く表示する仕組みを使い、中心はほぼ透明で外周だけ薄い水色に光るようにしています。
大気は惑星表面とは別のShaderとMaterialに分離しています。惑星本体は地表を描画し、大気はFresnelだけを担当する形にして、今後グラフィックを強化しても一つのShaderが巨大化しないようにしました。
Profilerによる処理負荷確認
見た目だけでなく、今回はProfilerも使って処理負荷を確認しました。1惑星での通常フレームはCPU約2.1〜2.3ms程度で、60fpsの16.67msに対して現時点ではかなり余裕がありました。
そこで、Planet HUDのLateUpdate()が毎フレーム82Bのメモリを確保していることも発見しました。原因はHPが変わっていなくても毎フレーム「HP 100/100」という文字列を作り直していたことで、値が変化したときだけ更新するよう修正した結果、GC Allocを82Bから0Bまで減らせました。
Full HDサイズでの目視チェック
最後にGame ViewをFull HDの1920×1080へ固定し、実際の提出画面を想定した状態でも確認しました。赤い惑星、表面Texture、自転、公転、大気、名前、HP、HPバーが同時に表示され、Week8で目標にしていた「1個の惑星をUnity上でゲームらしく表示する」ところまで一通り完成です。
↓↓↓Full HDサイズテスト（動画）
途中でPCが突然デバイスエラーを出して自動再起動する事件もありました。幸いShader GraphやPrefabは残っており、大気MaterialのShader指定だけ元に戻っていたので、そこを修正して無事復旧できました。
これで開発ロードマップ上はWeek8完了です。全16週でContest Alphaを作る計画なので、週数だけで見るとちょうど折り返し地点で、残りはWeek9〜16の8週間分になります。
ただし後半は、恒星jyori、10惑星同時表示、戦闘、能力、流星群、Planet Event、Leaderboard、契約、Channel Points Eventなど、画面上で派手に動く要素が一気に増えていきます。そのため「ゲーム全体が半分完成した」というより、ここまでで基礎工事と1惑星の表示基盤がかなり固まり、これからその上へMother Planets本来のゲーム部分を積み上げていく段階という感覚です。
そして次のWeek9から、いよいよ画面中央の主役になる恒星jyoriを作り始めます。恒星の表面、Corona、発光、そして最終的には極太レーザーまでつながっていく予定なので、ここから見た目もかなりMother Planetsらしくなっていきそうです。
