インターネットコンテンツを作成していると、クイズを作りたくなることもあるでしょう。そして、ランダムに出題したいこともありましょう。ここではその方法を記します。
写真1. ザクセン州(ドイツ)のドレスデン中央駅で連結されるブルーの機関車(サックスブルーという慣用色があります)
ソースコードの一例
実際のソースコードの一例を示します。
- <?php
- (データベースへの接続なので省略)
- //出題する色を表示
- $num=rand(1,31);
- foreach ($dbh->query('select * from kanyokyoka where id='.$num.'') as $row){
- }
- echo '<div style="width:300px; height:200px; background-color:',$row['color'],'"></div><br>';
- //出題する色の選択肢を入れ替える
- $question = array();
- $question = array($row['name'],$row['other1'],$row['other2'],$row['other3']);
- shuffle($question);
- ?>
- <form method="POST">
- <?php foreach($question as $value){ ?>
- <input type="radio" name="question" value="<?php echo $value; ?>" /> <?php echo $value; ?><br>
- <?php } ?>
- <input type="hidden" name="answer" value="<?php echo $answer ?>">
- </form><br>
- <?php
- echo '<div style="width:300px; height:200px; background-color:',$row['color'],'"></div><br>の正解は';
- echo $row['name'];
- echo '<br><br>';
- ?>
- <form method="POST"><input type="submit" value="次の問題へ"></p>
- </form>
要件：作りたいクイズの条件
まず、作りたいクイズの条件を列挙します。ここではクイズ作成のプログラミングに対する記述ですので、中身については触れません。
- 問題がランダムに出題される
- 問題の選択肢がランダムに並べ替えられる
※選択肢の順番が入れ替わるということです
具体例については、以下のページをご覧ください。色彩検定2級の慣用色のうち31色の色名を答える問題がランダムで出題され、選択肢がランダムで入れ替わります。
概要：プログラミングの概要
今回のプログラミングの概要は以下の通りです。
- 問題、解答とダミーの選択肢をMySQLで作成
- PHPで解答をランダムに表示させるようにする
- PHPで問題をランダムに表示させるようにする
- 一覧性を重視し、問題と解答は同じページに表示
以下、その詳細を記します。
各段階の詳細
上で記したステップ1～3の詳細に触れましょう！具体例は上で示した色彩検定2級の慣用色のクイズです。
問題、解答とダミーの選択肢をMySQLで作成
PHPはそれ単独でも威力を発揮しますが、データベースシステムと組み合わせると威力を発揮します。データベースシステムにもいろいろありますが、私はMySQLを選択しています。
ここで問題文、回答、他の選択肢1～3をExcelで作成しておき、以下の記事(弊サイトではありません)を参考にしてMySQLにテーブル(1つの表のようなもの)を作成します。手入力でも物理的に可能ですが、嫌気がさすのでExcelによる作成を紹介しました。後の作業の都合上、このときにIDを付与します。Excelで作成時にIDを設定しても良いですし、MySQLでの作業時でも構いません。
私の場合、問題文に相当する列にWebカラー、正解に相当する列に慣用色、ダミーの選択肢に相当する列(3列)にダミーの色名をそれぞれ入れています。例えば以下のようにです。
- Webカラー(color)：#8b4239
- 慣用色名(name)：鳶色(とびいろ)
- ダミーの選択肢1(other1)：海老茶
- ダミーの選択肢2(other2)：マルーン
- ダミーの選択肢3(other3)：弁柄色
なお、これらは間違えやすいと個人的に思っています。どれだけ色が近いのかは、慣用色一覧(色彩検定2級対策)をご参照ください。
PHPで特定の問題を1問出題する
まずはデータベースに接続し、特定のIDについての問題を出題してみましょう。
- <?php
- (データベースへの接続なので省略)
- //出題する色を表示
- foreach ($dbh->query('select * from kanyokyoka where id=1') as $row){
- }
- echo '<div style="width:300px; height:200px; background-color:',$row['color'],'"></div><br>';
- //出題する色の選択肢を入れ替える
- $question = array();
- $question = array($row['name'],$row['other1'],$row['other2'],$row['other3']);
- shuffle($question);
- ?>
- <form method="POST">
- <?php foreach($question as $value){ ?>
- <input type="radio" name="question" value="<?php echo $value; ?>" /> <?php echo $value; ?><br>
- <?php } ?>
- <input type="hidden" name="answer" value="<?php echo $answer ?>">
- </form><br>
- <?php
- echo '<div style="width:300px; height:200px; background-color:',$row['color'],'"></div><br>の正解は';
- echo $row['name'];
- echo '<br><br>';
- ?>
- <form method="POST"><input type="submit" value="次の問題へ"></p>
- </form>
ここで、以下の3行を入れたことがポイントです。
- $question = array();
- $question = array($row['name'],$row['other1'],$row['other2'],$row['other3']);
- shuffle($question);
まず、選択肢4つを1つの変数とし、その変数を配列としておきます(変数の定義を提示するまえに、変数が配列であることを宣言するとエラーが出ません)。そしてその変数をshuffle($question)でランダムに入れ替えます。ここでは変数名をquestionとしましたが、何でも構いません。
乱数を活用して出題する問題をランダムにする
次に乱数を活用し、出題する問題をランダムに選んでもらいます。真の意味で乱数はランダムではないとのことですが、あくまでもクイズを作成する順番をある程度ランダムにするためですので、ここでは触れないことにしましょう。
ここのコードを以下のコードに書き換えます。
- foreach ($dbh->query('select * from kanyokyoka where id=1') as $row){
- }
- $num=rand(1,31);
- foreach ($dbh->query('select * from kanyokyoka where id='.$num.'') as $row){
- }
ここでのポイントはnumという変数を1～31の乱数としたことです。ここで乱数を使いたいがためにデータベースのidで数字を使ったのです。
また、id=1をid=$numに変えるだけではidが$numという数字であると認識してしまい、発生させた乱数と認識してもらえません。$numを変数であることを認識するために'$num'とする必要があります。ただし、もともと'$num'は''の中に入っています。そのような場合、そのまま記述するだけではエラーになってしまいます。そこで、'.$num.'というように.(ドット)をはさむ必要があります。
4択のクイズ作成のまとめ
今回、4択クイズの作成方法を簡単にまとめました。今回のクイズは問題別の習熟度を考慮せず、単にランダムに問題を出題するだけのものです。また、処理の簡便化と一覧性の保持のために答え合わせを同じページに表示するようにしました。今回の場合は、問題の画像(例えば鳶色の画像)を選択肢と答えの間にはさみ、選択肢を見る際に正解がわからないように工夫しています。
また、類似の記事がインターネットにあるように思いますが、私の疑問にわかりやすく答える記事は見当たりませんでした。そこで、SEを本職にしていない立場だからこそできる「親切な解説」をインターネットに残そうと筆をとった(実際はキーボードを叩いていますが)次第です。