はじめに ライフゲーム（海外だとGame of Life）という生物学的モデルシュミレーションを３次元で作成してみました。 サーバーサイド Golang, クライアントUnity & React使用です。 ゲームリンク↓ そもそもライフゲームとは 聞いたことのない方が多いと思いますが、ライフゲームとは格子を生命とみなしたモデルシュミレーションです。 ユーザー自身がルールを定めてどのような生命活動が行われるかシュミレーションすることができます。 基本的には「縦 × 横」の二次元で作成されることが多いですが、 今回は「高さ」を加えた三次元で作ってみました！ ゲーム詳細 ゲームリンクはこちらです。 アピールポイント いい感じに生命循環が見られたモデルを保存できるようにしたところ 他ユーザーが作成したモデルにいいねを付けられるようにして、ランキングの高いモデルマップを実際に動かせるようにしたところ ユーザーがシュミレーションを楽しめるようにするため、生命活動のルール変更や、ステージ編集をできるようにしたところ 使用技術 アーキテクチャ図 サーバーサイド系 環境 docker Golang version1.16.2 postgres, heroku GitHubです↓ 綺麗な依存関係を意識してアーキテクチャを組みました。 こちらのgo-clean-archを参考にしています。 DIツールのwireを入れました。また、Postgresを使った理由としてはherokuの無料枠が優秀だったからです。 クライアント系 環境 Unity version2019 JavaScript(react) Vercel(デプロイ先) GitHubです↓ ゲーム部分はUnityで、 webGLビルドしたファイルをreactコンポーネントとして使用できるreact-unity-webglを使いました。 Javasciptでunityの関数も動かすことができるので非常に便利なライブラリだと思います。 　 頑張ったこと 無料枠を意識した herokuやVercelを利用してなんとか全部無料で永続化できました。 ユーザーがモデルを保存できるところ 3Dのライフゲームをネットで検索してみると、保存が効かないものが多く考察があまりできないことが多かったので頑張りました 改善したい箇所 ルールなどの考察が開発者自身も不十分 作成することに頭が行きがちだったので今後考察して改善していきたいです。 UI... 改善したいです。 おわりに ここまで読んでくださりありがとうございました！ 実はこの製作物は友人とハッカソンのために面白そうだから作ったのですがあまり受けませんでした。。。（少し尖っていたかも） 本ゲームの不具合、改善点、技術的な疑問点などありましたらご気軽に質問ください！ また、よろしければ遊んでみてください！！

