webと連動したリアル周遊コンテンツ「リアル桃鉄」

OVERVIEW概要

岡山市さまとゲーム「桃太郎電鉄」のコラボレーション企画として「リアル桃鉄」のwebアプリケーション「リアル桃鉄」を制作しました。実際に岡山を周遊しながら「桃太郎電鉄」のゲーム行う事ができる体験型ゲームです。

ASSIGNMENT課題

岡山にあるたくさんの魅力的なポイントを巡っていただくために多くのポイントを用意することが一番の課題でした。コンテンツ的な難しさではユーザの行動が多岐に渡るためどのような行動を取っても破綻しない仕様を作ること、野外でゲームをプレイすることもあり画面遷移時のリロードによるストレスを軽減することが課題でした。

OUTCOME成果

回遊スポットとして様々な場所を巡ってもらう作りにし多くの方々にゲームを楽しみながら岡山の魅力に触れていただくことが出来ました。またあらゆるユーザーの操作を考慮したゲームシステムを実装しストレス無く楽しんでいただく事ができました。

APPROACHアプローチ

Vue.jsによるSingle Page Aplication（SPA）での開発

画面遷移時のリロードによるストレスを軽減するため画面間の移動がスムーズになるVue.jsを用いて開発しました。

あらゆるユーザーの操作を考慮したゲームシステムの実装

ゲーム内にはクイズが出題されその正解・不正解によって手持ちの金額（持ち金）が変動するQRコードと、アイテムが獲得できるQRコードがありクイズに正解したりアイテムを手に入れたりすることで持ち金を増やすことができます。クイズで不正解の場合は持ち金の額によってマイナスされる金額が変動する、ユーザーの持ち金の額によって効果が発動しないアイテムがあるなど条件によって結果が異なる仕様を実装しました。またゲーム内では次に向かうスポット（=読み込むQRコード）を指定しますがゲーム側で指定している順番でスポットを回らない、指定していないスポットのQRコードを読み込む、同じQRコードを読み込む、といった様々なユーザーの動きが考えられたためユーザーがゲーム側で指定している順番以外でQRコードを読み込んだ場合にもゲームを正常に続行できる仕様を検討して実装しました。