摘要：

軟體的UI是客戶直接體驗軟體的地方，好的使用者體驗可能比追求新技術和追求漂亮設計更加重要，優秀的軟體應該是既有外在美也有內在美的。但大部分使用者是“外貌協會”的，你和使用者說你的軟體如何OO，用了多少種設計模式，客戶是不鳥你的，客戶關注的是使用者體驗！

大綱：

1.什麼是優秀的設計？
2.優秀的設計能節省專案工作量
3.優秀設計從分析需求開始
4.軟體系統不是木桶型的
5.軟體設計的“大道理”
6.規劃系統骨架——架構設計
7.打造系統的底蘊——資料庫設計
8.細節決定成敗——詳細設計
9.使用者感覺好才是真的好——使用者體驗設計
10.持續提升設計水平

本文章是系列文章之一，如果你還沒有看過之前的文章，建議先看完前面的文章再看本篇，這樣效果更好。

9.使用者感覺好才是真的好——使用者體驗設計

9.1 從“餘額寶是吸血鬼”說起——使用者體驗設計的重要性

某人寫了一篇文章，說餘額寶是吸血鬼，要取締餘額寶！

我大吃一驚，決定認真研究一下這篇文章，但愣是沒有看懂！裡面無非是說餘額寶是銀行的吸血鬼，會害死銀行，害死金融市場之類的云云，反正沒有看懂。我就納悶了，我們把錢放到餘額寶，每天賺取幾塊錢，跟你文章說的內容有毛關係？！你銀行收費多，利息低，存取錢麻煩，我幹嘛要將錢放到銀行發黴呢？

這個事件跟使用者體驗設計有關係嗎？我相信你已經有感覺了，請繼續聽我道來。

公司 A 開發的一個軟體一直很好賣，但它的競爭對手公司 B 開發了另外一個更好用的軟體，使用者很喜歡。很快公司 A 的軟體銷量直線下降，為了挽回頹勢，公司 A 請了某人寫一篇文章“恐嚇”使用者，說一大堆使用者看不懂的話，比方說：公司 B 的軟體不面向物件，安全漏洞多，會吃掉記憶體，會損耗CPU等等。你估計使用者看了這篇文章後會怎樣？我估計使用者會多買兩套公司 B 的軟體壓壓驚！

無論是銀行還是餘額寶，都為顧客提供一種資金投資的服務，但餘額寶的使用者體驗比銀行好多了，所以顧客會做出自己的選擇；同理，軟體給使用者的感覺好，能帶來實際價值，使用者自然就會選擇這個軟體，使用者是不會計較你用什麼開發語言、資料庫，還有用了多少種設計模式的。

我們來一個角色扮演，假設你是使用者，你將會花錢買一套軟體，你的購買標準是？

調查，你會選擇怎樣的軟體？

A）你是軟體開發狂熱者，他比較偏好架構設計良好的軟體，他甚至想得到設計文件和程式碼。對於軟體，功能基本能用就可以了，有點錯誤也可以忍受。
B）你是唯美主義者，他要求介面要爽心悅目，功能能用就可以了，操作麻煩一點也沒有關係。
C）你是實用主義者，介面不需要很花俏，關鍵是軟體要容易上手，操作要方便，能高效地幫助他完成日常工作。

我想你應該不會這樣變態選 A 吧？選 A 的話，恭喜你，你確實是軟體開發的狂熱者！

選 B 的朋友有木有呢？你是外貌協會的吧？

選 C 的朋友比較務實了，你會很珍惜你的每一分的血汗錢，軟體需要物有所值，你才願意投資！

9.2 什麼是使用者體驗設計？

先說說什麼是“使用者體驗”？

使用者體驗就是使用者使用軟體時給他的整體感受，而使用者體驗設計就是針對“使用者體驗”的設計。

其實要讓使用者有好的感覺，主要取決於以下三點：

1）軟體能滿足需求；

2）在1）的基礎上，軟體用起來很舒服；

