來源：xidea的咖啡館

在《寫給產品經理和設計師的用戶體驗知識1》中，我們討論了「用戶體驗」和「設計」的定義，明確的反對「設計原教旨主義」，以及討論了兩個最底層的設計原則，分別是符合用戶使用需求原則和基于用戶的心理模型設計原則。

在《寫給產品經理和設計師的用戶體驗知識2》中，我們繼續討論了一致性原則和及時有效的反饋和解釋原則。

現在，讓我們來繼續討論設計原則吧。

原則5：形式追隨功能

在互聯網行業，很多設計師最討厭的事情就是別人叫他“美工”。如果你去BAT或者其他稍微大一點兒的互聯網公司的招聘網站上翻一翻，你會發現他們很少會招“美工”這樣的職位，即便有，大部分也都是類似“客服部”、“行政部”之類不做產品的部門。主流的互聯網公司早已達成一致，就是互聯網產品的“設計”，遠遠不是“美”那么簡單。即便單說“美”這個維度，也要美得有意義，絕不僅僅是所謂的“有創意”、“有視覺沖擊力”這個層面上。

“形式追隨功能”這個原則，或許就是“美工”與“設計師”的分水嶺之一。這個原則最初由建筑設計師提出，在互聯網行業，我將其解釋為：對于一個產品來說，形式上的、視覺上的、起裝飾作用的東西，應該是為功能和用戶場景服務的。

很多人總是習慣性的將“設計”與“藝術”聯系在一起，但我認為，能夠與“藝術”聯系在一起的，大部分是狹義的，針對表現層的設計。而我所理解的大部分設計，是跟藝術完全不同的。簡單說，藝術是給人“看”的，給人“感受”的；而設計是給人“用”的，幫助人類解決問題的。所以這兩者最初的出發點就是不一樣的。形式追隨功能這個原則也一直在提醒我，時刻記住兩者的區別。

既然是建筑大師提出的觀點，那我們就先來看看建筑方面案例吧。首先必須承認的是，有時候在功能之外，需要有點兒“情懷”。所以很多時候一些小的“設計”如果能夠讓用戶身心愉悅，會心一笑，即便它沒什么用，也是不錯的。

在紐約地鐵的某個車站，有一個很長的通道，據說每天會有很多上班族行色匆匆的路過。在這條通道上，每隔一段距離，如果你抬頭看，就會有一句話，就像下面這張圖：

而這些句子連起來，居然是一首詩：

Overworked.

So Tired.

If Late

Get Fired.

Why Bother?

Why the Pain?

Just Go Home.

Do It Again.

這東西看起來好像沒什么“功能”，但是很有趣，可以讓人會心一笑。這是好的設計，或者換句話說，能夠讓用戶身心愉悅，也是一種“功能”。

但是有的建筑，過度追求形式，不但對“功能”沒什么幫助，還會引起用戶反感。2012年，美國有線電視新聞（CNN）旗下的生活旅游網站評選出了全球最丑的十大建筑，中國沈陽的一棟叫做“方圓大廈”的建筑榜上有名。我看到這則新聞的時候，馬上去搜索了一下方圓大廈的圖片，結果... 僅個人感覺，的確，丑...

后來我還簡單搜索過相關資料，試圖去了解這樣的設計是不是有什么功能上的好處。但是沒找到有說服力的資料。如果既沒有功能上的好處，又讓人覺得丑的話，那這樣的“形式創新”就真的是一種失敗的設計了。

對于互聯網產品來說，也是一樣的。下圖是國內某銀行信用卡app的主界面：

這個手機app內部有很多不同的功能，從賬戶查詢、還款操作，到辦卡申請、開卡、分期，再到商城、優惠信息、積分兌換等等。但是該app的主界面上的大部分面積，被一朵我個人認為并不漂亮的“花”占據... 這個形狀本身其實并沒有特別大的意義，但是卻占用了大量的空間，以至于想推活動的時候，經常需要給用戶彈下面這樣的浮層，不但會阻斷用戶操作，引起用戶反感，而且一次只能推一個活動：

其實，何必追求這樣華而不實的形式呢？我們來看另外一家銀行的app吧：

上圖是招商銀行的兩個app。招行貌似將用戶場景分成了兩類，對應的是兩個不同的app。

左側的名叫“招商銀行”，以功能為主，是與銀行賬戶強綁定的，提供的功能主要是各種銀行服務，例如賬戶查詢、轉賬、理財等。這個app里面大部分信息的組織形式是嚴謹、簡潔的列表形式，用戶可以比較方便的找到所需功能，操作也會比較順暢（除了一部分內嵌wap形式的功能比較亂，其他還是挺順暢的）。

