HRuiCcc/RuiC-card-skill

解決的問題

它自動化面向 Web 的 3D 全息「交易卡」的創建過程。使用者無需手動設計資產和編寫著色器，只需透過單個文字提示或參考圖像，即可生成包含深度、全息閃光效果和 3D 檢視器的完整互動式卡片。

運作原理

該專案作為一個「Codex Skill」流水線運行，透過以下步驟將提示轉換為成品：

1. 分層生成：在共享座標系上建立四個不同的圖像層（主體、背景、線稿和文字）。
2. 3D 場景構建：使用 Blender 的便攜版將這些圖層排列在 3D 空間中，創建物理深度感（視差），使主體向前突出，背景向後延伸。
3. 材質應用：應用對觀察者視角做出反應的全息著色器（雷射彩虹、金箔、銀箔或珍珠光澤）。
4. Web 組裝：將 Three.js 檢視器打包成單檔案 HTML 頁面，允許使用者在瀏覽器中旋轉、翻轉卡片並調整其深度和光澤。
5. 交付：系統輸出即時 Web 連結、可編輯的 .blend 檔案、透明 PNG 圖層和設定 JSON。

適用人群

• 創意人士和遊戲開發者：用於快速原型化角色卡片或獨立遊戲資產。
• 寵物主人：用於將寵物照片變成「傳奇」全息卡片。
• 行銷人員：用於創建互動式數位收藏品或產品發布時的促銷「彩蛋」。
• 3D 愛好者：用於在 Blender 中實驗全息材質和視差效果。

亮點

• 一句話生成：從提示到互動式網頁的全自動化。
• 真實 3D 視差：使用深度分離的圖層而非平面圖像來創建逼真的 3D 效果。
• 基於視角的閃光：全息效果根據觀看角度變化，而不仅仅是定時循環。
• 零安裝 Blender：自動下載並驗證便攜版 Blender，以避免污染系統環境。
• 單檔案 Web 檢視器：將 Three.js 和資產打包到一個檔案中，以繞過廣告攔截器並確保相容性。
• 自動化驗證：包含無頭瀏覽器腳本以驗證互動（翻轉、滑動、縮放）並比較實際幀。