同一組效果,換個主題可以完全不像同一個東西。 這四個站用的是同一批 15 個效果檔案,差別只在參數、配色與節奏。
重點不是效果多,是效果為主題服務: 「珀」的每個動畫都比別人慢兩倍,「潮」的都快一倍,「墨」把加法混合換成正常混合才畫得出墨色。
100vh 大標 hero → 左右交錯兩欄 → CTA,
每個效果各自一個 WebGL context。它們是一個版型的五種塗裝。沒有 hero、沒有區塊、沒有翻頁。捲動驅動的是相機在一個連續 3D 空間中前進, 說明牌依你站在哪件展品前面切換。整站只有一個 WebGL context—— 所以金器會照亮玻璃、玻璃會在地上投影,這是分開的 canvas 做不到的。
紫藍色調的通用形象站。流體 hero、粒子關鍵字、玻璃、全像卡、影像轉場。
唯一的淺色主題。宣紙底、墨色粒子、山巒線條,整站只有一個彩色——朱紅。
黑底螢光綠。故障 hero、可拖曳商品牆、粗體大字、跑馬燈。跟「墨」是刻意的兩極。
深褐與香檳金。液態金屬、玻璃折射、編號典藏卡。所有動畫都慢 1.5~2 倍。
整站只有一條色軸:焦黑到亮金箔,沒有第二個色相。熔金流體、金塊、燒灼的金箔、金粉。