Natural n' Vintage
- Client
- Natural n' Vintage (antique & vintage furniture dealer, Taiwan)
- Year
- 2018 / 2026
- Role
- Design, front-end, WordPress back end, deployment (solo, freelance)
- Stack
- Nuxt 3, Locomotive Scroll, Swiper, @nuxt/image, headless WordPress
- Link
- naturalnvintage.com
I joined Natural n' Vintage's founding team in 2017 and built its first website in 2018. It was the first website I ever made, and it's where I learned front-end, while I also handled print, product photography and the store itself (store manager, 2018–2019). In 2026 I redesigned and rebuilt the site from scratch as a headless WordPress + Nuxt catalogue.
我在 2017 年加入 Natural n' Vintage 的籌備團隊，2018 年做了店裡的第一個網站。那是我做的第一個網站，也是我開始學前端的地方；同時我也負責印刷品、商品攝影和門市（2018–2019 年擔任店長）。2026 年，我把網站從頭重新設計、重新製作，改成 headless WordPress + Nuxt 的型錄網站。
Every antique is one of a kind. When it sells, it's gone. The site has to look like a curated showroom and still work as a live inventory that changes every week. I designed it and built it end to end.
每一件古董都是獨一無二的，賣掉就沒了。這個網站要看起來像一間有選品眼光的展示間，同時又是每週都在變動的即時庫存。設計和製作都由我一個人完成。
A catalogue that tells the truth
The catalogue changes constantly, so the details matter: • Sold pieces stay visible but are clearly marked Sold Out, which shows range and history without misleading anyone. • The shop owner reorders items in the back end, and the site rebuilds only the affected index instead of the whole cache, so new arrivals appear right away. • Responsive images with correct srcset so close-up photos stay sharp without slowing the page down.
型錄天天在變，所以細節很重要： • 已售出的商品保留在網站上，但清楚標示 Sold Out，看得出店家的選品廣度，也不會誤導客人。 • 店家在後台調整商品順序時，網站只重建受影響的列表，不會整個快取重來，新到貨能馬上出現。 • 圖片設好正確的 srcset，細節照夠清楚，頁面也不會變慢。
Exploration
I prototyped a progressive-blur frame for the image views, using stacked backdrop-filter layers and gradient masks, with a live tuning panel. It didn't ship.
我做過一個漸進式模糊邊框的原型：疊多層 backdrop-filter 加上漸層遮罩，還有即時調整面板。最後沒有上線。