#39 研修の小テストをHTMLで作る | 介護現場のAI仕事術
・難易度：★★★
・所要時間：約20分
・使うツール：Claude（無料・有料どちらでも可）
介護現場の研修で「理解度を確認したい」という場面があります。
口頭確認は手間がかかります。紙のテストは印刷・回収・採点が必要です。でもHTMLで作ったクイズなら、スマホやPCのブラウザで開くだけで使えて、その場で正誤がわかります。
Claudeに頼むと、このクイズがその場で完成します。コードを書く必要も、ファイルを編集する必要もありません。
この回でやること
Claudeに研修クイズを作ってもらう
その場でプレビューして確認する
テーマ・問題数・デザインをカスタマイズする
HTMLファイルをダウンロードして施設で使う
※返答例はイメージです。実際の出力は毎回異なります。
Lv.1 Claudeに研修クイズを作ってもらう
claude.aiを開いて、以下のように指示します：
「介護職員向けの研修用クイズをHTMLで作ってください。テーマは「感染症対策の基本」で、4択問題を5問作ってください。各問題に正解と解説を入れてください。選択肢をクリックすると正誤がわかり、最後に合計点が表示される仕様にしてください。」
 |
しばらくするとClaudeの画面右側にプレビューが表示されます。実際にクリックして動作を確認できます。
プレビューのイメージ：
 |
Lv.2 その場でプレビューして確認する
プレビュー画面で実際に全問クリックしてみてください。
 |
確認するポイント：
選択肢をクリックすると正誤が表示されるか
解説の内容が正確か
最後に合計点が表示されるか
問題文・選択肢に誤字がないか
気になる点があればそのままClaudeに追加指示します：
「問題3の解説をもう少し詳しくしてください」
「正解の選択肢をランダムな順番にしてください」
Claudeがその場で修正して、プレビューが更新されます。
 |
【ヒント】問題の内容が施設の実態と合っているかどうかの確認は、介護の専門家であるあなたにしかできません。Claudeが作った問題は必ずご自身で確認してください。
Lv.3 テーマ・問題数・デザインをカスタマイズする
テーマを変える：
「テーマを『褥瘡予防の基本』に変えて、同じ形式で作り直してください。」
問題数を増やす：
「問題を10問に増やしてください。」
施設名を入れる：
「タイトルに『〇〇施設 感染症対策研修クイズ』と表示してください。」
スマホ対応にする：
「スマホでも見やすいようにデザインを調整してください。文字を大きく、ボタンを押しやすくしてください。」
デザインを変える：
「背景を白ベースのシンプルなデザインにしてください」 「施設のイメージカラーに合わせてボタンを緑にしてください」
追加指示のたびにプレビューが更新されるので、仕上がりをその場で確認しながら調整できます。
Lv.4 HTMLファイルをダウンロードして施設で使う
クイズが完成したら、HTMLファイルとしてダウンロードします。
プレビュー画面の右上にあるダウンロードボタン（↓のアイコン）をクリックすると、HTMLファイルがPCに保存されます。
施設スタッフへの配り方：
方法①：共有フォルダに置く 施設内のネットワーク共有フォルダにHTMLファイルを置いて、スタッフが各自のPCで開く。ダブルクリックするだけでブラウザで動きます。
方法②：USBで配布する HTMLファイルはサイズが小さいのでUSBメモリで配布できます。インターネット接続不要でオフラインでも動きます。
方法③：メール添付で送る メールに添付して送ることもできます。受け取った側はファイルを開くだけです。
【注意】Google DriveにアップロードしたHTMLファイルをドライブ上で直接開こうとしても、正しく動作しません。「ダウンロードしてからブラウザで開く」よう案内してください。
まとめ
Claudeに指示するだけで、ブラウザで動く研修クイズがその場で完成する
プレビューでその場で確認しながら追加指示で調整できる
テーマ・問題数・デザインは自由にカスタマイズできる
完成したHTMLファイルをダウンロードして共有フォルダ・USB・メールで配布できる
一度作ったクイズは何度でも繰り返し使えます。研修テーマが変わるたびにClaudeに新しいクイズを作ってもらいましょう。紙もアプリも不要で、すぐに使える研修ツールが手に入ります。
【きょうの20分】
claude.aiを開いて「介護職員向けの研修用クイズをHTMLで作ってください。テーマは感染症対策で4択問題を3問」と指示してみましょう。プレビューが表示されたら実際にクリックして動かしてみてください。
この連載のほかの記事は、こちらからまとめてご覧いただけます。