コードが書けなくても理科アプリを改良!Codexで中和モデルにBTB溶液を追加してみた
中学3年生の理科で学習する「中和反応」。
酸性、アルカリ性、中性。
そして、水素イオンや水酸化物イオンの変化。
教科書や板書だけで説明しても、子どもたちにとっては少しイメージしにくい内容だと感じることがあります。
そこで今回は、中学3年生向けの理科アプリ「中和反応モデル」を作り、さらにChatGPTに搭載されたCodexを使って改良してみました。
動画はこちらです。
コードが書けない私でも、アプリを作ってみた
私はコードを自分で書けるわけではありません。
それでも、アンチグラビティーを使って、中学3年生向けの理科「中和反応モデル」を作ってみました。
このアプリでは、塩酸や水酸化ナトリウムを加えたときに、ナトリウムイオン、塩化物イオン、水素イオン、水酸化物イオンなどの数がどのように変化するのかを、画面上で確認できます。
最初の状態でも、中和反応のイメージをつかむ教材としては、十分授業で使えそうだと感じました。

もっと分かりやすくしたかったところ
ただ、実際に授業で使う場面を考えると、もう少し改善したいところが出てきました。

1つ目は、BTB溶液の色の変化です。

BTB溶液は、酸性なら黄色、中性なら緑色、アルカリ性なら青色に変化します。
この色の変化がアプリの中でも見えるようになれば、子どもたちは「今、酸性なのか」「中性に近づいているのか」「アルカリ性なのか」を、より直感的に理解しやすくなると思いました。
2つ目は、グラフの見やすさです。

イオンの数の変化は表示されていましたが、どのグラフがどのイオンを表しているのかが少し分かりにくいと感じました。
そこで今回は、アンチグラビティーで作ったアプリを、Codexで改善できるか試してみることにしました。
Codexに日本語でお願いしてみた
Codexの画面はChatGPTによく似ています。
そのため、初めて開いたときも、それほど難しそうには感じませんでした。
コードが書けない私でも、
「ここに日本語でお願いすればよさそうだ」
と思えて、安心して使い始めることができました。


実際には、次のような内容を入力しました。
「BTB溶液ボタンメニューを作って、そのボタンを押すと、酸性なら水溶液の色が黄色、中性なら緑色、アルカリ性なら青色にできますか?また、グラフの変化が分かりにくいので、変化を分かりやすいようにしてもらえませんか?」
すると、Codexが修正内容を考えてくれました。
自分でコードの意味をすべて理解できなくても、
「BTB溶液ボタンを追加する」
「酸性・中性・アルカリ性で色を変える」
「グラフを見やすくする」
というこちらの意図に合わせて、修正してくれていることが分かりました。
BTB溶液ボタンが追加された
修正後にHTMLファイルを開いて確認してみると、BTB溶液ボタンが追加されていました。
ボタンを押すと、水溶液の状態に応じて色が変化します。
酸性のときは黄色。
中性になると緑色。
アルカリ性になると青色。

色で状態を確認できるので、酸性・中性・アルカリ性という言葉だけではイメージしにくい子どもたちにも、分かりやすくなると感じました。
水酸化ナトリウムを加えると、水溶液がアルカリ性になったことが、色の変化からよく分かります。
グラフもさらに改善
グラフも見やすくなりました。
ただ、最初の修正では、どの線がどのイオンを表しているのかが、まだ少し分かりにくいと感じました。
そこで、もう一度Codexに日本語でお願いしました。
「グラフは見やすい高さになったのですが、どのイオンを表しているかよく分からないので、分かるようにしてもらえますか?」
すると、グラフの表示がさらに改善されました。
どのグラフがどのイオンの種類を表しているのかが、前より分かりやすくなりました。

授業で提示したときにも、
「この線は水素イオン」
「この線は水酸化物イオン」
というように、子どもたちと一緒に確認しやすくなりそうです。
水酸化バリウムと硫酸でも確認
水酸化バリウム水溶液に硫酸を加えた場合も確認してみました。
中和するときに、イオンの数がどのように変化するのかを、色の変化やグラフで見ることができます。
中和実験で起こっているイオンの変化を、画面上で確認できるのはとてもよいと思いました。

生成AIで、授業づくりの可能性が広がる
今回やってみて感じたのは、Codexを使えば、コードが書けなくても、今まで作ったアプリをより使いやすく改善できるということです。
「ここを直したい」
「このボタンを追加したい」
「授業で使いやすくしたい」
そんな思いを日本語で伝えるだけで、教材が少しずつ授業に合った形へ変わっていきます。
コードが書けないから無理だと思っていたことが、生成AIの力で実現できるようになってきました。
これは、授業づくりの可能性が大きく広がる変化だと感じます。
これからは、アプリを一から作るだけでなく、すでに作った教材を、授業に合わせて改善していくことも大切になっていきそうです。
おわりに
今回使った中和反応モデルのアプリは、動画の概要欄にリンクを載せています。
興味のある方は、ぜひ実際に試してみてください。
コードが書けなくても、
「こんな教材があったらいいな」
という思いを形にできる時代になってきました。
生成AIを上手に活用しながら、子どもたちにとって分かりやすい教材づくりに挑戦していきたいと思います。