3）軟體的價錢是合理的，當然價錢 越便宜越好，最好是免費的。

我們這裡談的使用者體驗設計，主要是針對第1）、2）點來談的。

如果客戶和我們抱怨軟體不好用，我們首先要檢查的是需求是否滿足了？如果滿足了，那麼至少可能打60分了。在需求滿足的前提下，再進一步提升使用者體驗，就會讓你的分數上升到80分以上。那有沒有機會滿分呢？通常很難的，除非你的軟體是滿足需求、很好用，並且是免費的！

是否滿足需求，解決軟體能不能用的問題；使用者體驗設計是否能更上一層樓，能解決軟體好不好用的問題。

使用者體驗設計，體現了前文提到的“由頂而下”設計思路的體現，見下圖：

圖9.1 由頂而下的設計思路

說明一下：此圖中“規劃介面”這個活動的輸入是”用例/使用者故事“和”業務流程圖“，但其實”業務概念圖“也是需要考慮的，此圖畫出的是主要的先後關係。

對於使用者體驗設計，可能會有人第一反應是美工負責的事情，實際上美工僅僅是其中一部分而已，使用者體驗設計需要考慮以下三方面：

1）整體介面規劃
2）統一介面標準
3）易用性設計

下面分別說明。

9.3 整體介面規劃

有沒有曾經試過客戶向我們抱怨軟體不好用，我們詢問客戶哪裡不好用，客戶一時半刻說不出來；在我們的耐心追問下，客戶終於憋出一兩點不好用的地方來，於是我們馬上進行改進，但客戶仍然說不好用；於是我們再次耐心的追問，客戶又憋出一兩點不好用的地方來……  周而復始，客戶還是覺得不好用！

你覺得問題在哪？你可能要重新檢討介面的整體規劃！

整體介面規劃做的事情就是：規劃軟體需要什麼介面，每個介面能做什麼事情，每個介面之間是怎樣關係等。這是使用者體驗設計的最關鍵、最核心、最重要的一環，這個做好了，基本上使用者體驗設計不會差到哪去，反之無論你在哪些細節上修修補補，很難在根本上改善使用者體驗。

下圖是前面出現過的考勤系統的部署圖：

圖9.2 考勤系統的部署圖

紅色箭頭指向的客戶端是“PC”客戶端，我們要思考這個客戶端的使用者體驗設計，我們要回答兩個問題：

1）什麼角色將會使用這個客戶端；
2）這些角色通過這個客戶端能做什麼事情。

於是我們我們發現，”員工“和”領導“這兩種角色都會使用這個客戶端，他們分別通過這個客戶端能做的事情有：

員工：

1）檢視全部人的請假外出情況
2）提出申請
3）檢視申請進展情況
4）修改申請
5）刪除申請

領導：

1）檢視待審批的申請
2）審批員工的申請

根據上述資訊，我們可以規劃出PC客戶端的介面流：

圖9.3 考勤系統PC客戶端的介面流

小結一下整體介面規劃的做法：

1）要熟悉需求。
2）在架構設計的基礎上找出系統的客戶端有哪些，這些客戶端是指終端使用者會接觸到的機器，一般不需要考慮伺服器端。
3）思考每個客戶端上的使用者有哪些，這些使用者分別在這些客戶端上需要用到什麼功能。
4）畫出每個客戶端軟體的介面流。如果覺得難度有點大，可先針對不同使用者分別畫他們的介面流，然後合併不同使用者的介面流，思考介面的判斷邏輯，使不同使用者進去都能獲得良好的使用者體驗，同時讓程式工作量更小和彈性更好。

通常我們的專案當中是沒有人專門做整體介面規劃的，大部分的情況是程式設計師做出來怎樣就是怎樣的，但程式設計師做出來的介面使用者體驗設計，你懂的……

如果你是程式設計師，請按照上述思路改善的工作！

