Lynksen 如何用 Spline 讓複雜的 B2B 平台網站活起來

Elecctro 為無人化服務打造軟體系統，例如自動販賣機、電動車充電樁和自動洗車設備。他們的產品橫跨硬體與軟體，所處的市場一向以密密麻麻的規格表和技術圖表與 B2B 買家溝通。他們的使命，是透過智慧、互聯的解決方案，讓無人化服務走向現代化。

Elecctro 需要一個網站，但不是隨便一個網站。它必須能抓住買家的注意力，久到足以真正說明他們在做什麼；在視覺上與數十家類似的公司區隔；並讓訪客快速做出決定。

「他們需要傳達大量資訊，」受邀重新打造網站體驗的數位設計公司 Lynksen 的專案經理 Tania 說，「但他們也想在一個技術味很重的領域中脫穎而出。」

答案不是更多內容，而是一種截然不同的互動介面。

一個用來探索、而不只是閱讀的首頁

Lynksen 的核心概念看似簡單：讓使用者自己探索整個系統，而不是只用文字解釋。

首頁變成了一個互動式 3D 場景：以空間方式呈現 Elecctro 的完整產品線，使用者可以懸停、點擊，並依自己的步調瀏覽。場景中的每個物件都連結到專屬的產品頁面。從「這是什麼產品？」到「我準備好聊聊了」，只需要點幾下。

使用者進到首頁就能看到一切，只要點一下，就已經在朝向提供 Elecctro 所需資訊的方向前進。

這是一個意義重大的轉變。大多數 B2B 網站把首頁當成目錄，而 Lynksen 把 Elecctro 的首頁打造成一個讓人穿梭其中、而不是由上往下閱讀的環境。

為什麼選擇 Spline？

願景很清楚，但要如何實現？

傳統的 3D 工具不在考慮範圍內，光是學習曲線就會把整個專案拖垮。更重要的是，Elecctro 的團隊必須能在上線後自行維護網站。這表示不能有黑箱般的流程、不能依賴專業美術人員，也不能用那種光是換一個素材就得花好幾個月上手的工具。

Lynksen 評估了 Spline，看到了一條不同的路：

• 在同一個環境中打造與迭代。
• 直接在工具中製作互動原型。
• 不需複雜的交接流程，就能交付可直接上線的素材。

我們從幾乎毫無經驗，到一次就交付完整的專案。

讓這一切成為可能的不只是工具，還有社群。在寫下任何一行程式碼之前，Lynksen 團隊花時間在 Spline 的社群作品庫中：探索重新混搭的作品、了解其他設計師如何處理互動，並找出可以運用在這個客戶專案上的技巧。

有 Spline Community 這樣的地方，裡面有各種專案，還能重新混搭來看別人如何處理不同的互動，對我們的學習幫助很大。

對 Elecctro 來說，還有另一個考量：長期可維護性。

他們想要一個上線後團隊真正能自己掌握的解決方案。

在我們交接之後，不需要太多技術背景，就能新增物件、做出不同的互動並維護專案。這對我們來說是非常關鍵的優點。

打造體驗

Lynksen 的流程一開始完全沒有動態。

靜態線框圖、平面的 UI 版面，在加入任何動畫之前，就先建立清楚的資訊層級。直到結構穩固後，團隊才開始一層層加上去。

「我們總是從靜態開始，再一層一層加上動畫，」Tania 說，「我們在線框圖和草圖中定義關鍵狀態，實作時再微調攝影機運鏡、嘗試各種動畫，確保一切都如預期般融為一體。」

這份紀律讓專案不至於被自己的野心壓垮。團隊堅守一個簡單的設計原則：動態是為敘事服務的。

實際上，這代表：

• 3D 素材上細膩的懸停狀態與微互動
• 隨捲動逐步呈現的內容，引導注意力而不強求
• 幫助使用者定位、而不是讓人眼花撩亂的攝影機過渡
• 將奔放的創意留給次要時刻（頁尾、404 頁面），在那裡小驚喜是一種樂趣，而不是干擾

404 頁面成了團隊的最愛之一。它完全以 Spline 打造，使用者可以四處點擊，發掘隱藏的 3D 素材。這是一個大多數訪客永遠不會發現的小彩蛋，但 Lynksen 團隊顯然做得很開心。

「藏一個小彩蛋很酷，」Ross 說，「如果有人發現了，身為設計師的我們會超開心。」

網站導覽選單中使用的 3D 圖示細節。

成果

重新設計的網站上線後，數字立刻有了變化。

活躍使用者成長了 524%，專案也獲得 5 項大獎。

網站新增了 20,000 次瀏覽，也引起了設計社群的注意。

這些成果反映了團隊刻意打造的東西：不只是一個好看的網站，而是一個真正有效的網站。它既能滿足需要清楚資訊的買家，也讓客戶團隊不需要全職開發人員待命就能維護。

給正在考慮 3D 的團隊

對第一次考慮在網頁上使用 3D 的團隊，Tania 的建議很簡單：不要從傳統工具開始。

使用 Spline，學習曲線是可以應付的。有設計能力的人幾天內就能上手。我們的團隊在使用的第一週內就做出了扎實的 MVP。

Ross 認為這代表團隊處理 3D 方式的更大轉變：不必拼湊多個複雜的工具和工作流程，團隊可以在單一環境中設計、迭代和交付，讓互動式 3D 從一開始就容易上手得多。

如果你想在同一個環境中工作、不需要高深的技術知識，而且能把看到的東西直接交付上線，那就選 Spline。

對於向客戶提案互動網頁體驗的設計公司來說，這個專案提供了有力的證明：只要有對的工具，你就能在一個專案之內，從毫無經驗做到獲獎網站。

開始使用 Spline

和 Lynksen 一樣，設計公司可以運用 Spline，透過更容易理解、更容易維護、也更令人難忘的互動體驗，幫助客戶傳達複雜的產品。

對 Elecctro 來說，這代表把一個技術性的 B2B 平台，變成一個能清楚說明產品、加速決策，並幫助品牌在擁擠市場中脫穎而出的互動網站。

無論你是為客戶打造作品的設計公司，還是企業內部團隊，Spline 都能幫助你更快地從想法走到正式上線，不需要複雜的 3D 流程或專業技術能力。

聯絡業務