kimitashoichi / quiz-app Goto Github PK

全画面

• タイトル画面
• メニュー画面
• 回答画面
• 結果表示画面

---

全画面共通仕様

• 画面上部と下部にバナー広告を表示

タイトル画面

• アプリのタイトルを表示
• スタートボタンを設置 --> 押したらメニュー画面に遷移

メニュー画面

• 難易度を選択可能
  • easy / normal / hard の３段階
• タイトルへ戻るボタンの設置

回答画面

• 問題文表示コンポーネント
• 回答表示コンポーネント
  • 回答は４択形式にする
• 現在の回答問題数表示コンポーネント
  • 2/10 のように表示する
• 正解/不正解のアニメーション

結果表示画面

• 正解数を表示する
  • 2/10 のように表示する
• タイトルへ戻るボタンの設置
• もう一度挑戦するボタンの設置

TODO

• メニュー画面でユーザーがレベルを選択したときにデータ取得できる様にする
• メニュー画面にデータ取得完了かどうかの確認処理を追加

TODO

• 問題を全て回答し終えた時の処理を実装する
• 回答後に結果画面に遷移する処理を実装する
• 結果画面のモックだけ作成し、画面遷移ができているか確認する

TODO

• 問題数と正解数を表示させる
• ボタンを設置してタイトルに戻るようにする

TODO

• 回答画面のレイアウト調整

TODO

• 選択肢と問題文が合っていない気がするので調査する
• 不具合だった場合は原因をコメントに記載
• 修正する

TODO

• firebaseでDB作成
  • DB設計
  • データ投入方法の設計
  • #16
• メニュー画面から回答画面に遷移するときにDBから問題データを取得する処理を作成

TODO

• どのように広告を表示させるのかを調査する
• 広告表示の実装方法を調査する

それぞれ調査結果はコメントで記載する

TODO

• 問題データの投入方法を設計する

方針

• firebaseで手動投入
• WEB画面で問題データを投入できる管理画面的なものを作成

TODO

• menu画面のレイアウトを調整する

TODO

• メニュー画面でユーザーが選択した問題のレベルによって、データを取得するコレクションを変更できる様にする

TODO

• メニュー画面でレベルを選択した後に、回答画面へ問題データを渡せる様に実装する
  • 問題文データと選択肢データがバラバラに存在しているので、それをIDでフィルターをかけて、合致するようなロジックを作成する
  • データが正しく表示されているか確認する

TODO

• タイトル画面のレイアウト作成

firebase

• DBはfirebaseを仕様する
• 認証機能は無し
• 広告の表示設定（admob）

deploy

• expoでできるっぽい

TODO

• 以下の対象画面を今っぽいデザインになるようにスタイルを調整
  • #33
  • #34
  • #35
  • #36

ブランチ

base-branchをlayout-developで開発していく

TODO

• #5 で作成したコンポーネントをscreenとして組み込み
• 画面デザインの調整
  • 現在の回答問題数表示させる
• データフローを設計する
  • 問題文と選択肢をどのように各コンポーネントに渡すか
  • 回答数と正解不正解のデータ保存方法
    • 回答数の保存は実装済み

TODO

• 問題文表示コンポーネントを作成
• 選択肢表示コンポーネントを作成

TODO

• タイトル画面にスタートボタンを設置する
  • ボタンを押したらメニュー画面に遷移する様にする
• メニュー画面のモック作成
  • ボタンの動きを確認するまでこのissueで行いたいので、メニュー画面のモックだけ作成し、動作確認まで行う

TODO

• 問題データ取得までに若干の時間がかかるので、オーバーレイでロード画面を表示させる
• 選択肢コンポーネントの繰り返し表示にkeyプロパティをつける様にする

TODO

• アニメーションの実装方法の調査
  • アニメーションを表示させるコンポーネントを設計する
    • どこのコンポーネントにアニメーション表示機能を持たせるか
• 正解の時のアニメーション作成
• 不正解の時のアニメーション作成

TODO

• 開発中に残したTODOを片付ける

TODO

• アプリのタイトル画面コンポーネントを作成する
• アプリのタイトルを表示できる様にする