# Hana 加入 3D - Spline blog (https://spline.design/zh-hant/blog/introducing-3d-shapes-hana) > 將 3D 與 2D 結合在一起 [部落格](https://spline.design/zh-hant/blog) 2025年12月10日 # Hana 加入 3D 將 3D 與 2D 結合在一起 [開啟 Hana](https://app.spline.design) 長久以來，大部分的設計「流程」都在 2D 畫布上進行。 2D 與 3D 之間由來已久的鴻溝，根源在於技術上的複雜度。2D 設計工具已發展到既即時又高品質（所見即所得），但 3D 需要多得多的運算能力，只有在較低品質下才能即時工作。 然而，科技（包括硬體和軟體）已大幅進步，我們的團隊在過去幾年也取得了重大進展，讓我們達成一個根本性的里程碑：在同一個畫布上即時結合 3D 與 2D。 移動滑鼠或觸碰即可互動（以 Hana 打造的體驗） ## 3D 與 2D 的匯流 我們相信，設計畫布應該善用所有可用的維度，而使用者（人類或 AI 代理）應該能決定什麼最適合手上的任務。 可惜的是，這在理論上可行，但在 3D 中實作任何東西都是技術上的惡夢，而結合這兩套系統更是難上加難。 目前大多數的設計工具，或傳統的設計工具，都建立在類似的做法上：你在預覽上工作，然後按下「渲染」或「交付」你的作品，再由其他人用不同的技術堆疊實作出真正的成品。 換句話說，幾乎所有現行的設計工具都不是即時的，因此 3D 通常得使用專門的工具，而其產出最終會被當作平面圖片或影片處理或嵌入；無法編輯，也沒有互動。這是個緩慢的流程，跟不上當今設計工作流程的標準。 要改變這一點，需要一種全新的做法。 以 Hana 打造的體驗 ## 即時是基礎 打造 Hana 時，我們讓它既是即時的，又能渲染你在 2D 中能渲染的\_任何東西\_。這表示 Hana 的渲染器能即時處理各種像素級精準的效果（例如陰影、模糊等）、向量形狀、布林運算等。 這也代表我們能運用 Hana 的效果管線，同樣即時渲染 3D 圖形。 本質上，Hana 能將 3D 和 2D 完全結合在一起。 用 Hana 將向量變成即時 3D ## 結合兩個世界的旅程 在 2D 畫布上加入 3D 看似簡單，但實際上有無數挑戰。多數情況下，這需要同時執行兩個渲染器或結合多個執行環境，導致下載時間過長，並不理想。 Hana 在 3D 和 2D 上使用同一個執行環境，更有效率，也靈活得多。 另一個核心問題是品質，或者說，缺乏品質。 要把兩套系統合而為一，同時維持相同的品質水準，是一大挑戰，因為 3D 品質涵蓋多個因素：反鋸齒、解析度、多邊形數量（或高體素密度）、物件數量等。 在 Hana 中，你可以建立任何 2D 形狀並將它轉換成 3D 物件，同時與原始形狀保持即時連結。 這表示你隨時都能修改原始形狀，而 3D 物件會根據原始形狀即時重新生成。 這讓在 2D 構圖中進行 3D 創作的生產力大幅提升。例如，你可以輕鬆建立 3D 文字，並更改它的顏色、字型或其他屬性，同時在非破壞性的工作流程中保留文字的所有彈性。 版面可以動態更新，而 3D 物件會遵循 2D 構圖的規則。 以 Hana 3D Shapes 打造的體驗 ## 3D 遵循 2D 在 Hana 中，每個 3D 物件都有自己的座標系統。不過，它仍然遵循 2D 畫布的規則與行為，這表示你通常會用在 2D 物件上的一切，都能套用到 3D 物件上。 這為各式各樣的設計可能性打開了大門。 ## 限制 目前，Hana 的 3D/2D 系統只提供有限的功能。 你可以將任何 2D 形狀擠出成 3D，並對材質有相當程度的控制，但仍有很大的空間發展新的可能性。 理想上，3D 系統應該能渲染任何類型的 3D 物件或場景，限制也要少得多。 ## 這只是開始 過去幾年，我們在 Spline 努力打造一套整合 2D、3D，最終還有 4D 的一致設計系統。 我們迫不及待要繼續朝這個令人興奮的未來邁進。 — Spline 團隊 🌸 ## 更多部落格文章 [2026年11月3日Spline Arena 登場](https://spline.design/zh-hant/blog/introducing-spline-arena)[2026年10月21日Spline for ChatGPT 登場](https://spline.design/zh-hant/blog/introducing-spline-for-chatgpt)[2026年8月27日Hana V2 登場](https://spline.design/zh-hant/blog/hana-v2) [Spline](https://spline.design/zh-hant) 為團隊及其 AI 代理打造的 3D 與 2D 編輯器。一鍵發布到網頁、iOS 和 Android。 #### 向 AI 詢問 Spline #### 產品 - [3D 設計](https://spline.design/zh-hant/3d-design) - [Hana](https://spline.design/zh-hant/hana) - [Omma](https://omma.build) - [AI 3D 生成](https://spline.design/zh-hant/ai-generate) - [Spline MCP](https://spline.design/zh-hant/mcp) - [Spline Arena](https://spline.design/zh-hant/arena) - [價格](https://spline.design/zh-hant/pricing) - [企業](https://spline.design/zh-hant/enterprise) #### Runtime - [Web](https://spline.design/zh-hant/web) - [iOS](https://spline.design/zh-hant/ios) - [Android](https://spline.design/zh-hant/android) #### App - [下載](https://spline.design/zh-hant/download) - [Spline Mirror](https://spline.design/spline-mirror) - [下載 Spline Mirror](https://spline.design/download-mirror) #### 學習 - [Docs](https://docs.spline.design/) - [Academy](https://spline.design/zh-hant/academy) - [Spline API](https://www.npmjs.com/package/@splinetool/runtime) - [解決方案](https://spline.design/solutions) #### 社群 - [Spline 社群](https://community.spline.design) - [Blog](https://spline.design/zh-hant/blog) - [更新日誌](https://spline.design/zh-hant/changelog) - [教育](https://spline.design/zh-hant/education) - [Contra](https://spline.design/contra) - [聯盟行銷](https://spline.design/zh-hant/affiliate) #### 公司 - [客戶](https://spline.design/zh-hant/customers) - [工作機會](https://www.ycombinator.com/companies/spline/jobs) - [安全性](https://spline.design/zh-hant/security) #### 法律資訊 - [條款與細則](https://spline.design/terms) - [隱私權](https://spline.design/privacy) #### 聯絡我們 - [help@spline.design](mailto:help@spline.design) - [jobs@spline.design](mailto:jobs@spline.design) © 2026 - Spline, Inc.