臨近聖誕節，大家都在思考如何讓今年更有儀式感：搞一棵聖誕樹，還是乾脆上一張濾鏡海報？但如果你想讓節日過得更「有科技味兒」，今年有個更酷的選擇——一棵能聽懂你手勢、會展示你的照片、還能隨你指揮聚散旋轉的「3D Christmas Tree」。
這個由 moleculemmeng020425 打造的項目，用 React 與 Three.js（R3F）構建出一棵由粒子、燈光和影像組成的立體聖誕樹；加上 AI 手勢識別，只需張開手，就能讓整棵樹炸裂成漫天粒子，握拳又能瞬間重組，左右揮手更能讓視角跟着你變化，交互感直接拉滿。
更有趣的是，你可以把自己的照片放進 photos 文件夾裏：top.jpg 會出現在樹頂，1.jpg、2.jpg …… 會形成樹身。如果想添加更多照片，改一下數量配置就行，一棵完全屬於你的「回憶聖誕樹」瞬間生成。
更驚喜的是，整套系統只用 CPU 就能跑。不需要高端顯卡、不需要複雜配置，讓數字藝術真正做到人人可玩、隨手可用。今年聖誕，不妨試試用科技點亮儀式感，讓「3D Christmas Tree」陪你一起過節。

教程鏈接： https://go.openbayes.com/eXi4m

使用雲平台: OpenBayes
http://openbayes.com/console/signup?r=sony_0m6v

首先點擊「公共教程」，找到「基於手勢識別的 3D 聖誕樹」，單擊打開。

頁面跳轉後，點擊右上角「克隆」，將該教程克隆至自己的容器中。

在當前頁面中看到的算力資源均可以在平台一鍵選擇使用。平台會默認選配好原教程所使用的算力資源、鏡像版本，不需要再進行手動選擇。點擊「繼續執行」，等待分配資源。

數據和代碼都已經同步完成了。容器狀態顯示為「運行中」後，點擊「API 地址」，即可進入模型界面。

使用步驟如下：

1.準備照片

找到項目目錄下的 /openbayes/home/christmas-tree/public/photos/ 文件夾。
頂端大圖/封面圖：命名為 top.jpg（將顯示在樹頂的立體五角星上）。
樹身照片：命名為 1.jpg，2.jpg，3.jpg ... 依次類推。
建議：使用正方形或 4:3 比例的圖片，文件大小不宜過大（建議單張 500kb 以內以保證流暢度）

2.替換照片

直接將你自己的照片複製到 /openbayes/home/christmas-tree/public/photos 文件夾中，覆蓋原有的圖片即可。請保持文件名格式不變（1.jpg，2.jpg 等）。

3.修改照片數量（增加或減少）

如果你放入了更多照片（例如從默認的 31 張增加到 100 張），需要打開文件：dependencies.sh，將看到：export VITE_TOTAL_PHOTOS=31，修改數字「31」為你的圖片數量，然後關閉容器再次啓動即可。

4.手勢控制説明

本項目內置了 AI 手勢識別系統，請站在攝像頭前進行操作（屏幕右下角有 DEBUG 按鈕可查看攝像頭畫面）：

• 🖐 張開手掌（Open Palm）Disperse（散開）聖誕樹炸裂成漫天飛舞的粒子和照片 。
• ✊ 握緊拳頭（Closed Fist）Assemble（聚合）所有元素瞬間聚合成一棵完美的聖誕樹 。
• 👋 手掌左右移動 旋轉視角 手向左移，樹向左轉；手向右移，樹向右轉 。

以下是效果展示：