而右側的app叫“掌上生活”，以運營為主，會提供招行體系下包括信用卡、借記卡在內可以享受的各種優惠活動信息。其信息組織形式要活潑、生動得多，會出現大量的圖片，會像電商網站一樣將數字（包括人民幣和積分）放大顯示，更加能夠吸引用戶的關注，更加適合沒事兒“逛一逛”的用戶場景。

這兩個app在信息的表現“形式”上區別還挺大，但都是為各自的功能服務的。我認為是銀行里面比較不錯的設計。

再看一個生活中的例子。如果你注意一下城市中的各種路牌、指示牌，你就會發現，所有指示牌上面的文字，都是非常簡明的黑體或者宋體。

上圖：常見的街道上的指示牌，文字大多數是簡明的黑體。

上圖：香港國際機場的指示牌，或許是繁體字筆畫太多，用黑體類的字體會聚成一團，所以在這里中文部分使用了相對簡潔的MingLiU體（類似宋體，筆畫比較細一些），英文部分則是類似于Tahoma之類的字體，跟中文用黑體類的感覺差不多。

這些都是在日常生活中很自然的設計。因為指示牌的核心功能是用于指示地點或者方位的，所以其最底層的要求，就是讓行人（或者機動車駕駛員）能夠很容易的（有時候是距離較遠的時候）看清楚上面的文字。這是典型的形式追隨功能的正面案例。不信，我換一下字體你體會一下：

上圖：將指示牌上的文字字體換成更加“飄逸”的舒體，（我知道... 正常的設計師很少會用這個字體... 我就只是舉個例子而已，別罵我...）其識別度會降低。是不是覺得，不如原來黑體看得清楚？如果距離再遠些，就更加看不清了。（英文部分我就不改了，如果改掉會更加明顯）

繁體中文由于筆畫多，更慘：

以上案例已經能夠很明顯的看出，如果拋棄了功能，單純的去做形式上的“創新”——甚至有時候根本不是創新，而只是“不同”——往往無法做到好的用戶體驗。

原則6：單一任務，漸次呈現

在偉大的首都北京，有一個被戲稱為“世界第九大奇跡”的建筑，這就是傳說中的西直門立交橋。這座橋結構狂復雜，并且據說在每天的不同時段通過，即便是去往相同的方向都有可能有不同的走法。很多北京的出租車司機都不敢說自己能走得明白。

西直門立交橋的主要問題我覺得是產品策劃的問題，或者往大點兒講，是產品戰略（所謂的城市規劃）問題。但是這些都太大了，我只是想用這座橋底下的一個路牌來引出一個小得多的問題。路牌是這樣的：

雖然如果您現在去西直門找，已經找不到這個路牌了，因為已經拆了。但這真不是段子，是真實存在的。如果您把路牌這東西看作UI的話，這個UI的確真實的反應了產品的功能，只是，它包含的信息量太大了。它一次性告訴用戶，要在5個不同的轉彎處選對方向，還不能錯過任何一個。這么大的信息量，在司機開車路過的瞬間，很難記得清楚。或者，即便真的記住了，其實圖上每一個圈對應的實際道路都是不一樣的（雖然圖上看起來一樣），有的是大圈，有的是小圈，有的是上引橋，有的是進入主路，在實際駕駛過程中很難操作準確。

這就說到了我們將要討論的這個原則，叫做“單一任務，漸次呈現”。與之前我們討論過的各種原則相比，這一則更像是一個小tips，是學習過之后馬上就可以當工具直接用的。在一個流程中，我們最好是將整個流程拆分成一個一個的步驟，并且在每個步驟里面引導用戶只做一件事情。

還是拿路牌來說，如果是一系列復雜的轉彎動作，可以考慮將其拆分成幾個步驟，在每一個分支處給用戶單一的引導。例如，在深圳深南大道東行方向，行駛到“深南南海立交橋”時，會首先看到這樣的一個路牌（圖片來自：騰訊街景地圖）：

這個路牌標注還算清晰吧，假設我想去“濱海大道”，我就知道，這里應該從右側上引橋。進入右側車道后，又能夠看到第二個路牌，如下：

又有一個路牌，告訴我濱海大道靠右。于是我靠右直行，即可前往濱海大道方向。當然，這個方案也不是沒有問題，相反，其實問題挺多的。比如，兩個路牌距離比較近，不熟悉路的新手司機有時候反應不過來，來不及變道... 但這已經不是這個原則的討論范疇了。其實由此我們也應該能夠意識到，單一的設計原則往往只能解決或者緩解單一的問題，永遠不要指望有一個公式一樣的東西存在，只要套進去，就搞定。不可能的。（換句話講，如果有一天，設計行業的大部分問題都可以通過簡單的公式解決，那設計師們也就真的變成“美工”了。）

