生成 AI で理科・数学のシミュレーションを作り、URL で生徒に配る

円錐の体積が 1/3 になる理由を、黒板の図だけで伝えるのは難しいものです。直角三角形を回すところを、生徒が自分の手で動かせたら、と思います。ChatGPT や Claude に頼むと、それらしいものはすぐにできます。困るのはそのあとで、作ったものを 30 人の生徒のタブレットで開いてもらう方法です。

このページは、PhET を使えば済む場面と、AI に頼むときの頼み方、実際にどのライブラリが動いたか、配る前に確かめること、生徒に URL で配る手順を説明します。PhET のページは 2026 年 10 月 17 日に読んで確かめました。

PhET にあるなら、PhET を使う

コロラド大学の PhET は、理科と数学のシミュレーションを無料で公開しています。シミュレーションは HTML5 で書かれていて、ブラウザで動きます。ライセンスのページ によると、学校の先生や生徒は、授業や宿題など営利目的でない使い方なら無料で使えます。トップページ には、173 のシミュレーションと、132 の言語への翻訳があると書かれています。

AI で作る意味があるのは、このあとの 3 つのようなときです。

• PhET に、その題材がない。 回転体や軌跡のように、数学の単元に合うものが見つかりません。
• 教科書や問題の数値で動かしたい。 プリントの問題と同じ角度、同じ質量で見せたいときです。
• 見せたいことを 1 つに絞りたい。 授業の流れに合わせて、ボタンやスライダーを最小限に抑えたい場面です。

AI への頼み方

ChatGPT、Claude、Gemini のどれでも、次の文をそのまま貼り付けて、1 行目の題材だけを書き換えてください。

授業で使う理科のシミュレーションを作ってください。題材: 斜面を下る台車（斜面の角度を変えると、斜面に沿った加速度が変わる）
条件:
- 1 つの HTML ファイルにまとめる。CSS と JavaScript もすべて中に入れる
- canvas に描く。ライブラリ（p5.js、Matter.js、three.js など）を使うときは、cdnjs か jsDelivr から https で読み込む
- 値を変えるスライダーと、「スタート」「リセット」のボタンをつける
- 画面に公式と、いまの値を単位つきで出す。重力加速度は 9.8 m/s²
- 動きは、フレームごとに決まった量ではなく、前のフレームからの経過時間で進める
- スマホの画面に収まり、指でも操作できるようにする
- ほかのサイトからデータを読み込まない。eval や new Function は使わない

1 行目は、たとえば次の 3 つのように書き換えます。

• 波: 「題材: 2 つの波の重ね合わせ（振幅と波長をスライダーで変えると、合成波が変わる）」
• 回転体: 「題材: 直角三角形を軸のまわりに回してできる円錐（回す角度と底辺の長さを変えると、体積が出る）」
• 軌跡: 「題材: 円周上を動く点 P と定点 A を結ぶ線分の中点 M の軌跡（A の位置を変えられる）」

頼む文の「経過時間」の行は、省かないでください。フレームごとに決まった量だけ動かすと、動く速さが画面の描き替えの回数で変わります。1 秒に 120 回描き替える iPad では、60 回の Chromebook の 2 倍の速さで台車が下り、同じ角度なのに生徒によって見え方が違ってしまいます。

Convika には、スライダーで条件を変えて動きを確かめるページを AI がつくる「理科・数学シミュレーション」のテンプレートもあり、ほかのテンプレートとあわせて AI でクイズ・ゲーム・診断のページをつくるで紹介しています。

実際に動いたもの（2026 年 10 月 17 日の試験）

上の頼み方で 4 つの題材を作り、手元のサーバーから、Convika で公開したページと同じセキュリティの設定で配信して、3 つのブラウザで開きました。試験のファイルは、どれも Claude がこの頼み方から書いたものです。ChatGPT と Gemini では作っていません。公開はしていないため、Free プランの帯やクッキーの案内、訪問数の計測は入っていない状態で試しました。

ブラウザは Chromium（パソコンの画面と、Pixel 7 のスマホの画面）と、Safari と同じ WebKit（iPad の画面）です。アニメーションが動くことと、スライダーを動かすと画面の数値が変わることを確かめました。結果は下の表のとおりです。

• 動かないもの: ほかのサイトへの通信（fetch）と、eval、new Function。Convika で公開したページは、自分のアドレスにしか通信できず、文字列から組み立てたコードも動きません。天気や地震のデータをその場で読み込むシミュレーションは作れません。
• 残るもの: ブラウザに保存した値（localStorage）。その端末の中でだけ、前回の設定を残せます。
• 3D は WebGL を使う: 試験に使ったパソコンの Chromium は画面描画の部品を持たない設定で、three.js の回転体は、ソフトウェアで描く設定にするまで何も映りませんでした。古い端末で 3D のシミュレーションが真っ白になるときは、同じ題材を p5.js か canvas の 2D で頼み直します。
• 試していないもの: 公開したページ、実際の Chromebook と iPad、学校のフィルター。

配る前に確かめること

AI は動くコードを書きますが、物理や数学として正しいとは限りません。生徒に見せる前に、このあとの 4 つを確かめます。

• 画面の公式と数値を、自分で 1 つ計算する。 斜面の台車なら、角度 30° で斜面に沿った加速度は a = g sin θ = 9.8 × 0.5 = 4.9 m/s²。画面の値と合っているかを見ます。
• スライダーを両端まで動かす。 角度 0°、長さ 0 のような端の値で、止まったり逆に動いたりすることがあります。
• 単位と向きを見る。 すべての数値に単位があるか、上向きと下向きのどちらを正にしているかがそろっているかを確かめます。
• スマホでも触ってみる。 マウスで動かせたスライダーが、指では細すぎて動かせないことがあります。

