Stadium App™ - 「Unity as a Library」を使った適材適所のアプリ設計について

株式会社スタジアムエクスペリメントの「Stadium App™」開発で、アプリ設計とUnity実装を担当している森慶太です。
今回の記事では、「Stadium App™」がどのような思想で、どのような設計がされているのか？を紹介していきたいと思います。

森 慶太 (Keita Mori) / Engineer
大学卒業後、大手ERPパッケージ開発会社、株式会社奇兵隊の取締役CPOを経て、2019年にPARTYに参加。Androidアプリとバックエンドの開発をメインに、UX設計やグロース施策の策定など、サービスを一貫して設計・開発することを得意とする。また、「料理とプログラミングは人生を豊かにする」をモットーにCooking Programmerとしても活動をしている。
https://twitter.com/d_forest

Stadium App™は「SNS」であり、「GAME」でもある。

株式会社スタジアムエクスペリメントが開発をしている「Stadium App™」は現在、サッカークラブにおけるファンコミュニティのDXに挑戦しています。

「Stadium App™」は、SNSアプリによくある要素を持つのと同時に、スタジアムで応援しているときのような盛り上がりを派手な演出で再現する、という「GAME」のような要素も持っています。

SNSの要素を持つ部分は、スクロールやテキスト入力などのいわゆるアプリ的な操作が多いため、Native実装した方が軽快な操作感を短時間で実装できます。

一方で、GAME要素の部分は3D空間上の演出で派手に見せる必要があるので、Unityなどのゲームエンジンで実装したほうが効率的に実装できます。

また、実装を始めるときの実装メンバーのスキルセットやスケジュール的にも、Native実装とゲームエンジン実装を並行して行ったほうが良いことが分かっていました。

そのような要件で調査をしたところ、以下の二つの記事を見つけました。

【Unity】Mirrativのアバターがなんで動いているのか誰にもわからないので説明する - Mirrativ tech blog

ネイティブモバイルアプリケーションに Unity で作成した機能を追加できる「Unity as a Library」のご紹介 | Unity Blog

ひとつめの記事は、MirrativeがアプリをNative実装とUnity実装のハイブリッドで作っているという内容です。
ふたつめの記事は、Mirrativeの開発方法をUnityが「Unity as a Library」として公式にサポートを始めたという内容です。

これらの記事によると、Unityはバージョン2019.3からハイブリッド実装を公式にサポートを始めたようですが、それ以前からEmbedded Unityという方法でハイブリッド実装が可能だったようです。
また、Unity as a Libraryのサンプルを見てみると、Embedded Unityでやられていることと内容はほとんど同じであることがわかりました。

つまり、すでにリリースされているアプリで実装実績があり、最新のUnityバージョンで公式にサポートされている、ということが記事を通じて分かりました。

これを受けて、「Stadium App™」はUnity as a Libraryを使って、軽快なUIが必要な箇所はNativeで実装し、3D空間で派手に演出したい箇所はUnityで実装するという設計を採用することになりました。

Unity as a Library でハイブリッド実装

Unity as a Libraryを利用すると、下記の画像のようにUnityとNaitveを重ねて実装することもできます。
「Stadium App™」では試合を応援する画面で、派手な演出をUnityで実現し、チャットやメニューなどをUnityの上にNativeのViewを重ねることで、それぞれの長所の良いとこ取りをしています。

ハイブリッド実装では、UnityとNativeの間をNative Plugin（UnityからNative）とUnity Send Message（NativeからUnity）で情報のやりとりができます。
「Stadium App™」では、Unityは演出装置と操作の受けつけにスコープを留めて、APIとのやりとりやビジネスロジックはNativeで実装し、どのような演出を表示するかをNativeからUnityに指示するような設計を採用しています。

試合を応援する画面では、自分以外のユーザーが応援している様子がリアルタイムに自分の画面でも分かるようになっています。その部分はFirebaseのCloud Firestoreをフル活用して実現しています。Cloud FirestoreはUnityからも直接使えますが、Native実装のほうが知見と実装事例が多いのと、ビジネスロジックをNativeに実装する設計にしたので、Nativeを通してUnityに反映をトリガーするようにしています。

このように、「Stadium App™」では、最新の技術を積極的に採用してアプリ開発を行っています。

______________________________________

一緒にサービスを創ってくれるエンジニアを募集中！

株式会社スタジアムエクスペリメントでは、積極的に最新技術を使って設計・開発したいエンジニアを募集しています。

ぜひ気軽にカジュアル面談に応募してください。転職意向がなくても、今回紹介した設計や利用している技術をもっと詳しく聞いてみたい、という理由で応募いただいても大丈夫です！