頭條楓林網
文章摘要： 互動設計要遵循使用者的預設習慣導航設計要做的就是讓使用者在使用產品的時候有位置感
《使用者體驗要素》是一本講產品的好書，作者為我們清晰地介紹了關於使用者體驗的五個要素，五個要素是按照產品的整個生命過程來描述的。
產品設計五要素分別是： 戰略層、範圍層、結構層、框架層、表現層。
《使用者體驗要素》
說這本書清晰，是因為五個要素很清楚，按邏輯步驟總結出來的。但，這也是這本書唯一清晰的地方了，因為，這本書在細節描述上還是很凌亂的。
產品設計五要素
對於讀這本書而言，能夠領會作者的思想就可以，不必要拘泥於具體的細節。原因有二：一是，這本書的細節描述並不是那麼清楚，也不是那麼條例；二是，要講產品生命中的所有細節，也不是這一本小冊子可以描述清楚的，而且更多地需要實踐積累。
本文將用一張簡潔、明瞭的流程圖，配上接地氣的文字，對書本的內容做一個梳理，通過總結，來讓我們更好地領會思想。
首先上圖：
一張圖讀懂《產品設計要素》
首先，在做一款產品之前，我們先嚐試著問自己幾個問題，問題分為以下3類：
（1）為什麼做？
我們要做的產品是幹什麼的，為使用者解決什麼問題？我們做的產品以後怎麼賺錢，或者不賺錢，我們總得得到什麼好處吧？
（2）做什麼？
我們的產品要有哪些功能？
（3）怎麼做？
我們的產品具體做成什麼樣子？
好了，《使用者體驗要素》的作者就是來回答產品過程中的這3個問題的。按照流程圖，我們往下走。
1
戰略層
就像毛主席說的，主義譬如一面旗幟。柳傳志也說過，自己的領導力三要素就是：搭班子定戰略帶隊伍。足可以看出戰略思想的重要性。
整個產品週期很長，先定個戰略，有規劃，有指導思想，才能夠好好做產品。比如，我們做產品總得定一個小目標吧？
（1）商業目標：比方說，先賺它一個億。再比如，我們先幹一年，目標積累100萬用戶（也好拉投資嘛對吧）。這就是我們的商業目標。
（2）使用者需求：比方說，我們覺得有的使用者打車困難，有的使用者的汽車總是自己一個人開，浪費空間，所以我們想來個共享經濟，做個滴滴，讓沒車的使用者可以方便地坐有車的使用者的車。這就是我們的使用者需求。
使用者需求需要好好挖掘，可以通過問卷調查、訪談等各種方式挖掘使用者的核心需求。爲了避免我們的做法與使用者需求有偏離，我們可以對使用者進行分類，把典型的使用者種類劃分製作成使用者畫像Personal，甚至，我們可以把使用者畫像列印出來掛在牆上，以後做決定的時候時刻想著他們的需求，這樣就不至於我們做出太過於偏離使用者需求的決定。
商業需求是公司內部需求，使用者需求是公司外在需求，它們共同組成戰略層的核心內容。
2
範圍層
在上一步，我們把戰略定好了，目標很美好，要麼幾百萬使用者，要麼一年賺幾個億，那麼，接下來是不是就該想想怎麼做了呢。
我們的產品要有哪些功能？接著上面做滴滴打車的例子，我們要讓使用者能夠提出出發地和目的地，就能夠找到車，對不對？我們要讓司機能夠輕鬆地找到乘客對不對？我們要給他們提供便利的支付方式對不對？我們要讓乘客和司機能夠通過聯繫方式交流對不對？我們要能夠動態地、實時地把最合適的乘客推薦給最合適的司機對不對？
上面描述了我們想做的產品功能，這就是範圍層要考慮的，哪些功能要做，哪些功能不要做，哪些先做，哪些後做，寫下來之後就變成需求文件了，以後開發的排期、優先順序、做不做某個功能的時候產生糾結，都可以把之前寫下來的需求文件搬出來。
在前面的戰略層，解決的是為什麼做的問題，在範圍層，解決的是做什麼的問題。那麼，接下來結構層、框架層、表現層，都是解決怎麼做的問題的。只是由抽象到具體，由框架到細節，步步推進的。
3
結構層
在結構層，要考慮兩個問題：「互動設計」和「資訊架構」。
（1）互動設計指的是針對使用者的操作，產品要怎麼反應來配合使用者操作。
在這裏有一個「概念模型」的概念，比如，我們做電商，有購物車，購物車的概念模型可以是現實中的購物推車，那麼它就有往裏面放東西、從裏面移除東西等功能，那麼在電商平臺設計購物車的功能的時候，就可以對應著來考慮與使用者的互動方式了。
尤其需要注意的一點，我們設計的互動方式不要與使用者預設的思維習慣相背離，比如，在使用者的腦海裏，預設瀏覽器右側的ScrollBar是用來上下滑動頁面的，而你的產品把它設計為拉動ScrollBar以放大、縮小字型，這就會讓使用者很難接受，因為這與他們的腦海中的習慣不相符。
scrollbar
再比如，在移動裝置上，我們習慣於通過點選來放大、縮小圖片，習慣於通過手指上下滑動來瀏覽長圖。而微部落格戶端Weico曾經推出一個版本，修改了這一使用者行為習慣，使得使用者很容易進行誤操作。理所當然地，在後來的版本中，Weico也將操作方式改回了大家習慣的方式。
weico
儘管我們說，互動設計要遵循使用者的預設習慣。如果我們對使用者的行為習慣有了深刻的研究，以至於我們認為我們比使用者更瞭解自己，我們設計的操作方式是最適合使用者的。那麼我們可以嘗試推廣自己的互動設計方式，慢慢培養使用者習慣。當然，這是需要時間和代價的。
（2）資訊架構是指資訊的組織方式。
我們的產品肯定有很多內容，那麼這些內容應該怎麼組織起來，讓使用者覺得好用、易用呢。比如操作資料夾的時候，我們總見過開啟一個檔案，再巢狀另一個資料夾，再巢狀另一個檔案···一下巢狀十來層的資料夾組織方式，令人不厭其煩。在進行資訊架構的時候，我們可以把自己的一個個的產品內容當做一個節點node，然後將這些節點有序的組織起來。具體的結構方式有層級結構、矩陣結構、自然結構、線型結構等，我們可以根據自己的產品特點來進行鍼對性的設計。
4
框架層
經過了上面的結構層，我們可以看到，我們只是對產品的互動方式和內容組織方式進行了一個大概的設計。那麼在框架層，就需要進一步地進行設計了。在框架層，包含：介面設計、導航設計、資訊設計。
（1）介面設計：介面設計要做的就是選擇合適的介面互動控制元件，這些控制元件既能夠讓使用者易於理解其含義，又能夠讓使用者藉助於此來圓滿完成任務。
（2）導航設計：導航設計要做的就是讓使用者在使用產品的時候有位置感，讓使用者知道自己在什麼位置，知道下一步可以到哪裏去，知道上一步怎麼返回，避免讓使用者有云裡霧裏的感覺。具體而言，索引表、網站地圖、導航連結、當前位置導航資訊等，都可以是導航設計的一部分。
（3）資訊設計：資訊設計要做的就是怎麼把各種設計元素粘合在一起，怎麼把它們呈現出來，讓使用者很好地理解和使用它們。
在產品設計中，有一個很重要的概念：線框圖。線框圖可以說是上述的介面設計、導航設計、資訊設計的三者的結合，是產品的雛形和大體形態。需要注意的是，線框圖與產品原型略有差別，原型是對線框圖的更細緻描述的產品體現，原型要求必須有互動，而線框圖則可以是靜態的，沒有互動也可以。
線框圖
5
表現層
表現層是使用者真真切切地可以感受到的產品外在。這是離使用者最近的。在這一層，可以通過設計產品的配色方案、排版、對比、風格統一，充分研究和使用使用者的感知方式（嗅覺、味覺、觸覺、視覺、聽覺等），將產品的風格完整呈獻給使用者。
作者： 贊德
猜
你喜歡以下文章
設計師的資訊架構基礎知識
如何幫助使用者防錯-互動設計中的「無意識錯誤」
為增強產品的使用者體驗，UI設計師會做哪些工作？
建立優秀UI的7條準則
關於UPP
UPP是以使用者體驗為核心的設計諮詢服務公司，致力於用標準化的設計服務提高客戶產品的使用者體驗、品牌價值和商業價值。
UPP的模式是與IT軟體服務夥伴共建UED團隊，共享UED成果，共贏未來服務收益，深度服務行業客戶，共同打造和沉澱行業解決方案標準化體系。