おかしいところは、「30° のとき 9.8 と出るが、4.9 のはず」のように、見えたことと正しい値をそのまま AI に伝えて、ファイル全体を出し直してもらいます。

シミュレーションを URL にする 4 つの手順

1. HTML をボックスに入れて、見た目を確かめる

ページ冒頭のボックス に .html のファイルをドロップするか、「コードから」に切り替えてコードを貼り付け、「プレビューのリンクをつくる」を押します。

受け付けるのは、.html か .htm のファイル 1 つ（2 MB まで）か、そのコードで、アカウントはいりません。

「プレビューができました」と出たら、見た目だけを確かめます。このプレビューではスクリプトが止まっているので、シミュレーションは動きません。リンクも 3 分間 で切れるので、生徒には配りません。

2. ページを受け取って、動かしてみる

「このページを受け取る（無料・カード不要）」を押して登録すると、ページがそのままアカウントに入り、スクリプトも動くようになります。

管理画面で「プレビューを開く」を押し、スライダーを全部動かして確かめます。

3. 公開する

管理画面で「公開する」を押すと、確認の画面で無料の「一般公開」を選べば、URL を受け取った生徒はパスワードやアカウントなしで開けます。一般公開のページは Google などの検索結果や Convika のギャラリーに出ることがあるので、出したくないときは「限定公開」を選びます（Pro・1年パス）。クラスの外に見せたくないときは「パスワードを知っている人だけ」も選べます（違いはHTML のページを限定公開するにあります）。公開すると yourpage.convika.page のようなアドレスになります。

Free プランはカード登録なしで使え、1 ページを公開できます。Free では、公開したページの下端に小さく Convika の帯が入ります（Pro で消せます）。

4. URL か QR コードで配る

サイトの画面の「公開URL」の横にある「コピー」で URL をコピーします。

教室で配るなら、「QR コードを表示する」を押してスクリーンに映すか、「PNG 画像を保存する」でスライドやプリントに貼ります。生徒は、タブレットのカメラで読み取るだけで開けます。

生徒に届ける

• Classroom に貼る: ガイド Google Classroom で HTML の教材やゲームを配る方法 の手順で、資料か課題にリンクとして投稿します。
• ロイロノートで送る: ガイド ロイロノートで URL を送る方法 のとおり、URL を Webカードにします。
• QR コードで配る: 読み取り方まで含めて、ガイド HTML ファイルを QR コードにする方法 にまとめてあります。
• 授業の前に、生徒の端末で 1 回開く。 学校の Web フィルターが、知らないサイトを止めることがあります。開けなければ、フィルターの担当者にアドレスを許可してもらいます。
• 生徒の名前や成績は、ページに書かない。 公開した URL は、知っている人ならだれでも開けます。クラスの生徒だけに開かせたいときは、公開するときに「パスワードを知っている人だけ」を選びます。パスワードは Pro（月額 ¥1,800）の機能です。

シミュレーションは、生徒が自分で確かめるためのもの。生徒ごとの答えや点数は集まらないので、記録するときは Google フォームのテストを横に置きます。

直すときも、URL と QR コードはそのまま

授業中に単位の誤りが見つかったら、AI で直したファイルを、サイトの画面の「新しいバージョンのアップロード」に入れて、「新しいバージョンとしてアップロードする」を押します。アップロードに AI クレジットは使いません。「プレビュー v2 ができました」と出たら「プレビューを開く」で確かめ、「同じリンクで v2 を公開する」を押します。配った URL も、印刷した QR コードも、直したページを開きます。管理画面の「HTMLファイルをアップロードする」から入れ直すと、別の URL の新しいページになるので、直すときは使いません。

同じ学年のほかの先生にも使ってもらうなら、サイトの画面の「サイト設定」にある「ページのコピー」で、「このページのコピーを許可する」にチェックを入れます。コピーは、許可するまでオフです。許可すると、公開したページの下に一文が出て、開いた先生が無料で自分用のコピーをつくり、数値や問題を書き換えられます。

よくある質問

AI で物理のシミュレーションは作れますか？

作れます。ChatGPT、Claude、Gemini に「スライダーで値を変えられる、1 つの HTML ファイルのシミュレーション」と頼み、画面に公式と数値を出すように指定してください。配る前に、数値を 1 つ自分で計算して確かめます。生徒には、公開した URL を配ります。

PhET との違いは何ですか？

PhET にない題材や、教科書の数値に合わせたいときに AI で作ります。PhET は大学の研究にもとづく無料のシミュレーションで、ブラウザで動き、授業で自由に使えます。PhET にある題材なら PhET が確かです。

生徒はアカウントなしで使えますか？

使えます。公開したページはふつうの Web ページなので、生徒は URL を開くか QR コードを読み取るだけで、Chromebook や iPad、スマホのブラウザで動かせます。公開する先生は、Convika の無料アカウントを作ります（13 歳以上。18 歳未満の人は保護者の同意が必要）。

Chromebook や iPad で動きますか？

2026 年 10 月 17 日の試験では、p5.js、Matter.js、three.js を使ったシミュレーションと canvas だけのものが、Chrome と同じ Chromium と、Safari と同じ WebKit で動きました。実際の端末と学校のフィルターは試していないので、授業の前に生徒の端末で 1 回開いてください。

数学の回転体や軌跡も作れますか？

作れます。試験では、直角三角形を回してできる円錐（three.js）と、円周上の点と定点を結ぶ線分の中点の軌跡（p5.js）が動きました。回転体は 3D なので、古い端末で映らないときは、2D の断面図で頼み直してください。