Web/Next.js/Vercel
繪師個人作品集網站
繪師客戶的作品集網站:前台展示作品,後台可自行新增與更新內容。
背景
繪師需要對外展示作品,也希望之後能自己上架新圖、改介紹文字,而不是每次改版都找人改程式。
我做了什麼
以 Next.js 建置前台頁面,串接 Headless CMS,讓客戶在後台管理作品與文案;並處理 SEO 與靜態產出設定。
設計重點
- 作品列表與詳情頁載入順暢
- 後台欄位對應前台區塊,減少客戶學習成本
- Lighthouse 四項指標維持 90 分以上
技術
- Next.js
- Headless CMS
- Vercel
- SSG/SSR
成果
已部署 artdemo.lambliver.dev 作為公開展示範本,客戶可透過 Notion CMS 新增作品與更新內容。
畫面

作品展示首頁與導覽結構

Notion 後台管理作品與分類
GitHub(即將公開)Demo