AIとCodexで専門知識クイズ200問・3コースを作った実録｜全テスト通過まで

200問の専門知識クイズを作りましたが、そのまま100問・200問コースを見せる初期案は長すぎました。実際に遊んでから、問題データは残し、日常的に完走できる10問・20問・30問の3コースへ変更しています。

画面のスクロールと固定ヘッダーの重なりも直し、当時のlint・build・自動テスト通過まで確認しました。第三者の操作確認と外部公開は未実施です。

200問を出題候補として残した

基礎から難しい内容まで最初の100問を作り、さらに重複しにくい100問を追加しました。画像問題は権利、統一、トリミングに時間がかかるため、まずテキストだけで完成させる判断です。

問題データを減らしたのではありません。200問は内部の出題候補として残し、利用者が一度に解く量だけを短くしました。

最初は10問、30問、100問、200問の4コースでした。修正指示で旧コースが残ったため、「提案ではなく確定要件」と明記して再指示し、3コースに統一しました。

単純なシャッフルで同じ分類が続く状態も、分類の残数、直前の分類、タグの重なりを見て出題順を調整しました。

実際に中級を遊ぶと、上部情報が大きく、毎問スクロールが必要でした。上部をコース名、問題番号、進行、時間に絞り、補助操作は小さなメニューへ移しました。

固定ヘッダーの色や影を変えても問題文との重なりが残ったため、見た目の調整を止め、ヘッダーと本文のスクロール領域を分離しました。390px幅で横スクロールがないことも確認しています。

回答後は正誤を短く表示し、自動で次問へ進む方式へ変更しました。最新確認では1問目の遷移は781ミリ秒でした。

開発環境がなく起動できない状態から、Node.jsと必要なツールを導入し、ブラウザーで3コースを完走しました。途中離脱、再読み込み、再開も確認しています。

Codexではlint、build、testを実行し、4ファイル5テストが通ったと報告されました。この「全テスト通過」は当時用意した自動テストの範囲を指し、第三者テストまで終わった意味ではありません。