在互聯網和軟件行業，這個原則也有比較多的應用，比如最典型的，就是Windows的“安裝向導”。如果我沒記錯的話，“向導”這種形式在Windows系統最初的應用應該是在Windows95上面。微軟當年將安裝Windows95整個過程切分成一個一個的步驟，將每一步依次呈現給用戶，用戶在安裝過程中，每一步一般只需要做一件事情。例如下面這張截圖，是用來設置用戶信息的：

“向導”的另一個好處是，因為形成了類似流水線的方式，所以對于非關鍵步驟，可以給用戶提供默認設置。這樣，用戶如果不想更改設置，只需要使用“上一步”和“下一步”按鈕，就可以控制流程前進或者后退。向導的大量應用，讓用戶在Windows操作系統上安裝軟件變得特別容易，即便您看不懂路徑設置，看不懂功能模塊選項，甚至即便軟件界面是阿拉伯語，您只要不停點擊下一步按鈕，就能成功安裝了（當然，Mac OS上拖一個圖標就搞定的方式更簡單）。

在手機平臺上，單一任務的設計更加重要，特別是對于比較長的流程來說，因為手機屏幕太小了。比如說著名的Instagram，將發布照片的流程分為3步，分別是：拍攝-調整（濾鏡）-添加說明。

這樣的步驟有利于用戶在每個節點集中精力做好一件事情，以便于優化最終的效果。比如，拍攝環節，用戶集中精力構圖，決定要將哪些被攝主體收入鏡頭；調整環節，用戶對顏色、風格進行細致化的微調，以適應自己的喜好；添加說明環節，則可以聚精會神的編寫文字。每一個環節要進行的操作被嚴格控制，這也有利于降低用戶的認知成本。

原則7：Less is More

不太有經驗的產品經理和設計師比較容易犯的一個錯誤就是，將一大堆功能沒有主次，不分先后的塞進一個容器里面。看起來功能強大，四通八達，但實際上信息組織混亂，功能之間邏輯不清晰，用戶體驗一般不會太好。比如這個：

上圖是某銀行手機客戶端的界面。仔細研究一下，發現它的最底層結構貌似是“手機銀行、金融資訊、直銷銀行、生活商城”這4項（上面第三個界面，是點擊“手機銀行”后出現的，這里同時違反了一致性原則），而這4個TAB中每一個都堆滿了各種入口，并且這些入口里面有的還有非常復雜的三級或者更多級的入口和結構。再仔細研究，發現甚至有一些入口是重復的。

以上這個案例所引出的是一個老生常談的原則，估計很多朋友都聽說過。就是“Less is More”。它最初由建筑大師Ludwig Mies van der Rohe提出，是一種提倡簡單，反對過度裝飾的設計理念。這個原則歷史太悠久，在很多行業中衍生出了很多不同的解釋。在互聯網行業，類似“簡約的設計風格”、“做減法”、“把不必要的內容收起來”、“7加減2原則”等等說法，都或多或少與這個原則有關。

在傳統行業中有很多Less is More的成功案例。比如，1979年，索尼發現大部分用戶對于播放的需求遠遠大于錄音，所以他們去掉了傳統錄音機的錄音功能，甚至去掉了當時認為必不可少的外置揚聲器。然后把剩下的部分做到一個小盒子內，并配以立體聲耳機。這就是風靡全球的Walkman隨身聽。

上圖：就是這貨，當年可是潮人物件。帶這玩意兒上街邊走邊聽，酷斃了

1984年，IBM在鼠標和軌跡球的基礎上，精簡結構，發明了TrackPoint（小紅帽），在移動設備上有效的替代了鼠標的功能，并解決了軌跡球占用空間過大等缺點。現在TrackPoint已經成為了Thinkpad筆記本的標志，并且類似的設計被應用在很多其他品牌的筆記本電腦上。

2007年，蘋果精簡了手機的按鍵，甚至砍掉了傳統的實體鍵盤，推出了iPhone。后面的故事你們都知道了。

Less is More的正面案例太多了，很多朋友都已經能夠很熟悉的應用，所以，其實今天不想跟大家討論這些，而是希望能討論點兒不一樣的。我們從另一個角度切入，就是，看看Less is More是如何被理解錯，用錯的。

