VIVITAカタリストの加々見です。
VIVITAでは普段VIVIPARTSやVIVIPROGRAMMERの製品開発に関わったり、子供がつくった会社*1の商品企画のサポートをしたり、それらを含めVIVITAやVIVISTOPを広めるワークショップの活動に関わったりしています。
VIVISTOPで開催されているVIVITA ROBOCONというロボットコンテストがあります。本稿では、そのコンテストの為にアプリをつくった経験をご紹介いたします。ちょうど上の写真の右側にプロジェクションされているアプリについてです。
その前にVIVITA ROBOCONとは、子どもたちがつくったオリジナルロボットを駆使して災害現場を模したフィールドからボールを回収し、ボールの数やそのアイデアを競うという大会です。VIVITA ROBOCON についての詳細はこちらの記事を参照ください。
点数表示アプリをつくろう
ロボットコンテストを開催の知らせを聞いた時に、せっかくなので「公式の大会っぽさ」を出したいなと思いました。そこで、個人的な経験を振り返ってみると、アイドルのコンサート・ゲーム・スポーツの大会などの会場で、公式感のある雰囲気をつくるのに一役かっているのは「大型スクリーン」と「音」ではないかと思い至りました。
ロボコンでも画面に大きく自分のロボットが表示されたり、ゲームのように点数を入れた時に音が鳴って点数のカウントが表示されるとしたら、子どもたちのテンションも上がり、いつものVIVISTOPとは違った緊張感とドキドキ感のある「公式のロボット大会」っぽさがでるのではないでしょうか。
ざっくり要件定義
作りはじめる前に簡単に要件を整理しました。
- プレーヤー情報に関して
- ロボット名の表示
- チーム戦の場合はチーム名の表示
- ゲーム情報に関して
- 残り時間の表示
- 残り時間の調整（ロボット故障時などに審判の力を借りると１０秒減るといったルールがある）
- 点数の表示
- 点数を取得タイミングの可視化
- 点数を獲得したタイミングで効果音
- カメラに関して
- プレーヤーの表情やロボットを表示
- テレビ番組のように上記のプレーヤー情報や点数情報をカメラ映像にオーバーレイ
Cycling74 Max を用いた試作
プレロボコンと言われるロボコン前哨戦が迫っていたので要件定義もそこそこに、Cycling74 Maxというビジュアルプログラミングの開発環境を用いて試作のアプリをつくって試してみました。
つくったものでテストをしていると、ロボットや自分たちの表情がスクリーン上に表示され、子どもたちも「おおっ」という反応をしていました。制限時間や点数が音で伝わったり、表示がされているのもプレーヤーや観客双方にとってコンテストが盛り上がりそうとポジティブな反応が確かめられました。更に実際に使用する事で問題点や改善点が見えてきました。例えば、試合中問題が起きた時用に一度入れた点数をキャンセルする操作を追加したりしました。
Cycling74 Maxは音をメインにCG・UIなどを組み合わせたインタラクティブアプリをビジュアルプログラミングで開発できる統合開発環境です。最近はインタラクティブなアプリケーション開発環境としてはUnityやUE4などが有名ですが、現場で修正を加えながらリアルタイムにプログラミング調整できるその手軽さから根強い人気があります。
Unity を用いた本番開発
続いて本番バージョンを開発しました。UIデザインも凝りたかったのでデザイナーの青木さんに依頼をし、要件をつたえてデザインをしてもらいました。画像を組み合わせて、状態遷移のアニメーションなど作リ込むとなるとMaxよりUnityに分があるので今回はUnityを使います。ちなみにUnityはVIVISTOPに来る子供が、ゲームやアプリをつくる際にも利用されています。
また開発・テストしていく中で「ランキング表示やロボット出場順のリアルタイム変更」といった重たい要求がでてきました。自分の手に余る機能でしたのでエンジニアの天野さんにお願いし、Google SpreadSheet & JavaScript 連携をして参加チーム名・ロボット名やスケジュールと点数の管理をできるようにして貰いました。更に最終的にはYoutube Liveを通した映像配信まで出来るようになりました！
と、こんな感じで協力をして開発を行いました。実際に大会で使用されている映像を是非御覧ください。
VIVITA ROBOCONの盛り上がりに貢献できたように思います。
反省点ですが、プレーヤーの導線上にスクリーンが無いため、振り返って点数を確認する子が多かったです。これはほんの少しプレーの時間を無駄にさせてしまっています。この点を踏まえて、ロボットの動くフィールドに直接プロジェクションをしてARのようにロボットの近くに点数や残り時間の表示をしてみたいですね。更に子どもたちのテンションもアガるのではないでしょうか。
現場がある環境で働く
イベント合わせの特注アプリケーションをつくる場合は本番直前まで環境が整わない事が多く、当日問題が発生してテンヤワンヤなんて事もあったりします。VIVITAにはVIVISTOPという環境があり、実際につくったアプリを気軽に試す事ができます。これは子供だけでなく開発者の大人にとっても良い環境と言えるのではないでしょうか。
VIVITAでは、子供のいる環境で働きたいメンバーを募集していますので、気になった方は是非エントリーしてみてください。
*1:といってもまだ登記した訳ではなく仮想です。追々本当の会社にする事も目指しています！
