設計Web如建築般美好 以用戶活動流程為核心

導讀：本文的作者David galbraith是一名建築設計師，同時也是一名優秀的Web設計師，擅長產品的用戶體驗設計。文中作者通過一個實例來講述用Web設計的理念去設計一個建築，怎麼樣使一個建築像Web程序一樣更加人性化，更加符合用戶體驗。

自從我擁有建築設計師和Web設計師的雙重身份之後，我常想，如果像設計Web應用程序一樣去設計建築一定會是件非常有趣的事情。

Web設計VS建築產品設計

最近幾年，隨著那些較之傳統網頁設計師更像建築設計師的用戶體驗專家不斷增多，網頁設計逐漸開始發展起來了。當然，這並不是說傳統網頁設計師不擅長用戶體驗設計，只是說目前網頁設計師這個角色逐漸被大眾理解為是單純美工設計人員。

當然，這也不是說美工不重要的，主要是因為網頁設計不僅僅是靠美工設計就可以完成的，而是需要通過一個完整的產品設計來呈現出來。例如，有許多公司的Flash網站，美工設計非常精美，但是在實用功能上卻非常欠缺。與此形成鮮明對比的是，另外一些實用主義者例如Jakob Nielsen設計的網站，實用性非常好，但美觀度實在令人不敢恭維。用戶體驗不僅僅是由功能性決定的，而是由包括歷史、文化及認知等眾多因素決定的。否則的話，也不會有人去使用qwerty鍵盤或者駕駛被限速的保時捷。

因為互聯網相對而言還是一個新事物，網頁設計在能夠反映出建築師和產品設計師所扮演角色的不同之前，仍然有一段很長的路要走。例如，副總（VP）在產品項目啟動之初不是一個重要的角色，地位甚至於不能和CTO相提並論，或者說VP對於市場也是如此，但隨著項目不斷開展或市場逐漸擴大，VP的重要性將會得到體現。現在，多數的企業軟體和早期建設的網站在最初的開發設計時是沒有考慮到企業文化的，只是市場部或者產品營銷人員去搜集一些產品信息或者需求，最後整理出一份方案交給開發製作部門。在建築學中，這樣的流程也只是適合用來做最低級的產品設計和建設方案。

由於網頁設計將會越來越像建築設計一樣，需要用戶體驗進一步發展提高，所以用戶體驗人員將需要成為集技術員與藝術家為一體的人。值得注意的是，設計用戶體驗需要減少集思廣益、訪談、小組討論及調查這樣的行為。建築學中，前期的綱要準備通常是由委託人完成的，設計師很少在設計產品的過程中再去進行調研。用戶體驗人員的角色要圍繞用戶體驗來逐漸豐滿，最後，一個產品人員實際上將會設計整個系統的架構（模式、硬體以及過程中的策略調整，還有產品的實際用途），當然，這些設計是從設計師的角度，而不是工程師的角度。關於這個，我已經琢磨了很多年，但似乎很少有人能聯繫到實際問題，所以這並不是以往的經驗和可能的錯誤。

有人曾講過，如果19世紀最偉大的工程師Brunel現在還活著，他一定會是個優秀的軟體設計師。軟體設計吸引人的地方在於，它會是一個不斷創新的過程，很讓人享受，就比一個富有創造力的工程師生在維多利亞時代一樣。所以，如果人們還沒有準備好像建築師設計建築一樣去設計軟體，那嘗試下用網頁設計的方法去設計建築怎麼樣？其實沒什麼複雜的，只需要做一個簡單的流程圖而已。

設計流程圖

上面的圖片是一個建築設計最終的流程圖。這個流程圖不是關於用戶體驗設計的，但是是受用戶體驗啟發而製作出來的。也不是一個工程圖例——它沒有使用UML或任何複雜的圖表方法。1、因為在整個過程中我沒有將UML納入考慮範圍；2、因為我不喜歡在這種工作中使用UML。UML的工作受制於固定的合理的對象腳本，但用戶看一座房子或者一個客戶端軟體的設計卻鮮有理性考慮，多數都是憑直覺來感受的。所以，你可以在進行的過程中編造大綱，在其中混進一些隱喻，並反覆的使用實例，這樣才能是你的方案在不理性的人那裡獲得通過。

它們有怎樣的不同

網頁設計是線性化的工作，它的整個流程中需要去掉細枝末節不重要的對象，以此來讓用戶通過簡單的操作就能獲得想要的結果。追求的是中間的過程，線性的設計。

