分子のあいだ
デザイン概要
Between Molecules では、高校生が水、アンモニア、メタンを組み立てて空間構造を観察します。原子が結合へ吸着すると平面配置が立体へ飛び出し、分子式、形、結合角が表示されます。球棒モデルと空間充填モデルを回転・切り替えられ、3分子の孤立電子対ドメインを2 / 1 / 0で比較できます。
検証記録
確認済み第3回レビューでサンプリングした連続フレームでは、最後の原子が結合した後に水がV字形へ曲がり、メタンが平面の十字から広がり、遷移中に最終的な結合角を早く表示しないことを確認しました。水、アンモニア、メタンの孤立電子対ドメインは2 / 1 / 0です。
検証の範囲そのラウンドではブラウザーを起動せず、正確な3Dパラメーターも監査していません。共通の照明、空間充填モデルの接触部分の陰影、卓上の影は、依然として素材上の制約として記録されています。
プロンプト
高校の化学を学ぶ学生向けの分子構築アプリ(横置きタブレット、1366×1024)。中国語のインターフェースとし、元素トレイから作業台へ原子をドラッグすると、結合が自動的に所定の位置へ吸着する。分子は実際の空間構造を形成して回転でき、ボールアンドスティックモデルと空間充填モデル、分子式、名前、結合角を表示する。
中核は、最後の原子が結合したときに、分子全体が平面的な配置から実際の三次元構造へ飛び出すように変わること。水は104.5°に曲がり、メタンは正四面体へ広がる。教科書のイラストではなく、three.js で魅力的な素材と照明を使ってレンダリングする。説明文を最小限にし、操作で原理を伝える。
空の作業台に構築課題がある状態、結合の吸着フィードバックを伴う構築中、完成した分子を回転している状態の3状態をデザインする。1366×1024、DPR=2で撮影し、画像名は `shots/app.png`、`app-2.png` などとする。`screens.html` は不要。
中国語の元のプロンプトを見る
一个给高中生学化学的分子搭建 App(平板横屏 1366×1024),界面用中文:从元素栏把原子拖上工作台,化学键自动吸附;分子按真实的空间构型成形,可以转动查看,切换球棍模型和比例模型,旁边是分子式、名称和键角。
最后一个原子接上时,整个分子从平面一下弹成真实的立体形状(水分子弯成 104.5°,甲烷撑成正四面体),这是这件作品的核心。用 three.js 渲染,材质和光照要好看,不要做成教科书插图。少放说明文字,让操作本身把道理讲清楚。
设计三个状态:一道搭建任务和空工作台、正在搭建(键吸附时的反馈)、分子成形后转动查看。截图按 1366×1024、DPR=2,命名 `shots/app.png`、`app-2.png` 这样排下去,不需要 `screens.html`。
ライブデモを開く