如果你是專案的管理者，請思考這些工作誰來做更合適？有些公司可能有專職的使用者體驗設計工程師，有些公司木有，那麼你可以考慮讓需求分析師、測試工程師來負責，或者是作為專案經理的你來親自負責。負責這個崗位的同事至少需要具備這樣的一個素養：就是能從使用者的角度來思考問題！如果能同時具備技術功底，能設計出使用者體驗極佳而且開發工作量少的介面整體規劃，這樣就最完美了！

9.3 統一介面標準

統一的介面標準主要包括三方面：形象、文字和行為。

美工負責的事情主要就是形象方面的，包括有：（可能列不全）

1）整體風格：系統需採用一致協調的美術風格，使使用者感覺是在使用同一個系統。如一致的色調、背景、圖片等。
2）圖片、圖示、頁面佈局等方面的設計。
3）文字的樣式、大小、字型等等。
4）介面上控制元件等各種元素的大小、顏色、風格等等。

文字方面主要是指文字的內容，與上述第3）有點不同。

軟體中出現的文字大概分兩類：

1）操作性、提示性文字，如：增加、刪除、確認、取消等操作性文字，還有一些相關的操作提示。
2）專業性、業務性文字，如醫院系統，系統中出現的藥名、病名等專業性文字。

這兩類文字都需要統一併且易於理解，例如我們經常犯的毛病：一個地方叫”新增“，一個地方叫”新增“，一個地方叫”增加“，這樣就很不專業了。

現在說說行為方面要注意的事情:，舉兩個例子你就懂了。

例1：某些軟體增加確認的提示很不明顯，你點了一下”增加“，介面沒啥反應，搞到你多點幾下，後面發現增加了好幾條記錄了。

例2：某些軟體刪除之前沒有提示，結果你一不小心就幹掉資料了。

使用者會在軟體上做很多動作，常見的動作有：檢視某條記錄，檢視某些記錄，增加一條記錄，修改一條記錄，刪除一條記錄，刪除一批記錄等等。類似的動作，軟體應該有合適的、易於使用者理解的並且是一致的響應，這些都是對軟體行為的設計。

9.4 易用性設計

我們分析一下網際網路網站註冊頁面的易用性，以此為例子體驗一下易用性設計。

註冊網站是黏住客戶的第一步，你打算如何設計才能讓更多網友願意註冊呢？下面看看幾個階段的演化：

1）“皇帝女不愁嫁”的階段

很久很久以前（其實也不是很久，10多年前吧），網際網路剛流行的時候，註冊網站是比較麻煩的，要看使用者條款，要填一大堆資訊，還要分幾頁來填，最後一頁還因為網速問題出錯，折騰死你！但當時網際網路網站太少了，你不介意多嘗試幾次的。

2）“忽悠你進來再說”的階段

你只需要填個賬號，輸兩次密碼，使用者條款不需要看，你去打個勾就行了。

3）“簡化到不能再簡化”的階段

現在有些網站，註冊時輸入使用者名稱，但密碼不需要輸兩次，一次就搞定了！希望你沒有輸錯密碼吧，呵呵。

4）“使用者名稱都不需要輸入”的階段

本來以為3）的做法已經是無法再簡化的了，但居然這麼神奇，使用者名稱都不需要輸入，點個按鈕就可以了！沒錯，這就是關聯其他賬號，比方說用QQ賬戶登入、用微信賬號登入等等，如果你現在已經登入QQ，那麼就可以一鍵關聯賬號並登入了！

大家為了爭奪使用者，註冊這事情簡化到令人髮指的程度！

這僅僅是一個例子，系統中需要著重考慮易用性設計的地方還是很多的，例如：

1）首頁。
2）經常被使用的介面，如登入、查詢介面。
3）用來拓展業務的介面，如註冊介面。
4）複雜的編輯介面。
5）帶有運算功能的介面。
6）重要人物會使用的介面，如報表。
……

