一打開只看到一行「PRESS ENTER TO CONTINUE」,對,要先按 Enter「開機」才進得去!接著超大的哥德體「CREATIVE DEVELOPER」浮出來,整個畫面再組裝成一個佈滿小視窗的桌面,開場蠻有梗的~

網站主人是法國 Creative Developer、Metabole Studio 共同創辦人 Matteo Courquin。大家的作品集都在拼轉場時,他直接把作品集做成一個可操作的介面。

■ 視覺設計特色

- 淺灰格線底配黑色標題列的視窗,用 [WORK/LIST]、[ABOUT] 這種路徑命名,很有檔案系統的味道

- 背景是滿版哥德體字,中間浮著帶彩虹反光的 3D 玻璃雕塑,冷調介面和古典字體衝突感超強

■ 互動與動態效果

- BIOS 開機 → 開場字 → 視窗依序組裝,整段就像電腦開機

- 滑到作品清單,[WORK/GRID] 即時預覽;按數字鍵直接打開專案視窗

- [ABOUT] 文字先亂碼跳動再解碼 (Text Scramble)

- 背景即時顯示 Ping 值、解析度、滑鼠速度、點擊次數,還有一堆快捷鍵彩蛋

■ 技術實現觀察

- Next.js + Sanity + Vercel,動態用 GSAP + Lenis,3D 物件用 Three.js

-

說實在的,最厲害的是它把開發者身分直接變成設計語言:開機畫面、系統資訊、快捷鍵這些平常藏在後台的東西全搬到前台,等於用網站本身證明「我是寫程式的」,推薦給正在想作品集怎麼做出差異化的朋友~

網站連結:

matteocourquin.com/en