GoogleのGemini 2.5 Flashで、Multiple-Choice Question (MCQ)多選択肢問題を作成してみます。HTMLファイルを作成し、設問に従って選択肢をクリックすると、正解かどうか分かるようにします。いわゆる、Quizクイズの作成で、作成されたHTMLファイルはウェブサーバーにアップロードして、外部からもアクセスできるようにします。
Google Chromeを開き、下の図のように右上のメニューボタンから、Geminiを開きます。
Google Workspace Business Standardを契約しているので、Gemini 2.5 Flash、2.5 Pro (preview)、Personalization (preview)が使えますが、2.5 Flashを使うことにします。
Geminiでは、今までの使用履歴が残っていて、それを前提に回答が作成されますので、チャットを新しいセッションとして始めるためには、左上の2つ目のアイコンをクリックし、チャットを新規作成をクリックしてから始めます。今回は、すでに、新しいセッションとして扱われていたので、チャットを新規作成部分はdim状態でしたので、そのままプロンプトを書き込むことにします。
まず情報ソースとして、Web pageを指定し、その内容に基づいて、MCQを作成しようと思います。そこで、以下のプロンプトをあらかじめテキストエディターで書いておき、コピペします。
https://info.zanet.biz/lec/srsz/1-rob-main/one.htm
このウェブページの情報に基づき、多選択肢問題の内、5者択一問題を作成し、インタラクティブなHTMLファイルを作成してください。
設問は「次の内、正しいものはどれか？」を基本形とします。一部は「次の内、誤りはどれか？」としてもよい。
正しい選択肢を太字にする必要はありません。
表現から正誤の判断ができないようにするため、間違いの選択肢の表現は「・・・ではない」のような否定形は可能な限り使わないようにします。
いずれかの選択肢を選ぶと、即座に、正しい場合は「正解です！」と表示します。間違っている場合は「誤りです！」と表示します。
回答を確認のボタンは不要です。
一つの問題を何回もチャレンジできるようにします。
系統的レビューではなくシステマティックレビューとしてください。
ソースに基づくという記述は不要です。
正解が選択肢の1から5の特定の番号に偏らないようにしてください。
1問1ページとし、Prev、Nextのボタンを付けてください。
ポップアップメニューで問題を移動できるようにしてください。
全部で10問作成してください。かなり、細かく指定しています。ソースは私の担当したある講義のための学習資料で、PowerPointで作成したスライド＋ノートからHTMLファイルを作成したものです。
このプロンプトを書き込み、実行すると、思考プロセスを表示となり、数分で、HTMLのフィールドにコピペ可能な形で、出力されます。コピーボタンをクリックして、NotePad++やメモ帳などに貼り付けて、そのまま、例えば、quiz-rob-c.htmのようなファイル名でファイルを保存します。拡張子は.htmまたは.htmlとします。
その内容は<!DOCTYPE html>から始まり、</html>で終わる、HTMLファイルなので、保存したファイルをダブルクリックしてブラウザーで開くとこのようになります。
これでいいように見えるのですが、選択肢を一度クリックすると変更ができないようになっていました。
プロンプトでは、”一つの問題を何回もチャレンジできるようにします。”と指示したのですが、実現されていませんでした。
そこで、より具体的な指示、”一つの問題で、一度選択肢をクリックしても、何回も変更がチャレンジできるようにしてください。”を書き込んでみます。前の指示が履歴で残っているので、このプロンプトだけで十分です。
このような回答とともに、修正されたHTMLが出力されました。これを上記のようにテキストエディターにコピペして、HTMLファイルとして保存して開くと、以下の様でした。
まず、正解の選択肢をクリックした場合です。
誤った選択肢をクリックした場合です。
これで、正解を確認しながら、別の問題へと進めていくことができます。
ここで、注目すべきは、Geminiでは一つのセッションが続いている間は、前のやり取りを前提に回答が作成されるという点です。これは非常に重要だと思います。
今回は、情報ソース、つまり、学習資料がウェブページなので、それぞれの問題の元になる箇所へのリンクをタイトル部分の問題という箇所に付けられないか聞いてみたいと思います。
すると、そのまま改訂したHTMLテキストが出力され、保存したHTMLファイルを開くと、確かに問題の所にウェブページへのリンクが付けられていました。
最後に作成したMCQをウェブページとして閲覧できるようにしました。
今回は、問題ごとにカードのように表示するようにしましたが、1ページに全部を表示する形式にもできます。
プロンプトに”全問題を1ページに表示するようにし、移動のボタンは無しにしてください。”と書き込み実行すると、以下の様な回答になりました。
そのHTMLはこちらです。
それでは、最後にチャットを新規作成して同じプロンプトで再度MCQを作成してみましょう。
最初のプロンプトでは、HTMLファイルはできないという回答になり、”前のセッションではHTMLファイルができましたよ。”とのプロンプトでは、ご希望の形式をお知らせいただければ、それに沿ったコードの生成を試みます、との回答でした。
そこで、”1つのファイルにすべてのHTML、CSS、JavaScriptを含める形式にしてください。”とのプロンプトで、最初のようにMCQのHTMLテキストが作成されました。
右側が新しく作成されたMCQです。内容が変わっています。また、形式も変わっています。設問のすべての出だしが、”次の内正しいものはどれか？：”になっていたのが亡くなっています。設問の”次の内正しいものはどれか？：”の部分は不要ですというプロンプトを追加してもよかったのですが、指示しなくてもなくなっていました。
違う問題が作成されるということは、非常に重要です。追再試験の作成にも使えると思われます。新規セッションで再度作成したMCQはこちらです。
さらに、最初のプロンプトを少し修正して、HTMLのコードを作成するように書き換えてみました。
https://info.zanet.biz/lec/srsz/1-rob-main/one.htm
このウェブページの情報に基づき、多選択肢問題の内、5者択一問題を作成し、インタラクティブなHTMLコードを作成してください。
設問は「次の内、正しいものはどれか？」を基本形とします。一部は「次の内、誤りはどれか？」としてもよい。
正しい選択肢を太字にする必要はありません。
表現から正誤の判断ができないようにするため、間違いの選択肢の表現は「・・・ではない」のような否定形は可能な限り使わないようにします。
いずれかの選択肢を選ぶと、即座に、正しい場合は「正解です！」と表示します。間違っている場合は「誤りです！」と表示します。
回答を確認のボタンは不要です。
一つの問題を何回もチャレンジできるようにします。
系統的レビューではなくシステマティックレビューとしてください。
ソースに基づくという記述は不要です。
正解が選択肢の1から5の特定の番号に偏らないようにしてください。
1問1ページとし、Prev、Nextのボタンを付けてください。
ポップアップメニューで問題を移動できるようにしてください。そのポップアップメニューは設問の右側に置いてください。
全部で10問作成してください。このプロンプトではこのような形式になりました。
さて、情報ソースをWeb pageのURLで指定しましたが、Gemini 2.5 Flashでは、PDFファイルを指定することもできます。その場合は、用意したPDFファイルをプロンプトを入力するフィールドにドラグアンドドロップします。そして、同じようにMCQ作成のプロンプトを書き込みます（コピペします）。
このような画面になります。同じようにMCQのHTMLコードを作成してくれました。
さて、Geminiが作成したMCQの内容は最終的に人がチェックする必要がありますが、ほとんどの場合、そのまま使えるレベルです。今回の例はGeminiが作成したMCQをそのまま提示しています。なお、YouTubeの動画を直接、情報ソースとして読み込ませることはできません。
NotebookLMでは、複数のPDFファイル、YouTubeの動画、Web pageを情報ソースとしてアップロードして、同じようなプロンプトで、MCQを作成することができます。
MCQの作成は、学習資料がPDF, Web page、あるいはYouTubeの動画であれば、教える側も、学ぶ側も、可能であるということになります。これはとても重要な点だと思います。
また、教える側は初心者レベルの質問を用意して、学ぶ側はそれを自分でプロンプトとして入力して、回答を確認する。それが済んだら、より複雑な質問を用意して、学ぶ側はそれを自分でプロンプトとして入力して、回答を確認する。それが済んだら、学ぶ側は各自自分の疑問に思うことをプロンプトで聞きながら、理解を確認するというやり方ができます。学ぶ側は、最初は知識がないので、何を質問したらいいかもわからないので、初心者レベルの質問は教える側が、用意してあげるということに意味があると思います。より複雑な質問も、教える側が用意することで、学ぶ側に教える側の観点が伝わっていくと思います。