迷你世界
一座 3D 小島，是 Sui 作品集的入口：每間小屋都是一個獨立的作品，點進去就能玩。
迷你世界是一座 3D 互動小島，也是 Sui 3D 互動作品集合的入口。島上每一間小屋都是一個獨立的作品，點一下小屋，就能走進去玩。
先是有了羊貝貝的小屋，接著春男也開了一間塔羅小屋。小屋一多，就需要一個地方把它們放在一起，於是有了這座小島。訪客從上方俯瞰整座迷你世界：羊貝貝和藍貓 Haruo 會自己在島上散步、坐長椅發呆、去碼頭看海、照顧田裡的番茄，下雨時撐傘，下雪時圍上圍巾、戴起毛線帽。三隻小貓在路邊理毛打盹，海裡偶爾有鯨魚浮上來噴水。 島上的光線跟著訪客當地的時間變化，花跟著月份開，櫻花和楓葉跟著季節換顏色。看中哪一間小屋，點一下，鏡頭飛到門口、門打開、推進去，就進到那個作品裡；回來的時候，鏡頭再從那扇門退出來。 Sui 獨立完成整座島的地圖與世界觀設定、地形與植物、小屋外觀、居民行為系統、光線與天氣、2D 島嶼地圖和部署。開發過程使用 Claude Code 協作，Sui 負責定方向、定規格、審視覺。
專案目標
- 作品集入口：把散落在不同網址的作品收進同一座島，訪客「看到小屋 → 點進去」就能逛完全部作品。
- 可以一直長大：每間小屋是各自的 repo、各自部署；新增一間作品只要在名冊加一筆、蓋一個外觀，迷你世界本身不用大改。島上還留著兩塊空地。
- 活的世界：什麼都不做，島上也在過日子：居民走動、天色變化、季節輪替，讓人想多停一下。
島上有什麼
- 地形：高出海面的土塊小島，分成沙灘、主平地、高台、山頂四層，有石階、木坡和一座小池塘
- 設施：碼頭和小船、面海的長椅、山頂燈塔（晚上光束會轉）、廣場噴水池、路燈、田地（玉米、番茄、秋天的南瓜）和稻草人
- 植物：灌木、楓樹、櫻花、松樹、椰子樹、果樹（蘋果、橘子、桃子、檸檬依月份結果），13 種季節花
- 動物：三隻小貓（橘子、煤球、三花）、鯨魚、海龜、碼頭邊的小魚群、燈塔附近的海鷗
- 光線與天氣：清晨、午後、黃昏、夜晚；晴朗、下雨、下雪，預設跟著當地時間，右上角按鈕可以切換
- 2D 島嶼地圖：左下角（按 M 開關），即時顯示居民大頭照、小貓和鏡頭位置，點小屋圖示就飛過去
視覺風格
視覺方向是霧面玩具小島，和羊貝貝的小屋、春男的塔羅小屋同一套風格：所有模型都用程式建，材質統一是霧面絨毛玩具質感（MeshPhysicalMaterial＋sheen），植物用凹凸不平的團塊，不是圓球堆疊。小屋外觀在島上重新建，只保留屋頂、外牆、門窗；羊貝貝和春男的拱門照原專案重做，門邊放一塊小木牌當招牌。
技術重點
1. 一個高度函式決定整座島
地面、海底水深、角色腳底高度、植物和設施的擺放，全部讀同一個 heightAt()。沙灘、階地、池塘、坡道都寫在這個函式裡，所以不會有角色浮空或物件陷進地面的問題，改地形也只要改一處。
2. 自己寫的海水 shader
沒有用 three.js 內建的 Water，而是依水深從淺綠過渡到深藍，淺水帶透明感、海底有水光紋（caustics），加上水紋、天空反射、陽光閃點、岸邊白浪，下雨時還有雨圈。
3. 行為清單＋角色權重
居民的行為拆成兩份：behaviors.js 是 12 種行為（散步、發呆、回家、坐長椅、打瞌睡、沙灘、碼頭、照顧田、燈塔、逛廣場、串門子、找朋友聊天），每個角色在名冊裡各有平常、下雨、晚上三組權重。新增角色只要寫權重，新增行為只要在清單加一筆。
4. 積雪不另做模型
下雪時用 shader 判斷每個面朝不朝上，再慢慢混成白色。島上所有東西，包括之後新加的小屋和設施，都會自動積雪。「正在下雪」和「積雪厚度」分成兩個數值：雪花、圍巾、海鷗馬上反應，積雪則是慢慢積、慢慢融。
5. 從資料現畫的 2D 地圖
地圖不是一張畫好的圖，而是每次開頁從地形、小屋名冊、植物位置現畫，所以改地圖、加小屋、換季節時，地圖會自動跟著變。居民的大頭照也是開頁時用離屏 renderer 現拍的。
6. 小屋保持獨立
每間小屋是各自的專案（Vite 版本、LIFF、Firebase、PostHog 都不同），迷你世界只負責入口和轉場，不用 iframe 嵌入。進入時跳到小屋網址並記住是從哪間來的；回來時讀到這筆紀錄，鏡頭就從那扇門退出來。正式網址由主站的 Vercel rewrites 轉過來，和 /bestwishes、/haruo-tarot 同一套做法。
Tech Stack
建置後的 JS 約 223 KB gzip（three.js 約 161 KB，迷你世界本身約 62 KB）。
1. 前端（核心）
2. 渲染設定
3. 工具與部署
接下來
目前是 MVP 階段，訪客用上帝視角逛島。Beta 版之後預計加入角色創建系統：訪客可以捏一個自己的虛擬角色，用鍵盤（手機用手指）在島上走來走去；島上的居民仍然由 AI 控制。
你可能也會喜歡
Want to work with Sui?
