鐵人檔案
近年來 HD-2D 風格在遊戲界大放異彩，本系列將帶領讀者使用前端技術挑戰這項視覺饗宴！我們將以 Three.js 為核心，從零建構一個充滿復古魅力的像素地下城。內容涵蓋 3D 場景建置、2D 像素角色在 3D 空間的渲染技巧（Billboard），並深入探討 WebGL 底層概念，實作出關鍵的「即時光影系統」，為平面的像素賦予立體的生命力。無論你是對 3D 網頁開發好奇，還是想嘗試瀏覽器遊戲開發，都能跟著這 30 天的實戰，打造出專屬的 HD-2D 網頁互動體驗
在 Day 10 中，我們成功封裝了強制鎖定最近鄰取樣的 loadPixelTexture，徹底解決了像素貼圖模糊的問題，並且透過 BoxGeometry 的六...
在 Day 11 中，我們成功建立了「1x1 模組化立體堆疊」系統，並透過動態材質判定，讓每一塊城牆磚石在堆疊時都能維持 1:1 的完美像素長寬比。然而，在昨天...
在經歷了 Day 11 的 1x1 模組化堆疊與 Day 12 的廢墟建築演算法後，我們已經在 3D 空間中搭建起一座座具有高低漸變、轉角延伸與碎石散落的古堡殘...
在 Day 13 中，我們成功鋪設了深藍紫色的冷調環境底光，並透過高解析度的 PCF 軟陰影映射，讓斜射的月光在廢墟中拉出修長的陰影，奠定了地窖深邃神祕的氛圍。...
延續昨天的預告，我們的 HD-2D 地宮在靜態的場景建構與光影表現上已經變成了一個像樣的遊戲畫面。然而，所有的 3D 物件、光影與迷霧，最終都必須透過「攝影機」...
在 Day 15 中，我們完成了古堡地宮的場景建設、動態壁燈光影以及 2.5D 相機鎖定迴圈。然而，這座精緻的世界目前還缺乏一位探索者。 在 HD-2D 的設計...
在 Day 16 實裝主角與鍵盤移動後，在瀏覽器實機測試時暴露出四個嚴重的視覺與手感缺陷: 角色向左走永遠倒退滑步：按下 A 鍵向左走時，精靈依然面朝右側，即...
