作品集・電商網站

STRYDE — 運動品牌電商作品

自主開發的技術能力展示・非真實客戶案件

Next.js · TypeScript · Tailwind CSS · Hono API

這個作品在展示什麼

同樣是電商,不同品牌調性需要完全不同的視覺語言。這個作品參考國際運動品牌的網站設計, 示範如何用巨幅標語字體、高對比配色與動態實拍照片,做出截然不同於一般選物站的 「能量感」品牌網站——同時保留完整的商品瀏覽與篩選體驗。

設計重點

互動細節:商品需先選擇尺寸才能加入購物車,選中狀態會立即反白, 分類篩選切換時商品格會即時更新——這些都是實際可以點擊操作的真實互動, 不是靜態設計稿。

技術與架構

Next.js 15 + TypeScript + Tailwind CSS 打造前台;Hono 提供商品/結帳 API; Zustand 管理購物車狀態,並支援「同商品不同尺寸」分開計算的購物車邏輯。 商品圖片與品牌識別皆為原創/授權素材,非真實商標。

喜歡這個風格?想做類似的網站或系統?描述它,30 秒拿到初估,或直接留下聯絡方式由工程師評估。