作品集搬遷分享

為何要調整作品集?
如果有看過我之前在 LinkedIn 的分享,會知道當時是用 GitBook 管理作品集。老實說,它真的很讚,用文件的形式清楚地記錄內容,自帶 RWD 與頁面編輯器,而且目前仍然是免費的。但使用一段時間後,也發現幾個限制:
- 無法綁定自己的網域,付費方案價格偏高。
- 頁面客製化與設計彈性有限。
- 與我的 Landing Page 分屬不同的託管平台。
這些因素,推動我進行改版。
作品集該以什麼形式保存?
近期開始思考:作品集到底該用什麼形式留下來 於是上網找了各種「文件型」網站的做法。說也奇怪,身為設計師的我,作品集的 Roadmap 大概是:
Issuu → Wix → Behance → GitBook → ??
從這路線其實可以看出來,我從一開始討厭製作作品集,到後來逐漸渴望更多的自主空間。這個轉變讓我蠻興奮的,早期非常迷戀那種很 fancy 的網頁效果和互動內容(老實說現在也是!),後來學習無障礙設計和求職期間,開始關注:作品集要怎麼被更有效率地管理與閱讀?
我的經驗是為別人設計產品時總是可以想得很周全,但輪到為自己設計作品集,卻很容易陷入懶惰模式: 有什麼一鍵式工具就直接用,對作品的排版與敘述也不太講究。結果就是:作品本身其實很精彩,卻沒有被好好地傳達出去,也許作品集的「展示櫃」,可以交給 Docusaurus?
什麼是 Docusaurus ?
Docusaurus 是由 Meta(Facebook)推出的開源靜態網站工具,使用 React 建構,主打「以文件內容為核心」的快速建站體驗。
聽起來很簡單,實際上會需要一點學習成本。具備基本的 Markdown 語法 與網頁程式概念,就能開始建立自己的網站。
使用前後的差異化分享
從 Builder( 製作者 ) 與 User( 閱讀者 )兩個角度,分享我改版的感受差異。
Builder
- 使用 Docusaurus 時,大多數時間都在 VS Code 與 localhost:3000 之間來回查看成果。如果有特別的介面設計,也可以直接「手搓」出來,像是我Landing page 的動態效果,自由度相當高,很推。
相較之下,GitBook 則是使用頁面編輯器,體驗有點像在 Medium 寫作,後台又帶點 Wix 的感覺,可以做一些全域性的頁面調整。
-
在建置過程中,會越來越清楚管理架構與命名邏輯。這也是一種對自己身為設計師的反思——好的資訊架構,應該是大家一看就懂的。尤其是圖檔管理與文件結構,真的是一門藝術。
-
學習 GitHub、Netlify 等一條龍的部署流程。比起早期直接套模板、一鍵發佈的做法,現在每一次發佈內容,都會更有意識地去思考整個細節與檢核。
User
- 將 Landing Page 直接嵌入在首頁中,增加 Top Nav,使用者可以更直觀地找到所需資訊,而不是被卡在動態首頁裡。之前 Landing Page 與 GitBook 的組合,確實容易讓人停留在 3D 畫面中迷路。
- 新增 Footer,讓手機用戶可以快速跳轉到相關資訊,不會卡住操作流程。(誰叫 GitBook 把這個功能設成付費版 QQ)
- Blog 成為讓網站「持續成長」的關鍵功能。它不同於 Project 或 CV,是一個可以不斷累積內容的空間,也不用再煩惱文章該發在哪個社群,還能透過社群導流回網站,讓網站保持流量健康。
小結
實際建立網站中,感受到自己的知識與內容,真的被好好地記錄下來了。這種感覺蠻讚的,也讓我不再只是紙上談兵,而是透過實作去累積成果。
Blog 的功能也解決了我「到底該把寫作發在哪裡」的困擾,真的是一舉多得。我知道對工程師來說,擁有個人網站幾乎是 common sense,也看過不少工程師朋友都有一塊屬於自己的淨土。因此也很推薦設計師,不妨試試看打造自己的網站。
當然,作品集還有不少地方可以再優化,例如:更多專案分享、英文語系切換、或是嵌入 Clarity Heatmap(這個我真的超想試)。
總之,未來會持續更新內容,也期待能產出更多專案與技術分享。
Peace ✌️
連結
- 新版作品集 https://ray-120.com/
- 舊版作品集 https://v1.ray-120.com/