反過來，建築設計則是追求空間上的，非線性的設計。因為許多建築師通常會把建築物看成一個模型，例如偉大的建築師Frank Lloyd Wright就把建築物看成是相互關聯的空間，但他們更關注的是這些空間本身，而不是關注鏈接這些空間的流程。這就好比你去觀看一場歌舞表演，你會更加關注舞台設計而不會太在意舞蹈編排本身。我常常想，如果像編排舞蹈一樣去設計一幢建築那將會是怎樣的一番景象啊？如果那樣的話，設計的最後一幅畫面將會是一個人在動態的舞蹈，而不是一個簡單的靜態場景。這就是和網頁設計有異曲同工之妙的追求有流程的設計。

切身體會

前不久，我住過一個酒店，酒店房間的卧室與輿洗室中間有一個走廊式的換衣間。這種安排非常合理，以往我們住酒店的時候，常常會將衣物胡亂丟在卧室的床上甚至地板上，然後再去洗漱，但他們的這個設計，正好讓我們在洗漱之前可以將衣服放在換衣間中。這就讓起床和睡前的整個流程像一段完美演繹的舞蹈，也可以說是一個優秀的網頁，所有你所期望的東西都出現在它應該出現的地方，通過簡單的操作就得到想要的效果了。

為什麼這種設計容易討人歡喜

優秀的設計在完成之後常常是看起來很普通且理所應當的。在網上，最典型的例子就是「靜態連結（permalink）」，在此之前，你很難去記住「紐約日報是如何在網路上發布的」這樣一篇不起眼的網路日誌，所以你沒辦法將它分享給你的朋友。（permalink是一個類似「今日頭條」的鏈接，當今日頭條的內容改變時，鏈接所指向的網址也會改變）

因為大多數房子都需要有走廊和壁櫥，所以為了節省空間，就會忽略設計的重要性，從而這些房子都不會設有像上面那個酒店裡的那種更衣室或者可進入式衣帽間。

所以，按照上面卧室模塊的設計理念來設計房間，通常人們會在這個流程中加上放置洗衣機的地方。比如在英國，房子較小的家庭會將洗衣機放在廚房，而在美國通常會放在地下室，在匈牙利通常情況下會放在浴室里。這三種裡面我最喜歡最後一種，但若是能將美國和匈牙利的模式結合起來，比如，在洗漱間和卧室之間有一個放置洗衣機的地方，例如洗衣通道，那就最好不過了。

設計

總的來說，設計的指導思想是將空間分為積極空間和消極空間，然後根據日常的活動流程來確定如何細分並安排它們。現在的房屋中大多數房間的用途設計都是過時的，比如我們最常見的那些閣樓上的空間，很明顯不是為居住而設置的，而是根據循環利用的工業空間理念而建設的。再比如說，為了獲得更多的生活空間，如同廚房和餐廳被合併到一起一樣，起居室和休息室也逐漸被合併為TV room。這就意味著空間的轉變趨勢很少由活動本身決定的了，而更多的是有活動的類型或者環境的類型所決定。舉例來說，在巴格達，那些以阿拉伯傳統鄉村房屋為原型所建設的房子會根本不同氣候類型被歸類為不同的用途。

帶有積極空間和消極空間屬性的房子會給人帶來完全不同的感覺，消極的空間會帶給人舒適、柔和及曖昧的感覺，而積極的空間則會帶來寬敞、明亮及堅實的感覺。

為了方便大家更為直觀地了解積極空間與消極空間，我找了兩張經過改造的房間的照片，比較簡略，但希望通過這兩張圖片能讓大家能夠理解這兩個概念。從圖中可以看出，消極空間是有立方形的木製品組成，而且窗戶很少。與此形成對比的是積極空間，主體是一個長方形的空間，下方是光亮的地面，頂上有明亮的天窗，中間是一個小型的精緻的餐廳，這讓整體的空間顯得比實際空間要大的多。

積極空間

消極空間

新房型：「製造者」空間

前面所說的關於1號房案例研究流程圖的積極空間、消極空間的概念是比較粗略的，我想，如果能在此基礎上再添加些活動屬性的元素，那一定會更有意思，比如車庫文化。車庫文化遍及美國各個地區，車庫早就脫離了單純存放汽車的角色，演變為許多創意活動的發源地，從樂隊到蘋果公司都能在這裡誕生。我打算把這樣的一個房間放進設計的建築中，緊靠著建築中的主要活動空間（如餐飲區），這樣的話，就會有一個真正的積極空間，在這裡可以玩樂可以做事，我稱之為「製造者」空間。

原先的卧室流程已經被創建成一個模塊，這個模塊可以被重複多次，可以用來連接生活空間（如潮濕的廚房或者輿洗室）。

不是說我有多厲害，但是你看，最終的結果僅僅就是一個簡單的流程圖，而且完全稱不上是一個完整的設計。但它是一個費了心血的最合適的流程圖，對於網路應用來說它可以說是一個優秀的設計。