9.5 技術人員應該怎樣對待使用者體驗設計 N年前，我作為面試官面試一位程式設計師，該程式設計師是來自競爭對手的公司的。我問他為什麼離開原來的公司，他說：原來那個公司程式碼很不規範，很多 If Else，很多 Select Case，每一次遇到需求變化都需要去折騰，這些程式碼已經無法改下去了，我想到更規範的公司工作！ 程式設計師追求進步是好事，但如果我告訴你另外一個讓我們慚愧的事實，你可能不一定願意加入我們公司了。這個讓我們慚愧的事實就是：競爭對手的軟體銷量比我們的軟體高多了，這是因為他們的軟體好用，使用者體驗好！我們的軟體更多是面向軟體工程師，而不是面向終端使用者。 如果這個事實還不足夠讓你震撼，那麼和你的薪金掛鉤，相信就會震撼到你的小心臟了！你的軟體賣的好，你的薪金高，你能獲得高額的提成，你會介意去處理那些If Else嗎？還是喜歡去幹程式結構良好，但使用者體驗很差，軟體賣不出去，工資高不到哪的工作？ 回到本文開始的那個例子，決定客戶是否買軟體的決定因素就是使用者體驗，而不是你的程式如何OO，如何用了多少種設計模式？ 上述文字可能有些極端，並不是鼓勵你只追求使用者體驗設計，而不需要關注軟體的內部結構，而是希望作為技術人員的你，能更多關注一下使用者體驗設計。 9.6 使用者體驗設計小結 架構設計、資料庫設計打造的是軟體“內在美”，詳細設計主要打造“內在美”同時也需要考慮“外在美”，而使用者體驗設計主要就是針對“外在美”的！ 軟體的UI是客戶直接體驗軟體的地方，好的使用者體驗比追求新技術和追求漂亮設計更加重要，優秀的軟體應該是既有外在美也有內在美的。當然我還要囉嗦一句，大部分使用者是外貌協會的，不要企圖用“某軟體是吸血鬼”的說法來恐嚇客戶，讓客戶不買競爭對手的軟體，只買你的軟體噢！

10.持續提升設計水平

這是本系列文章的最後一篇了，軟體設計有無盡的可能性，絕對不是幾篇文章或者是一本書就能幫助你昇仙的，多實踐多嘗試才能幫助你更上一層樓。工作中的設計挑戰可能不豐富，難度不夠，你自己需要為自己多找一些案例來挑戰，多寫程式碼，多做總結，建立你自己的程式碼重用庫。

如果你是公司的管理層，你可能不僅僅考慮的是個人能力提升的問題，而是更多地考慮讓整個公司設計能力提升的問題，可能想到設計流程制度化、設計文件模板化等工作思路。公司領導要更多考慮需求積累、技術積累，打造公司的核心產品線，核心技術等，打造程式碼重用庫、元件庫等等，要達到一定的高度都不是靠爆發的，而是靠長期的積累。積累達到一定的層次，“後人”就可以利用“先人”的智慧達到更高的高度。我們這些現代人可能並不比古代人聰明，我們能幹很多古代人不能幹的事情，是因為我們利用了先祖為我們積累的大量文明成果。

11.後話

我正式出版的一本書《火球——UML大戰需求分析》中提到，我打算將來寫一本《活用UML——軟體設計高手》，一些朋友問到這本書什麼時候出版？

我很不好意思，這本書出版沒有排到日程上，但“軟體設計是怎樣煉成的”這個系列文章其實是此書的濃縮版，我打算將這個系列文章連同其他文章，編進一本軟體研發及管理最佳實踐的書中，此書還沒有最終定名。此書將會覆蓋軟體研發的方方面面 ，目標就是培養厲害的軟體專案經理，讓你裝備周身刀，把把鋒利！

我還會在部落格中為大家陸續分享文章，謝謝你的支援，請繼續捧場！

本文是系列文章的最後一篇，謝謝你的支援！

如果本文對你有幫助，麻煩點一下“推薦”啦，謝謝！

作者：張傳波

創新工場創業課堂（敏捷課程）講師

軟體研發管理資深顧問

CMMI首席專家

《火球——UML大戰需求分析》作者

軟體知識原創基地創辦人