BLOG

ブログ

【4期生】クイズアプリ BinaryQuest

私がインターン期間に作成したクイズアプリ「BinaryQuest」を紹介します。

BinaryQuestはプレイヤー同士が協力して敵を倒していくゲームです。出題されたクイズに正解することで敵にダメージを与えることができプレイヤーの入力は他の画面へリアルタイムに反映されます。

アプリ概要

アプリ名BinaryQuest
ターゲット専門学生、IT資格の取得を目指す人
目的二進数の計算を練習する
強みゲーム感覚で楽しみながら二進数の計算を練習できる
使用した技術Angular, TypeScript, HTML, SCSS,Firebase,Docker

ゲームの流れ

サインイン・サインアップ

BinaryQuestログイン画面

このクイズアプリではユーザの管理を行うためアカウントの作成が必須になっています。既にアカウントを持っている場合はメールアドレスとパスワードを入力してサインインします。初めてサインインする場合はユーザ名の登録を行います。このユーザ名はゲーム中に他のプレイヤーに表示されます。

ルーム作成

BinaryQuestルーム作成画面

代表者がルームの作成を行います。ホーム画面から「ルーム作成」を選択することで新しい部屋を作成することができます。この時ルームIDが発行されるため部屋主は他の参加者にこのルームIDを共有します。部屋作成後は待機画面に遷移し、参加者が全員が集まるまで待ちます。

ルーム参加

ゲームの参加者はルームIDを入力して任意の部屋に参加することができます。ホーム画面の「ルームID入力」からIDを入力することができ、ID入力後は待機画面に遷移します。

ゲーム開始

BinaryQuest部屋主ゲーム画面

参加者が全員揃ったら部屋主がゲームを開始することができます。ゲームが開始されると部屋主の画面には敵の画像とHP、残り時間が表示されます。

BinaryQuest参加者ゲーム画面

参加者の画面には二進数の計算問題が表示され正解すると敵にダメージを与えることができます。時間内に敵のHPを0にすることができればクリアです。

ゲーム終了

敵のHPを0にするか制限時間が0になるとゲーム終了です。終了後は待機画面に遷移しそのまま次のゲームを開始することができます。

アプリ開発中のあれこれ

企画

クイズアプリ制作の時初めてアプリの企画設計をしました。右も左もわからない状態でしたがメンターの方々が優しくサポートしてくれたため最終的にはとても良いものができたと思っています。今でも自分が考えたアプリの中ではとても気に入っています。

企画を考えるにあたって最も印象に残っていることは企画立案講習で教わった「マンダラート」です。

マンダラート例

マンダラートとはマス目にアイデアを書き込むことで思考を整理したり広げたりするフレームワークです。大谷翔平も使っているそうです。クイズアプリの企画だけでなく基本的にアイディア出しをする際にいつでも使えるので日常的に使うようになりました。

dottインターンではITのノウハウだけでなくこういった将来役立つような様々なことを学ぶことができます。

Firebase

FirebaseはNoSQLのデータベースや認証機能などが無料で使える便利すぎるBaaS(Backend as a Service)です。Firebaseのドキュメント

当時Firebaseを使っての開発は初めてだったため常にググりながらのコーディングで大変でした💦公式ドキュメントだけではわからないこともありGithubのコミュニティを見に行ったりもしました。

FirebaseはAngularで開発できるSPA(Single Page Application)との相性がとても良くバックエンドを自前で開発する必要がないため非常に便利です。そのため、この機会に勉強できてとても良かったと思います。その後も学校の開発の授業などでも使用しとても重宝しています。

また今回は使用していませんがバックエンド側の処理が必要になった時でも、Cloud Functions For Firebaseというサーバレス関数のサービスがFirebaseには用意されているため簡単に実装することができます。

まとめ

このクイズアプリ制作全体を通して「わからないことを自力で調べるチカラ」がかなり身についたと思います。主にインターネットでの検索ですがなかなか解決しないことでも諦めずに検索するワードを変えてみたりなどして見つけることができました。

反省点としては逆に自分で解決しようとし過ぎて周りを頼らなかったことです。視野が狭くなって沼ってしまっている時やメンターに聞けば一発で解決する問題などで時間を余計に消費してしまうことがありました。今はこの反省を活かしてわからないことがあればなるべく早く聞くように心がけています。

現在もインターンを続けていますがクイズアプリの制作同様にとても勉強になっています。インターン先をお探しの方、IT企業への就職を考えている方、ぜひdottインターンに参加してみてはいかがでしょうか?ご応募お待ちしてます!!!