這篇整理 2025 年 6 月用 Claude 做的一組校園意外模擬。起點是兩張照片：Claude 依照片用 Three.js 寫出可以在瀏覽器裡操作的 3D 場景，先是水景廣場，再是校園。校園裡有路人走動，按下按鈕就會上演樓梯跌落、腳踏車衝撞、高處墜物等意外。對話中一共產生 36 個版本，其中兩個公開在網路上。下面先介紹這兩個版本，再整理對話經過、把兩個版本實際執行一遍的結果，以及從中歸納的提示方法。
- 兩個版本。兩版共用同一個校園場景與三個情境（樓梯跌落、腳踏車、墜落物）。A 版另有一列像骨牌一樣倒下的護欄，B 版另有 8 人圍圈跳舞、氣球破掉後人群受驚的快閃情境。
- 製作過程。對話共 13 則訊息，集中在 2025 年 6 月 22 日到 25 日，10 月 13 日再補一則。多數訊息只有一句話、只改一件事。
- 腳踏車與墜落物從來不會撞到人。兩版的腳踏車都從行人身旁 4.16 單位處經過，墜落物落在行人 3.0 單位外，而程式判定撞到的距離只有 2.0 和 1.5。
- 快閃情境很少失控。B 版跑 500 次，15 顆氣球每次都會破，但有 223 次沒有路人受驚，486 次沒有人跌倒，其餘 14 次也都只有兩人相撞。
- 描述和程式有落差。Claude 的回覆常寫 realistic physics、chain reaction，實際上樓梯跌落和護欄連鎖都是照固定公式播放的動畫。用「check::」要求確認之後，Claude 調大了參數，但沒有實際驗證效果。
兩個版本 · 製作過程 · 實際執行 · 其他觀察 · 提示方法 · 模擬預防措施 · 限制 · 連結
2026 年 11 月 3 日更新：重新整理架構，並把兩個版本實際執行一遍。2025 年 6 月 25 日的原始版本保留在另一個網址。
1. 兩個公開版本
兩個版本的標題都是 Modern Campus Accident Simulation，各是一個 HTML 檔，用 Three.js r128 繪圖。場景相同：三棟灰色建築、三座加了金色邊條的樓梯、15 個隨機走動的路人。人物身高約 3.5 個場景單位，本文的距離都用這個單位。
| A 版：骨牌效應護欄倒成一片 | B 版：快閃群眾失控 | |
|---|---|---|
| 共同情境 | Stair Fall Accident：一名路人從主樓梯上段翻滾而下。Bike Collision：腳踏車衝向一名行人。Falling Object：一塊建材從 35 單位高處落下。 | 同左 |
| 第四個情境 | Domino Chain Reaction：12 片橘色護欄排成一列，第一片倒下後依序帶倒下一片，最後一片打到站在列尾的人。 | 🎭 Flash Mob Gone Wrong：8 名路人圍成一圈跳舞，2 秒後放出 15 顆氣球；氣球破掉時，附近的路人受驚奔逃、互相碰撞。 |
| 操作 | 滾輪縮放，WASD 移動鏡頭焦點，Q/E 調整高度；Reset Scene 讓路人回到隨機位置。 | 同左。畫面上的說明寫著 Mouse: Orbit camera，但程式裡沒有滑鼠旋轉的功能。 |
| 和對話的關係 | 骨牌情境不在分享的對話裡。 | 含第 12 則訊息（check::）之後的參數，還沒有第 13 則加入的方向鍵。 |
2. 製作過程
分享的對話從 2025 年 6 月 22 日開始。前兩則訊息做的是第一張照片裡的水景廣場（Urban Water Feature Accident Simulation，7 個版本）；第三則訊息起改用第二張照片的校園（Modern Campus Accident Simulation，29 個版本）。兩張照片在分享頁中是隱藏的。
| # | 日期 | 訊息（原文） | 版本 | 結果 |
|---|---|---|---|---|
| 1 | 6/22 | Animate an accident under the conditions of the picture in three.js（附照片） | 水景 v1 | 滑倒落水、球擊落水兩個情境 |
| 2 | 6/23 | Third person perspective | 水景 v2–v7 | 鏡頭改成繞著事故轉的第三人稱視角 |
| 3 | 6/23 | Analyze it in the same style（附第二張照片） | 校園 v1 | 多層建築與樓梯；樓梯跌落、腳踏車、墜落物三個情境 |
| 4 | 6/23 | Make stair easy to see | v2–v6 | 台階改淺灰，加金色邊條與踢面，扶手加粗，主樓梯增為 15 階 |
| 5 | 6/23 | Npc walks narurally | v7–v10 | 路人擺手走路、隨機停步轉向，增為 15 人 |
| 6 | 6/25 | add this scenario: 🎭 Flash Mob Gone Wrong（附 5 點規格） | v11–v17 | 回覆中途停下 |
| 7 | 6/25 | Continue | v18–v19 | 快閃情境完成 |
| 8 | 6/25 | fix ::（貼上墜落物與氣球那段程式） | v20 | 整理該段程式 |
| 9 | 6/25 | but no working | v21–v22 | Claude 判斷 createBalloon 在定義前就被呼叫，調整順序 |
| 10 | 6/25 | still not | v23 | 整份重寫，回覆中途停下 |
| 11 | 6/25 | Continue | v24 | 重寫完成 |
| 12 | 6/25 | check:: Balloons pop randomly, scaring nearby people（另列兩點） | v25–v26 | 驚嚇半徑 5→8、碰撞機率 1%→5%、碰撞距離 1.5→2.0 |
| 13 | 10/13 | do not use mouse for change perspectives | v27–v29 | 取消滑鼠，改用左右方向鍵轉視角 |
第 6 與第 10 則的回覆都在中途停下，下一則的「Continue」把它補完。第 8 到 11 則是同一個問題的四次修正，最後以整份重寫收場。
3. 實際執行的結果
Claude 每一輪的回覆都附上功能清單，常見的字眼有 realistic physics、collision detection、chain reaction。為了確認這些描述，把兩個公開版本的原始碼存下來，在無頭 Chrome 裡逐格執行：程式一行不改，只把亂數換成固定的種子，並照程式本身的設定以每格 0.016 秒計時。表 3 是每個情境的結果，圖 2 是依程式座標畫的俯視圖。
| 情境 | 程式怎麼決定 | 執行結果 |
|---|---|---|
| 樓梯跌落 | 選中的人被放到主樓梯上段（z = 12、高 4.5），3 秒內照固定公式往前、往下移到 z = −27 的地面，同時翻兩圈。 | 這條路線比樓梯平緩：人物一路高出台階 0.6 到 1.4 單位，越往下越高；離開最低一階時仍離地 1.3，再往前 9 單位才落地，接著在平地滑行 7 單位。 |
| 腳踏車 | 車從 (−30, −10) 出發，以每秒 (12, 8) 前進 3 秒；與行人的距離小於 2.0 才算撞上。 | 最近距離 4.16（第 2.3 秒），撞擊的程式從未執行，行人一直站著。 |
| 墜落物 | 物體在 z = −15 處從 35 高直直落下，行人站在 z = −12；距離小於 1.5 才算擊中。 | 2.7 秒落地，最近距離 3.0，落在行人身旁。 |
| 骨牌護欄（A） | 前一片倒到 0.3 弧度（約 17°）就啟動下一片；最後一片倒到 1.2 弧度就判定擊中。 | 12 片在 0.9 秒內接連倒下，但每片會一直轉到 160° 左右（第一片 137°），整片沒入地面（圖 3）。1.3 秒判定擊中之後，那個人在原地翻滾到第 8 秒，位移不到 0.4。 |
| 快閃（B） | 氣球破掉時，8 單位內（含高度差）的旁觀者奔逃；兩名旁觀者相距不到 2.0 且其中一人在驚嚇中，每格有 5% 機率相撞，兩人身體傾斜 60° 以上。 | 見表 4。 |
| 結果 | 次數 |
|---|---|
| 15 顆氣球全部破掉 | 500 |
| 沒有旁觀者受驚 | 223 |
| 1 名旁觀者受驚 | 191 |
| 2 名旁觀者受驚 | 72 |
| 3 到 4 名旁觀者受驚 | 14 |
| 有人跌倒（每次都是一對人相撞） | 14 |
| 三人以上連環碰撞 | 0 |
原因在位置。15 人中有 8 人在跳舞，只剩 7 名旁觀者，一開始散在 80 × 60 的範圍裡；氣球在離圈心 4.0 到 7.8 處破掉，破掉時的高度從地面下 1.0 到地面上 7.4 不等（中位數 4.1）。氣球不是一路往上飄，而是像拋出去的球一樣升起再落下。驚嚇範圍又是 8 單位的立體距離，所以常常一個人也碰不到。真的相撞時，兩人的身體傾斜 60° 以上，卻多半繼續跑：追蹤 6 次相撞，有 5 次其中一人之後又跑了 10 單位以上。
4. 其他觀察
- 快閃舞圈在矮樓裡。舞圈中心 (10, 5)、半徑 4，整圈落在矮樓（x 5 到 55、z −5 到 25）的範圍內；窄樓梯除了第一階的前緣，也在樓裡。Three.js 預設只畫面朝外的牆面，所以鏡頭在樓內時看得到舞群，轉到樓外就只看到牆（圖 4）。
- 人和車會穿過建築與樓梯。場景沒有碰撞檢查。腳踏車情境裡被瞄準的行人站在主樓梯的範圍內，腳在地面、身體被台階截斷，從上方只看得到頭和肩膀；腳踏車也直接穿過樓梯。
- 情境之間會互相影響。A 版跑過骨牌情境之後，人物的速度沒有歸零，Reset Scene 也不會清掉；這時按 Falling Object，物體離人還有 2.95 單位，人卻倒地翻滾。
- 快閃情境要先重設才能重跑。B 版沒按 Reset Scene 就再按一次，氣球會維持破掉的狀態，不會再有人受驚。
- 速度跟著螢幕更新率走。程式每畫一格就前進 0.016 秒，所以在 120 Hz 的螢幕上，所有動作都比 60 Hz 的螢幕快一倍。
5. 提示方法
原文把這段對話的提示方法分成「溝通」「測試與驗證」「運作良好的部分」「有效策略」四組，內容有不少重疊。這裡合併成六點，每點附上對話裡的例子。
- 用照片交代場景。第 1 與第 3 則訊息都只有一句話加一張照片，建築、樓梯、水池怎麼擺都交給照片決定；in the same style 讓第二個場景沿用第一個場景的情境按鈕與第三人稱鏡頭。
- 從簡單開始，一次改一件事。先要一個意外，再依序要求 Third person perspective、Make stair easy to see、Npc walks narurally。一則訊息只改一件事，出了問題容易找到是哪一步。反例是一開始就要求「建立一個 Three.js 模擬，包含 15 個 NPC、增強樓梯、氣球物理……」。
- 複雜的新功能才寫規格。快閃情境牽涉舞蹈、氣球、驚嚇、碰撞與鏡頭，所以第 6 則訊息附了 5 點規格；簡單的修改一句話就夠。
- 回覆被截斷時說 Continue。第 6、第 10 則的回覆都在中途停下，一句 Continue 就接著完成。
- 壞掉時給確切的線索。fix :: 後面貼上出問題的程式段落，比 but no working、still not 更容易定位；瀏覽器主控台若有紅字錯誤訊息，整段貼上更好。這次修了兩輪仍不行，Claude 最後整份重寫（第 23、24 版）。
- 驗證要自己跑。第 12 則訊息用 check:: 要求確認三項效果，Claude 的回應是調大驚嚇半徑和碰撞機率，並說「The chaos is now much more visible」。實際跑 500 次，97% 沒有人跌倒（表 4），腳踏車和墜落物也從沒撞到人（表 3）。與其請 AI 檢查，不如請它把關鍵數字顯示出來，例如「在畫面上顯示腳踏車和行人的最近距離」或「連跑 20 次，統計跌倒人數」，再自己看結果。
6. 要模擬預防措施，意外得由場景造成
CL#4 的作業是「模擬一個意外事件，然後模擬一個預防措施」。這組程式裡的意外多半照劇本演出：樓梯跌落不看腳下的台階，護欄連鎖不看前後兩片有沒有碰到，撞擊只看兩點距離。照這種寫法，加扶手、拉開護欄間距、劃出自行車道都不會改變結果。要比較預防前後的差別，得先把觸發條件改成由場景決定，例如表 5。
| 情境 | 現在的寫法 | 改成由場景決定 | 可以比較的預防措施 |
|---|---|---|---|
| 樓梯跌落 | 按下就跌，沿固定路線滑下 | 依踩空的位置、離扶手的距離決定會不會跌、滾下幾階 | 扶手、止滑條、中間平台 |
| 骨牌護欄 | 前一片倒到 17° 就啟動下一片 | 前一片碰到下一片才倒。照現在的尺寸（高 2.5、間距 3），倒平了也碰不到，連鎖其實不會發生 | 間距大於高度、加重或固定底座 |
| 腳踏車 | 兩點距離小於 2.0 才算撞上 | 依車速、路徑和煞車距離計算 | 人車分道、減速設施 |
| 快閃人群 | 氣球 8 單位內的人逃跑，靠近時每格 5% 機率相撞 | 依人群密度與逃跑方向計算推擠 | 疏散動線、限制聚集人數 |
7. 限制
- 這是重演，不是預測。情境由提示指定，照片只決定場景的樣子；程式不會從照片推算哪裡危險、意外多常發生。
- 場景單位沒有定義。人物約 3.5 單位高，速度、高度、距離都不對應真實數值。
- 結果只代表這兩個版本。表 3、表 4 的數字來自 2026 年 11 月 3 日下載的兩個公開版本。分享頁中的最新版（第 29 版）沒有公開成獨立連結，這裡沒有測。
- 看不到原始照片。兩張照片在分享頁中被隱藏，無法對照場景是否符合照片。
8. 連結
- 對話分享：校園常見意外事件（13 則訊息、36 個版本）
- A 版：骨牌效應護欄倒成一片 upgrade
- B 版：快閃群眾失控 upgrade
- 同一單元：Unit 5: 環境安全檢測與評估視覺化、Hazard detection in Claude 3d model、Home Hazard chain identification and animation (危害鏈)、CL#4 環境安全檢測與評估視覺化
- 原始版本：意外事件預測與模擬（原始版本）
沒有留言:
張貼留言