Less最初的意思是反對“過度裝飾”，并不是一味的追求所謂的“簡單”。我所理解的Less，是我們要努力降低用戶的認知和操作成本，這才是在互聯網行業Less的本質。

還是某銀行的app，在你點擊一個叫“xx商城”的入口后，或許是在不同的城市，商城提供的商品不同，所以它會先進入一個選擇城市的界面，這個界面是這樣的：

天啊... 把所有支持的城市列了個表。沒有看出任何邏輯順序！太不負責任了吧？請問，深圳在哪兒？杭州呢？南京呢？這樣的設計（或者說，這玩意兒有“設計”嗎？）根本不是Less好不好？是懶！在這個案例中，如果要幫助用戶更加高效的尋找到他需要的城市，我們要做的不是減法，是加法。

比如說，最簡單的，至少排個序吧：

將所有城市按照其首字母A-Z的順序排列，尋找起來會容易很多。如果同步提供快速定位功能（界面右側，類似iPhone的通訊錄）則會更加高效。

如果你繼續思考，可能還會發現其他問題，比如：

• 能否讀取用戶的地理位置信息，然后在這個列表里面給出一個建議選項。例如，發現我目前在深圳，就把深圳作為默認選項（但是我可以修改）。

• 上面那個方案，好像A-Z的方式解決了問題。但是如果用戶不懂英文或者拼音呢？這個還是不work吧？要不要考慮按省份分類？這個app的目標用戶中，完全不懂英文的人占多大比例呢？

回到Less上來。很多時候它會成為產品設計者懶惰和推卸責任的借口。我們在日常工作中很容易遇見這樣的場景，就是對于一個功能，想著想著，想不明白了，產品經理就說：“哎呀算了，簡單點兒做，先只考慮xxx吧。”或者開發就說：“這樣太復雜了，為了這一個功能，整個架構都變復雜了。還是別做這個xxx了吧。”這其實并不是Less。事實上，如果你希望用戶側Less，產品邏輯側和開發側，很多時候就是要More。“做減法”不是單純的“少”，也不是簡單的“砍需求”，相反，是更加深入的思考每一種可能（對于試錯派，也應該是盡量多的試錯，遍歷盡量多的可能性），最后用最合理的方案，讓用戶付出最少的認知成本，達到用戶的目的（以及你的目的）。

另一方面，很多時候你的產品能否足夠Less，是要取決于其他因素的。比如技術因素，比如環境因素。最近在網上流行的一個視頻，就是有力的證據。


視頻上的山東大叔已經要瘋了。開車的時候，需要撥電話，為了保證行車安全使用全語音撥號，這是個非常棒的設計。看起來好像能夠讓司機很簡單的完成需求，夠Less吧？但是從視頻上（以及我看過的該品牌設備的評測文章）看來，這玩意兒的中文語音識別準確度并不高。視頻里面的大叔作為山東人，說山東話至少沒什么錯吧，但是識別情況一塌糊涂。我看過一些評測指出，普通話的識別率其實也不怎么樣。

說白了，這個產品使用的語音識別技術并不成熟。在這樣的技術限制情況下，產品雖然很希望做得Less，但實際上效果并不好。這時候不如More一些，用笨一些麻煩一些但是更可靠一些的方式解決問題，總比不work好。比如說，是否有可能考慮這么幾個方向：

• 3遍語音識別失敗后，引導用戶使用撥號按鍵。

• 擔心開車使用撥號按鍵有危險，能否把這個設備跟多功能方向盤（很多車都有吧）結合？使用方向盤上的按鍵輸入號碼。

• 如果擔心在方向盤上放一個10鍵的數字鍵盤還是有可能會讓司機分心發生危險，那可否放一個單項按鍵？按一下，代表1；按兩下，代表2。如果停止按鍵超過3秒，則系統語音報出剛才輸入的數字，然后等待下一位數字的輸入。這方案聽起來逼格很低吧？但是它足夠穩定，能解決問題啊。

• 再往前走一步。我們真的需要通過輸入電話號碼的方式撥號嗎？事實上除了一些類似預定酒店、預定餐廳之類的臨時性場景外，大部分情況下我們打電話并不使用撥號盤，而是通訊錄。不信請現在回憶一下，你手機通訊錄里面有幾個人的電話號碼是你真正能背下來的？所以輸入號碼撥號這事兒，本身就有偽需求的嫌疑。那如何設計邊開車邊撥號的功能，我沒多想，留給大家去思考吧。

再稍微深入一點點。在這個原則最后我想斗膽討論一下“扁平化”和“擬物化”的問題。這是個最近幾年在UI設計界非常熱門的話題，在各種論壇上就像是“php是最好的語言”一樣經常能吵起來的話題。

