第一次接觸用戶體驗要素這本書還是好幾年前了，當時看這本書還不是很深刻，有些地方甚至看不懂，完全沒有概念.前陣子重新翻看了一下這本書，發現和現在的思考點有了很多共鳴.我結合書上的內容和自己的理解與想法現在把它分享出來～希望能對你有所幫助。

我們整天都在說用戶體驗，設計師要站在用戶的角度思考問題，幫助用戶解決問題，優化產品操作流程及視覺層級的排布，作為設計師我們這么做的目的到底是什么，我們為什么要為了一個體驗細節和產品去討論，去爭執。

因為我們是商業設計師，商業設計師要站在公司的角度去思考問題，我們通過用戶體驗優化主要解決兩個問題，一個是商機，一個是品牌.怎么樣通過設計讓用戶行為路徑變短變效率，直接影響用戶的留存，這個產品的體驗好與不好影響著品牌在用戶心中的印象.之前在做UI設計師的時候一直都沒有思考過關于品牌對于一個設計師關聯到底有多大，移動端上的產品不像很多實體，實體產品主要是依靠它的廣告，實體店，質量，價格，包裝，功能和使用等來給用戶建立品牌形象的.而移動端，主要依靠這個產品的內容，或是一個完整的操作流程的體驗結合線下來體驗的.體驗的好與不好直接會和商機和品牌形象聯系上。

商機：優化操作步驟，提高效率，提高轉換率 例接送機簡表單設計。

品牌：提高用戶對品牌的認知，愉悅的用戶體驗會給用戶留下深刻的品牌印象及信任感。

戰略層：產品的目標方向，想要用戶在產品上做什么事情，帶來的收益是什么。

范圍層：產品整體的功能類別，圍繞著戰略層這個產品都該有哪些功能。

結構層：根據戰略目標以及功能思考產品核心功能應該在哪里出現，以及大致的體驗流程。

框架層：頁面的具體功能擺放，信息布局，整體頁面交互流程。

表現層：頁面最終給用戶呈現的視覺效果。

產品的整體產出到用戶使用，它是通過戰略層，范圍層，結構層，框架層及表現層一步一步實現的.他們之間都有著緊密的關系，如果從戰略層錯了，那整個產品都會失敗，如果是功能與用戶預期的不一樣，不是用戶想要的，相同的也會失敗.所以從第一步開始就至關重要。

戰略層

開始做設計前要先想清楚這兩件事情

怎么樣引導用戶達成用戶目標從而完成公司戰略目標，只有當用戶實現了目標公司才能實現戰略目標。

用戶需求可通過：問卷調查、用戶訪談、焦點小組、市場調查、現場調研等方法來提取核心點。

隨著公司的不斷壯大，它的戰略也會發生改變，戰略可能是一個大戰略會細分到不同的小戰略，他們的目標都是在這個大戰略的基礎上。

范圍層

當把用戶需求和產品目標轉變成產品應該提供給用戶什么樣的內容和功能時，戰略就變成了范圍層。

定義項目范圍包含2個方面，即產品功能和產品內容，功能與內容針對不同類型的產品，有的是2者都重要，有的更重功能，有的更重內容，根據產品戰略，它們的權重是不一樣的。

比如，QQ音樂，簡書，keep等它們更重內容.比如騰訊地圖，支付寶等更重功能。

結構層

有了戰略級目標和產品的核心功能，這時候我們要在結構層里梳理出產品功能的信息框架，按照戰略強相關的功能優先展示，哪個頁面該展示哪些功能，以及展示的順序和大體的流程.交互設計師把控信息架構的合理性，以及前后關系操作起來是否高效。

框架層

我們通過框架層的定義，這時候就可以開始細化頁面的信息框架了.交互設計師在設計交互流程圖的時候會考慮很多的設計點，如何將功能信息有效的組織起來，信息之間的關系如何排布，在當前的場景下應該使用什么樣的交互控件，功能樣式統一性，用戶使用起來是否方便，前后之間的邏輯等問題，交互流程圖是需要反復思考和驗證的。

表現層

到了表現層，UI設計師會根據產品的戰略，功能，以及內容，根據市場的調研分析，使用人群等來判斷這塊產品從視覺上要傳達給用戶什么樣的設計感覺出來，比如專業的，親民接地氣的，高大上的，二次元的等視覺表現形式.在設計當中利用顏色及空間劃分視覺層級，通過不同平臺思考設計表現形式，梳理控件樣式形成規范性及統一性.整體視覺樣式盡量做減法，讓用戶輕松看到核心內容以及核心操作。

我們來舉個例子，當然這個只是一個大致的樣子，實際上一個產品從無到有遠比這個要復雜的多，每一層要素都會拆解出不同的點來具體分析具體應用，都會有專業的團隊去應用分析.下面幾步只是一個示意，大家看一下就好。

滴滴專車案例

這個很有意思，前一陣子看了阿里的一片文章，17年設計師發展趨勢，不去定義UI，或是UE設計師，而是叫UXD。其實我們在互聯網公司，很多時候已經區分不出UI和UE了，我們都是在做設計體驗提升的事情，視覺要參與到交互，交互也要參與到視覺，只是大家會有一個偏重，討論的內容也都是如何優化設計，優化流程，所以設計師不該只給自己定義到一個只會畫圖或是畫線框圖的角色，要擴充橫向的維度，才會更加專業。

阿里那篇文章：《2017年設計師該如何轉型？來看阿里UED掌門人的演講！》

歡迎關注滴滴創意設計中心：

「設計師讀書筆記系列」

1. 《設計師讀書筆記連載系列之<簡約至上>》
2. 《設計師讀書筆記連載系列之<Don’t Make Me Think>》
3. 《設計師讀書筆記連載系列之<設計師要懂心理學>》
4. 《取其精華！設計師讀書筆記系列之<ABOUT FACE 3交互設計精髓>》
5. 《取其精華！設計師讀書筆記連載系列之《設計中的設計》》

【優設網 原創文章 投稿郵箱：yuan@uisdc.com】

================明星欄目推薦================

優優教程網： UiiiUiii.com 是優設旗下優質中文教程網站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎設計愛好者也準備了貼心的知識樹專欄。開啟免費自學新篇章，按照我們的專欄一步步學習，一定可以迅速上手并制作出酷炫的視覺效果。

設計導航：國內人氣最高的設計網址導航，設計師必備：http://hao.uisdc.com