設計工作室的網站，大多是一面作品牆：幾十張漂亮的效果圖或攝影，配上項目名稱和年份。這樣的網站能展示審美，卻很難讓潛在委託人回答兩個問題：這家工作室怎樣思考空間？我的項目找他們合不合適？
這篇拆解 Foundax 案例庫中的間序 INTERVAL。它是一個虛構的建築與室內設計工作室，作品集包含住宅、咖啡店和展廳三個概念項目。它的做法是：少放作品，多講空間關係，再把「合不合適」交給一張清楚的項目查詢表格。
設計工作室網站難在哪裏
- 作品牆說不清方法。 一張張效果圖展示了結果，卻看不出設計判斷從哪裏來。
- 照片看不懂空間。 單張照片很難讓人理解房間之間的關係和動線。
- 合作方式不透明。 委託人不知道從哪一步開始、要準備甚麼。
- 查詢門檻高。 「聯絡我們」背後沒有任何引導，很多人不知道該寫甚麼。
所以間序的設計目標是：讓潛在委託人先認同工作室的審美，再理解它怎樣思考空間、怎樣合作，最後帶着具體的項目資料來查詢。
設計概念：一場關於空間的對話
工作室關心的是「空間如何被使用，以及那些慢慢發生的日常」。首頁的記憶點是一棵樹：同一座庭院住宅的多個視角都圍繞這棵楓樹展開；平面圖上的一個點位，對應照片中的一種空間感受。
視覺語言：紙白、炭墨與一抹陶紅
頁面以紙白為底，炭墨色的大字品牌名佔據首屏，攝影保持人的視線高度、端正的垂直線和自然側光。陶紅只在查詢章節大面積出現，讓最後的行動有明確落點。
- 紙白
#F3F1EA頁面底色 - 炭墨
#242824品牌大字與內文 - 石灰
#716C61次要文字與說明 - 陶紅
#A24F37查詢章節底色與關鍵強調 - 葉灰
#D4D8CA平面圖與輔助色塊
| 用途 | 字體 | 原因 |
|---|---|---|
| 品牌字與介面 | Manrope | 寬闊、平實的無襯線字，大字號下有建築感 |
| 手記式短句 | Baskerville 斜體 | 少量使用，像設計師在圖紙邊寫下的一句話 |
| 中文 | 宋體 | 與攝影的安靜氣質一致 |
四個招牌時刻
入口
從一道光，走進一個空間
大幅 INTERVAL 字標壓在庭院攝影上方，首屏就有「走進這座住宅」的入口。
作品
不同的空間，共同的日常
住宅、咖啡店、展廳以錯落的畫幅展開，每個項目配一句設計命題，按「探索項目」進入詳情頁，詳情頁內有「查詢類似項目」入口。
導覽
空間之間，自有聯繫
點選平面圖上的三個點位，照片、視角編號和說明同步切換，讓訪客理解房間之間的關係。
合作
好的空間，讓日常有處安放
四步工作方式可以逐項展開，說明由了解日常到落實細節的順序，以及哪些範圍要在委託中約定。
六幕頁面分鏡
01
首屏：從一道光，走進一個空間
大幅品牌字與庭院攝影建立第一印象。標題一次顯露，影像緩慢歸位，主入口直接進入這座住宅。
02
作品：不同的空間，共同的日常
庭院住宅以最大畫幅領頭，作品名稱、類型和一句設計命題同時可見。
03
作品：街區與舊建築
巷口咖啡和白間展廳錯落排列，用陶紅吧枱、舊磚牆和木樑說明每個項目的材料判斷。
04
導覽：空間之間，自有聯繫
照片佔約三分之二寬度，平面圖在右。點選庭院、迴廊、起居室三個點位，照片和視線方向一起切換。
05
方法：好的空間，讓日常有處安放
工作室用光線、停留和材料講自己的關注點，四步合作方式逐項展開，不承諾統一工期。
06
查詢：你想在怎樣的空間裏生活
陶紅色收尾，表格只問項目類型、地點、面積、稱呼、電郵和一段描述，從項目頁進入時會帶入項目類型。
平面圖導覽：由看照片，到理解空間
導覽章節是間序最有辨識度的設計。照片解決「好不好看」，平面圖解決「在哪裏、怎樣走」。三個攝影點位與平面位置一一對應，訪客點哪裏，就從哪裏看過去。手機上先看照片再點平面，功能完整保留。
這個導覽也照顧了無障礙：平面上的點位是真正的按鈕，帶有「01 庭院」這樣的讀屏標籤和選中狀態，用鍵盤也能切換。這與 W3C WCAG 2.2 對可操作控制項的要求一致。頁面同時註明「概念影像與空間關係示意，不作為施工依據」。
由作品到查詢
每個項目頁都有「查詢類似項目」入口，進入查詢頁時會自動帶入項目類型；表格使用 Foundax 原生的表格功能，提交記錄進入後台，方便工作室跟進。作品、工作室介紹和合作方式也都是可以在編輯器中直接修改的頁面。想了解這部分功能，可以看 Foundax 功能介紹。
可以直接借鏡的清單
- 少放作品，每個作品都配一句設計命題，而不只是名稱和年份。
- 用平面圖和照片聯動解釋空間關係，讓訪客「走進去」。
- 把合作方式拆成幾個步驟，寫清楚哪些要在委託中約定。
- 查詢表格只問判斷項目所需的資訊，並從項目頁帶入項目類型。
- 用一個強烈但克制的顏色標記最後的行動。
- 概念影像要寫明用途界限，不當作施工依據或真實作品。
常見問題
作品數量少，會不會顯得不夠專業？
精選幾個講得清楚的項目，比堆滿作品牆更能說明設計能力。每個項目講清命題、材料和空間關係，委託人更容易判斷是否適合。
平面導覽需要準備甚麼素材？
一張簡化的平面圖，加上從幾個點位拍攝的照片，以及每個點位的一句說明。換成自己的項目時，同步替換平面、照片、點位和說明即可。
間序是真實工作室嗎？
不是。間序 INTERVAL 是 Foundax 團隊製作的虛構品牌案例，所有項目都是概念項目，表格在案例中只作示範。
可以用這個設計開始建立自己的網站嗎？
可以。在 間序案例頁 選擇「以此範本開始」，註冊後會以這個案例為起點建立網站，再換上你自己的作品和工作室資料。更多行業的設計方法，可以看 品牌網站設計指南。