1　折り畳み機能とは こういうもののこと↓↓ buttonを押すと下に出てきて、もう一回押すと収納される、みたいな。 下に出したとき、これに合わせて、そのさらに下にあった要素も下に下がってくれる、といったもの。 語彙力がなくて申し訳ない…。 2　準備 縦一列に要素を並べるScroll Viewでの使用を想定している。 こういうのができていたら、前提となる状況の理解としては問題ない。 ちゃんとした手順説明が必要な方はこちら。 3　実装方法 UIの配置だが、まずScroll ViewのContentに空オブジェクトを配置する。 その空オブジェクトにImageを二つ、うち一つのImageの子にButtonを一つ配置。 今回は、折り畳み部分に該当するImageのUIの色を、わかりやすく赤色にしてみた。 後は一番上の空オブジェクトに、いくつかコンポーネント追加。 Content Size Fitterをつける意味が気になる方は、先ほど挙げたブログを2ページまでじっくり読んでほしい。 ざっくりいうと、子オブジェクトに合わせて親のアンカーを弄れるようにしないと、折り畳み部分が下のオブジェクトと重なったりしてしまうから。 UIの細かい配置は個々お任せで。 私はButtonを右端に寄せてみた。 4　スクリプト 後はこのスクリプトを空オブジェクトにアタッチすれば完成。 Buttonを180度回転させるプログラムも組んであるが、不要ならば消してほしい。 FoldingSystem.cs using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; public class FoldingSystem : MonoBehaviour { //折り畳み部分を取得 GameObject FoldinfImage; //折り畳み部分を表示するか非表示にするか bool OpenFold = false; //ボタンの画像を回転 RectTransform button; VerticalLayoutGroup contentLayout; void Start() { FoldinfImage = transform.Find("Image2").gameObject; button = transform.Find("Image/Button").GetComponent(); contentLayout = GameObject.Find("Content").GetComponent(); } void Update() { } public void OnClickSetInfo() { if (OpenFold) { button.localRotation = Quaternion.Euler(0, 0, -90); FoldinfImage.SetActive(false); StartCoroutine("LayoutRenewal"); OpenFold = false; } else { button.localRotation = Quaternion.Euler(0, 0, 90); FoldinfImage.SetActive(true); StartCoroutine("LayoutRenewal"); OpenFold = true; } contentLayout.enabled = false; contentLayout.enabled = true; } IEnumerator LayoutRenewal() { //1フレーム停止 yield return null; //再開後の処理 contentLayout.enabled = false; contentLayout.enabled = true; } } 要するに、ContentオブジェクトのVertical Layout Groupをオンオフして、レイアウトを再構築させるような処理。 なぜかコールチンなしで普通に書き連ねても動かない。なんでかなぁ…。

CSS等でよく表現されるメニューやボタンを順番に表示するアニメーションをUnity上で再現する方法を考えてみました。要素を追加すると自動的にアニメーションを開始するCSSのanimationの仕様を見て思いついたものです。 ObjectShifter.csをエディターではなく、Awake時にスクリプトでアタッチします private void Awake() { ParameterButtons = new ObjectShifter[11]; ParameterButtons[0] = btn0.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[1] = btn1.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[2] = btn2.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[3] = btn3.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[4] = btn4.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[5] = btn5.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[6] = btn6.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[7] = btn7.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[8] = btn8.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[9] = btn9.gameObject.AddComponent<ObjectShifter>(); ParameterButtons[10] = btn10.gameObject.AddComponent<ObjectShifter>(); foreach (ObjectShifter Shifts in ParameterButtons) { Shifts.SetHidePosition(Vector3.left * 360); } } SetHidePositionで移動先の位置を設定します 以下のように配列に命令をすると順に表示されます duration オブジェクトが隠れるまたは表示されるまでの時間 delayper 次のオブジェクトが移動を解するまでの遅延時間 public void ShowParameteres(float duration, float delayper) { for (int i = 0; i < ParameterButtons.Length; i++) { ParameterButtons[i].Show(duration, delayper * i); } } public void HideParameters(float duration, float delayper) { for (int i = 0; i < ParameterButtons.Length; i++) { ParameterButtons[i].Hide(duration, delayper * i); } } GameObjectであれば何でもカスケード表示ができます。 ObjectShifter.cs using System.Collections; using System.Collections.Generic; using UnityEngine; public class ObjectShifter : MonoBehaviour { private Vector3 DefaultPosition; private Vector3 HidePosition; private Vector3 PrePosition; private Vector3 ToPosition; private void Awake() { DefaultPosition = HidePosition = PrePosition = ToPosition = transform.localPosition; } private float Delay = 0; private float Duration = 0; private float CurrentTime = 0; public bool toHide = true; public bool isHide { get { return Vector3.Distance(HidePosition, transform.localPosition) <= Vector3.kEpsilon; } } public void SetHidePosition(Vector3 ShiftPosition) { HidePosition = DefaultPosition + ShiftPosition; } public void Show(float duration, float delay = 0) { Delay = delay; Duration = duration; CurrentTime = 0; PrePosition = transform.localPosition; ToPosition = DefaultPosition; } public void Hide(float duration, float delay = 0) { Delay = delay; Duration = duration; CurrentTime = 0; PrePosition = transform.localPosition; ToPosition = HidePosition; } public bool isAnimation { get { return Duration > 0 && Duration > CurrentTime; } } // Start is called before the first frame update void Start() { } // Update is called once per frame void Update() { if (Delay > 0) { Delay -= Time.deltaTime; } else { if (isAnimation) { CurrentTime += Time.deltaTime; float r = Mathf.Clamp01(CurrentTime / Duration); //EaseOut r = -r * (r - 2.0f); transform.localPosition = Vector3.Lerp(PrePosition, ToPosition, r); } else { transform.localPosition = ToPosition; } } } }

目的 以下のようなTPS視点でオブジェクトを射出する動作を作りたい 必要な処理 キャラクターを作る カメラの設定 オブジェクトを作る オブジェクトを生成、動かす 1.キャラクターを作る 以下を参照しました https://xr-hub.com/archives/13135 2.カメラの設定 以下を参照しました https://qiita.com/K_phantom/items/d5d92955043137a59d8f 3.オブジェクトを作る なんでもよいので、キューブオブジェクト等を作成します そしてプレハブ化させておきます 4.オブジェクトを生成、動かす ボタンを押されたときにオブジェクトが生成されるようにスクリプトを記載します キャラクター（ユニティちゃん）にアタッチしておきます UnityChanController.cs using System.Collections; using System.Collections.Generic; using UnityEngine; public class UnityChanController : MonoBehaviour { //ユニティちゃんを格納する変数 public GameObject player; //プレハブ名 public GameObject BindCube; //ポジション private Vector3 playerpos; private Vector3 bindcubepos; // Start is called before the first frame update void Start() { } // Update is called once per frame void Update() { if (Input.GetKeyDown(KeyCode.X)) { playerpos = this.transform.position; bindcubepos = new Vector3(playerpos.x, playerpos.y + 2, playerpos.z); bindcubepos += transform.forward * 2; Instantiate(BindCube, bindcubepos, player.gameObject.transform.rotation); } } } 前に生成されるように bindcubepos += transform.forward * 2; としています プレハブはインスペクターで設定します そして、射出したいプレハブ化したオブジェクトに 以下のスクリプトをアタッチします。 BindCubeController.cs using System.Collections; using System.Collections.Generic; using UnityEngine; public class BindCubeController : MonoBehaviour { //オブジェクトの速度 public float speed = 0.05f; //オブジェクトの横移動の最大距離 public float max_alive = 10.0f; //プレハブ public GameObject BindCube; //ユニティちゃんを格納する変数 public GameObject player; // Start is called before the first frame update void Start() { Ray ray = Camera.main.ScreenPointToRay(Input.mousePosition); Vector3 worldDir = ray.direction; GetComponent<BindCubeController>().Shoot(worldDir * 700); } // Update is called once per frame void Update() { //オブジェクトが生き残る時間 if (max_alive < 0) { Destroy(this.gameObject); } max_alive -= Time.deltaTime; } public void Shoot(Vector3 dir) { GetComponent<Rigidbody>().AddForce(dir); } } カメラ⇒マウスカーソルの位置へ射出されるようにしています まとめ 基本的な処理過ぎて探しても載っていなかったためまとめました。 参考になれば幸いです。