自主創意實驗 · 沉浸式 3D 作品集
ZequnWeb 沉浸式 3D 作品集
ZequnWeb 自主實驗作品集，以即時 3D 粒子場景、懸浮項目預覽及分類導覽，讓訪客在探索中發現作品。
這是自主製作、概念設計或介面練習，展示可查看的設計與實作；並非客戶委託成果，未提供客戶營收或轉化成效證明。
項目拆解
從頁面結構，到實際畫面。
ZequnWeb 自主作品，非客戶委託；Demo 中的品牌、評價與數據屬於展示內容，不代表已核實的客戶成果。
完整網站與手機畫面
英文 Demo 的桌面與手機長圖會自動從頂部展示到底部。可暫停後手動捲動、從頭重播，或開啟原圖。
01 / 頁面架構
訪客的資訊瀏覽路徑
- 013D 場景
- 02項目預覽
- 03作品分類
- 04項目索引
- 05聯絡
02 / 視覺設計
以懸浮影像和虹彩粒子構建空間感，簡潔導覽在動態場景中提供穩定的閱讀錨點。
03 / 響應式取捨
窄螢幕保留場景與直接導覽，項目索引為尋找具體作品提供文字路徑。
依據現有實作整理的設計分析，不將其表述為客戶調研或使用者測試記錄。
具體實作
技術組合
- WebGL
- JavaScript
- Cloudflare Pages
只列出現有項目記錄或公開腳本可支持的技術；內容架構與 UX 在上方獨立說明。
自主創意實驗
交付內容與項目結果
概念重點
設計與實作說明
項目背景
這是 ZequnWeb 發佈於獨立示範站的自主作品集實驗，展示工作室自身的作品與概念，並非客戶委託項目。
設計帶來的改變
將平面項目瀏覽轉化為空間體驗，動態卡片與粒子視覺配合熟悉的分類連結及全部作品索引。
可查看的設計重點
- 線上示範可查看即時 3D 場景
- 分類導覽及項目索引提供不同瀏覽方式
- 主導覽保留作品、工具、關於與聯絡入口
- 作品預覽為實際網站錄製的 10 秒短片
需要解決的問題
作品集既需要留下鮮明的視覺印象，也要讓訪客方便地找到項目與聯絡入口。
設計方案
將懸浮項目預覽置於即時 3D 粒子場景中，結合滾動互動、分類導覽及獨立項目索引，連接視覺探索與直接瀏覽。
交付內容
- 沉浸式 3D 作品集體驗
- 懸浮項目預覽與滾動互動
- 項目分類及常規作品索引
- 10 秒網站實錄預覽
技術與實作
- WebGL
- JavaScript
- 響應式 CSS
- Cloudflare Pages
項目價值
這個概念展示了甚麼
透過具辨識度的視覺體驗展示創意能力，同時保留直接查看項目與聯絡工作室的清晰路徑。
查看其他項目 →由此開始
想把這個方向變成您的網站？
提供業務類型、現有網站或參考網站、目標客戶及大概預算，我會先協助您釐清有用的製作範圍。