自主概念設計 · 直播主與內容創作者網站
IceTigerKitten 創作者品牌網站
採用深色冰霜視覺的創作者品牌網站,整合內容分類、精選影片、社群介紹、品牌合作、周邊商品與聯絡入口。
這是自主製作、概念設計或介面練習,展示可查看的設計與實作;並非客戶委託成果,未提供客戶營收或轉化成效證明。

項目拆解
從頁面結構,到實際畫面。
ZequnWeb 自主作品,非客戶委託;Demo 中的品牌、評價與數據屬於展示內容,不代表已核實的客戶成果。
完整網站與手機畫面
英文 Demo 的桌面與手機長圖會自動從頂部展示到底部。可暫停後手動捲動、從頭重播,或開啟原圖。
01 / 頁面架構
訪客的資訊瀏覽路徑
- 01創作者定位
- 02內容分類
- 03精選影片
- 04社群
- 05品牌合作
- 06周邊
- 07聯絡
02 / 視覺設計
以深色冰霜視覺和電影感首頁區別於插畫作品集方向,粉絲內容與品牌合作區塊分別回應兩類訪客需求。
03 / 響應式取捨
內容卡片與合作選項按單欄排列,社群和聯絡連結提供直接目的地。
依據現有實作整理的設計分析,不將其表述為客戶調研或使用者測試記錄。
具體實作
技術組合
- Next.js
- React
- Cloudflare Pages
只列出現有項目記錄或公開腳本可支持的技術;內容架構與 UX 在上方獨立說明。
自主概念設計
交付內容與項目結果
概念重點
設計與實作說明
項目背景
同時面向粉絲與品牌合作方的創作者網站實作展示,兼顧人物風格、內容探索及合作資訊。
設計帶來的改變
以電影感主視覺串聯五類內容、精選影片、社群評價、四種品牌合作方式與周邊商品,提供不同訪客所需的入口。
可查看的設計重點
- Next.js 品牌網站示範可瀏覽
- 五類內容、精選影片與社群資訊搭配呈現
- 合作方式、Discord 與聯絡表單提供不同需求的入口
需要解決的問題
粉絲與品牌合作方需要不同的內容入口,同時保留創作者的視覺辨識度。
設計方案
以電影感主視覺串聯五類內容、精選影片、社群評價、四種品牌合作方式與周邊商品,提供不同訪客所需的入口。
交付內容
- 直播主與創作者品牌首頁
- 內容、社群與精選影片區塊
- 品牌合作、周邊商品與聯絡動線
技術與實作
- Next.js
- 響應式 CSS
- 元件化前端
項目價值
這個概念展示了甚麼
以電影感主視覺串聯五類內容、精選影片、社群評價、四種品牌合作方式與周邊商品,提供不同訪客所需的入口。
查看其他項目 →由此開始
想把這個方向變成您的網站?
提供業務類型、現有網站或參考網站、目標客戶及大概預算,我會先協助您釐清有用的製作範圍。


