網頁 提示詞
奢華 3D 手錶產品體驗頁面 (Next.js + Three.js)

一個詳細的日文提示,用於設計一個豪華 3D 產品體驗網頁,專為高階手錶打造,使用 Next.js、Three.js、React Three Fiber、GLSL,並包含特定的捲動區塊和著色器要求。
提示詞
為一款奢華腕錶設計 3D 產品體驗頁面。 **目標使用者:** 30–50 歲的富裕客戶、腕錶愛好者和商務人士。 **品牌調性:** 奢華 × 科技(現代、精緻的高端感受)。 滾動體驗(5 個部分): 主視覺區塊 – 腕錶在旋轉的同時,從黑暗中緩緩顯現於光線下。運用全息效果和菲涅耳反射,並搭配客製化著色器。 細節特寫 – 錶盤的特寫鏡頭。使用 GLSL 實現金屬反射、視差貼圖和即時光澤。 機芯分解 – 腕錶分解,內部機芯懸浮在空中。使用置換著色器營造能量場效果,並為每個零件添加發光效果。 材質體驗 – 在不同的材質變體之間切換。透過 PBR 著色器以物理基礎的方式呈現金屬感、玻璃折射和鈦金屬的啞光紋理。 結尾 – 腕錶重新組裝,背景為使用客製化著色器製作的抽象漸變網格。應用後製處理,例如泛光和景深。 **技術堆疊:** Next.js 15 + Three.js + React Three Fiber + GLSL (客製化著色器) + react-postprocessing + Lenis。 著色器要求: 菲涅耳反射著色器(邊緣光效果) PBR 材質著色器(粗糙度、金屬度、AO) 全息著色器(虹彩干涉效果) 置換著色器(波動和扭曲效果) 客製化背景著色器(漸變噪點) 後製處理:Bloom、ChromaticAberration、DepthOfField、Vignette。 請為以下項目提出具體的數值: 每個區塊的滾動範圍(以 % 或 vh 單位表示) 動畫參數(位置、旋轉、縮放等的起始/結束值) 緩動函數(緩動類型) 攝影機 FOV、位置和目標值 燈光設定(強度、顏色、位置) 每個著色器的 Uniform 值(時間進度、滾動進度、色相、強度等)。


