学習アプリの式を、答えが出る順から自分が考える順へ並べ直した

開発misc-dev

学習アプリの式を、自分が考える順へ並べ直した

写真の教材を読み取ってもらい、その内容を操作できるHTMLアプリにしてもらった。 条件を動かすと答えが変わり、計算過程も表示される。 ところが画面を読み始めると、式の中に出てくる数字が何を指すのか、まだ追い切れなかった。

計算へ進む前の説明

最初に頼んだのは、物質名を省略しないことだった。 写真では日本語で書かれていた名前が化学式に置き換わると、問題文と画面を照らし合わせるたびに読み替える必要がある。 元の順番を保ち、名称も省かないようCodexに直してもらった。

次に、問題文そのものの解説を増やした。 求めるもの、与えられた数字、その数字を読み違えやすい箇所を確認してから計算へ進む構成にした。 式を見せるだけでは、そこへ数字を入れる理由が分からない。

同じ試料を冷やすという前提

溶液の問題では、与えられた質量が水だけなのか、溶液全体なのかを質問した。 そこで比率を四角い箱で説明してもらい、さらに温度ごとの条件を表へ並べてもらった。

表に置く項目が増えると、別の引っかかりが出てきた。 基準として比べる溶液と、実際に冷やす試料が、同じ種類の数字に見えてしまう。 同じ試料を冷やすなら水の量は引き継ぐ、という関係を画面で追いたかった。

Codexには、温度の違いと基準量からの換算を分けて並べてもらった。 ただ、二つの温度を横に置くだけでは、自分の考え方にまだ合わなかった。

手書きの下書きで伝えた配置

答えの下に、計算式が小さく表示されていた。 見たかったのは、むしろその式だった。

自分の下書きを写真で渡し、それに沿って表を作り直してもらった。 水と溶けている物質の列を固定し、基準、比率による換算、冷却後の状態、最後の差という順に上からたどる。 答えより計算式を大きく置き、条件を動かしたときは式の数字も連動させた。

同じ計算でも、読める順番が違う

さらに、掛け算と割り算の表示順を変えてもらった。 自分の発想は、全体に占める割合を先に出し、その割合を取り出した量へ掛けるというものだった。

画面の式も「割合を求める括弧」が先に来る形へそろえた。 計算結果が同じでも、式を目で追う順番は変わる。 何を割合の分母にするのかも、その場で確かめた。

冷却後の説明には、その温度での基準値を置く表も追加してもらった。 換算後の数字だけを見せるのでなく、元になった条件から追えるようにした。

用語の前提へ戻る

別の設問では、質量モル濃度と沸点上昇の説明を足してもらった。 その後も、なぜ質量を物質量へ直すのか、分子量と粒子数はどう関係するのかを質問した。

前提解説をアプリへ追加してもらった記録と、会話で説明を受けた記録は分けておく。 最後の質問への回答まで、すべてアプリに組み込まれたとは確認できない。

当日の完了報告では、最初のアプリについて計算結果との一致、画面切り替え、解答判定、スマートフォン表示を確認したとされている。 その後の表の変更にも更新報告はあるが、自分が全設問を理解し終えたという記録はない。 この日に進んだのは、分からない箇所を質問しながら、問題文と式をたどれる画面へ直すところまでだった。

別の会話では、問題文の条件を表にした

同じ晩のClaude Codeの履歴には、問題文そのものが分かりづらいと伝えた会話が残っていた。 設問ごとに縦軸と横軸を決め、与えられた量から求める量へ進む図を作るよう頼んだ。 六問を扱う別の解説HTMLを作成し、Chromeで開いたという報告を受けている。

こちらは問題文の条件を読み解くページであり、ここまで記したCodexによるアプリの調整とは分けて扱う。 一つの成果物を二度作ったと数えるのではなく、式の見せ方と、問題文の読み解きという二つの依頼があった。

関連記事


記録について:Mac側のCodexとClaude Codeのセッション履歴をもとに8月31日に再構成。本文のアプリ調整はCodex、末尾の条件整理ページはClaude Codeの履歴による。教材の本文や固有の数値は転載していない。

#学習アプリ #図解 #HTML #日記