首先，明確的反對類似下面的觀點：

1. 擬物化已經過時了！未來是扁平化的世界。

2. 你的這個界面/圖標/banner/海報怎么還沒拍平？太跟不上時代了。

3. 扁平化時代來了，設計是不是誰都能做了？你看這圖標要畫出來多簡單！你看這界面，我用Windows畫圖就能畫。

關于扁平化設計，網上有各種各樣的觀點。我個人比較贊同的是這樣：

• 現在是一個信息爆炸的年代，信息越來越多，越來越雜。所以對于用戶來說，應該把注意力集中在有效的信息本身上面，而不是界面上。扁平化設計將界面弱化，將多余裝飾Less掉，將信息突出，更加能夠適應現在以及未來世界的發展。

• 在iPhone剛剛推出的那個年代，大部分用戶還并不太熟悉這種使用手指操作的設備。擬物化設計因為更加接近于現實生活中的各種物件，所以在當時有利于降低用戶的認知門檻，有利于引導用戶更加“自然”的使用設備。但現在智能設備已經非常普遍，用戶對于“使用手指，通過屏幕來操作設備”這件事情的基本方法已經比較熟悉了，對于現在的大部分用戶，給他一個方框，里面寫兩個字，他就知道這是按鈕，能夠接受點按操作。所以綜合第一點，類似陰影、按下效果等等擬物化元素已經沒必要了。

以上邏輯聽起來都是對的。但是，擬物化有一個重要的好處，就是它更加接近于真實世界，以至于，它更加容易引導用戶獲得“沉浸式體驗”。就僅僅是基于這一點，擬物化設計不但不會死，而且在相當長的一段時間內都會活得很好。比如說：

對于游戲的UI設計，十有八九是擬物化更加合適。理由很簡單，因為游戲是一種需要引導用戶獲得“沉浸式體驗”的東西。一個游戲好不好玩，很大程度上取決于它的“畫面逼真程度”。
對于特定的用戶，例如老年人，他們可能并不是很熟悉計算機或者觸控類設備的操作。所以如果你要設計一個老人手機，或者給老年人使用的電子設備，那就可以考慮回歸擬物化設計。因為這玩意兒更加接近于現實世界，能夠降低這些特定用戶的認知門檻。

上圖：擬物化設計在游戲中依然有著廣泛的應用

至于有人認為扁平化時代的到來意味著不再需要專業設計師，這種觀點簡直懶得討論了。舉個例子，假設你想表達一個“橘子”的形象，最容易的方式，是拍一張橘子的照片，還是只用單色繪制出一個讓人覺得像“橘子”的簡單圖形呢？有沒有想過，你畫出的“橘子”圖形，可能會讓人誤以為是橙子或者檸檬。事實上，扁平化的設計因為細節變少了，所以對設計師的表現力的要求，不但沒有變低，反而是變得更高了。

綜上，我認為雖然從邏輯上，扁平化是一種所謂的“趨勢”。但是人總是很奇怪的，很多時候我們追求的并不僅僅是高效，很多時候我們并不是“理性”的。有人喜歡簡約的宜家風格，就會有人喜歡所謂的歐式復古風格。所以我更加傾向于認為，扁平化和擬物化只是兩種不同的設計風格而已，現在看起來好像是扁平化更加“流行”，事實上流行這事兒，你還真說不準以后會怎樣。我們不應該僅僅為了“趕時髦”而將什么都拍平了。

Less不能流于表面，「設計」也一樣。

《設計原則概覽》部分的結束語

到這里為止，設計原則概覽部分就告于段落了。其實所謂的設計原則遠不止這些，或許就在你閱讀這篇文章的時候，在世界的某個角落中，就又有新的原則被優秀的設計師總結出來。所以要想窮盡這些原則，是不可能的，同時也是沒有必要的。只是在這部分的最后，請容我再嘮叨一遍，一切的原則、方法都只是工具，它們或許在特定的場景下好用，可是當用戶、目標、地點、時間等維度發生變化時，原則說不定就失效了。所以永遠都不要成為一個死扣工具的「設計原教旨主義者」，產品經理和設計師的價值在于其自身，而不是他們手上的工具。

但是，原則寫完了，這個系列的文章還沒有完。之后我會繼續按照文章后面的提綱與大家討論「用戶體驗」，只是之后所討論的部分，可能更多的并不是像設計原則一樣被業界公認的內容，而是會有很多我自己的理解。僅作為一家之言供各位朋友參考。

（待續）