← 單一特效展示

綜合示範

同一組效果,換個主題可以完全不像同一個東西。 這四個站用的是同一批 15 個效果檔案,差別只在參數、配色與節奏。

重點不是效果多,是效果為主題服務: 「珀」的每個動畫都比別人慢兩倍,「潮」的都快一倍,「墨」把加法混合換成正常混合才畫得出墨色。

誠實說明:下面前五個共用同一套骨架 —— 100vh 大標 hero → 左右交錯兩欄 → CTA, 每個效果各自一個 WebGL context。它們是一個版型的五種塗裝。
「廊」是重新設計的:沒有 hero、沒有區塊、整站只有一個 canvas, 捲動驅動的是相機在空間中前進。差別在結構,不在配色。
廊

白盒展廳 結構重新設計

沒有 hero、沒有區塊、沒有翻頁。捲動驅動的是相機在一個連續 3D 空間中前進, 說明牌依你站在哪件展品前面切換。整站只有一個 WebGL context—— 所以金器會照亮玻璃、玻璃會在地上投影,這是分開的 canvas 做不到的。

單一場景捲動 = 前進 全白金器為主展品
曜

品牌形象站

紫藍色調的通用形象站。流體 hero、粒子關鍵字、玻璃、全像卡、影像轉場。

7 個效果最完整附效能面板
墨

東方極簡形象站

唯一的淺色主題。宣紙底、墨色粒子、山巒線條,整站只有一個彩色——朱紅。

淺色底直排茶/文創/建築
潮

街頭潮流電商

黑底螢光綠。故障 hero、可拖曳商品牆、粗體大字、跑馬燈。跟「墨」是刻意的兩極。

故障商品牆球鞋/服飾
珀

精品電商

深褐與香檳金。液態金屬、玻璃折射、編號典藏卡。所有動畫都慢 1.5~2 倍。

液態金屬慢香水/珠寶/腕錶
鎏

熔金主題

整站只有一條色軸:焦黑到亮金箔,沒有第二個色相。熔金流體、金塊、燒灼的金箔、金粉。

6 個效果單一色系貴金屬/頂級會員