畫面
WASD／方向鍵移動 Space 跳躍
按住 Shift 快跑 拖曳畫面轉視角
左半螢幕虛擬搖桿移動 右半螢幕拖曳轉視角
右下角 ↑ 跳躍 搖桿推到底即快跑
沿著街道撿滿 6 顆水晶。水晶有垂直光柱，遠處也看得到。
一棟樓數十個 mesh，先按材質合併成少量 geometry，再用 InstancedMesh 一次畫完 26 棟， 手機也能順跑。
模型原始座標是「根空間絕對座標」，repivot() 把子物件搬到肩／髖樞軸，
才能用 rotation.x 擺動走路。
右向量由 F × U 推導：(-cos y, 0, sin y)。
寫成 (cos y, -sin y) 會讓 A/D 左右顛倒。
不是只調速度：FOV 52→59、鏡頭拉遠、身體前傾 0.16 rad、步頻擺幅加大、 外加邊緣視野收束。
0.15 秒指令緩衝、起跳預壓、空中姿態混合、落地壓縮與煙塵環； 空中操控降到 45%。
three.js 與兩份模型原始碼全部內嵌，交付檔零外部 src／href，
離線也能開。
遊戲成品是產物，真正的架構在 src/。建置腳本會把模板與兩份模型原始碼
組裝成單一 HTML，可逐位元組複現倉庫中的 game/街區漫遊.html。
python src/build_game.py
# built: 667551 bytes -> game/街區漫遊.html| 檔案 | 說明 |
|---|---|
src/game_tpl.html | 遊戲模板：世界搭建、輸入、移動、碰撞、相機、HUD |
src/char_code.js | 主角模型建構（頭／髮／軀幹／四肢，全部程式化建模） |
src/bld_code.js | 大樓模型建構（立面、窗帶、雨遮格柵、植栽） |
src/build_game.py | 建置腳本：剝殼 → 切場景 → 注入模板 |
tools/check_*.py | 無頭瀏覽器自動驗證（移動、跳躍、快跑、碰撞、版面） |
tools/shot_*.py | 無頭截圖 |
tools/serve_mobile.py | 區網伺服器，讓手機連進來實機測試 |
refs/ | 設計參考圖 |
角色與大樓都不是手工拉的，也不是載入現成模型檔 —— 它們都是以開源專案 img2threejs 建成的程式碼。
「參考圖 → 程序化 Three.js 模型」的建構管線。先分析參考圖、寫出 sculpt spec，
再一階一階產出可執行的建模程式碼，並用截圖與參考圖反覆比對修正。
github.com/img2threejs/img2threejs
模型程式碼大部分由此生成 —— 包含角色與大樓的幾何結構、材質參數與配色， 以及為對齊參考圖所做的逐輪修正。
整體專案在此製作：參考圖分析、模型建構與校對、遊戲邏輯開發、 無頭瀏覽器自動驗證與截圖比對、發布。
另外使用 three.js r149（MIT）作為渲染引擎。