文章深入探討了Jesse James Garrett在2007年提出的用戶體驗五要素方法論，這是一種從戰(zhàn)略、范圍、結構、框架到表現(xiàn)的自下而上的建設用戶體驗的系統(tǒng)性方法。這種方法論因其普適性和實戰(zhàn)指導性，在產(chǎn)品體驗設計中被廣泛采用。文章詳細解釋了每個層面的含義、重要性以及如何應用，旨在提升團隊設計效率、專業(yè)性和影響力。

設計方法論是能夠不斷復用、貼近真理的一般性規(guī)律，幫助分析和解決問題即從經(jīng)驗中總結出科學的規(guī)律，然后把這個規(guī)律用在該條件的具體事項上的過程，學習和應用設計方法論可以提升團隊設計效率和專業(yè)性、以及團隊影響力。

一、什么是用戶體驗要素

Jesse James Garrett在2007年出版了《用戶體驗要素》一書，提出了從5個要素自下而上的建設用戶體驗。五要素分別為：戰(zhàn)略、范圍、結構、框架、表現(xiàn)。

• 戰(zhàn)略層關注的問題是為什么做？—— “我們?yōu)槭裁匆_發(fā)這個產(chǎn)品？”
• 范圍層關注的問題是做什么？——“我們要開發(fā)的是什么？”
• 結構、框架、表現(xiàn)層則需要解決怎么做？——“我們?nèi)绾芜_到上述抽象層面所定義的問題？”

這五個層面提供了一個建設用戶體驗的基本架構，自下而上是一個從抽象到具體的過程。此理論因為其超強的普適性和實戰(zhàn)指導性被廣為流傳為產(chǎn)品體驗設計中經(jīng)典的方法論。

二、用戶體驗要素適用于什么場景？

此理論提供了一種結構化的產(chǎn)品設計思維框架，運用這種思維框架，可以幫助我們從抽象的需求到具體的頁面呈現(xiàn)，循序漸進地完成設計。它適用于各類互聯(lián)網(wǎng)產(chǎn)品設計（網(wǎng)站、APP、H5、小程序等）。

三、怎么使用用戶體驗要素？

1. 戰(zhàn)略層：理解產(chǎn)品目標和用戶需求

成功的用戶體驗，其最核心的基礎，是一個被明確表達的“戰(zhàn)略目標”。知道企業(yè)和用戶雙方對產(chǎn)品的目標和期許，有助于促進各方面戰(zhàn)略的確立和制定。

這一層我們要回答兩個問題：—我們要通過這個產(chǎn)品得到什么？—我們的用戶要通過這個產(chǎn)品得到什么？相對應的，我們就要確定從企業(yè)的產(chǎn)品目標和用戶需求。

（1）產(chǎn)品目標

① 商業(yè)目標：企業(yè)為了達成盈利的目的需要產(chǎn)品滿足的目標，具體的目標和互聯(lián)網(wǎng)產(chǎn)品的盈利模式有關；

例如：應用商店以CPD為主要盈利方式，商業(yè)目標是提升應用下載量；

②?品牌識別：企業(yè)希望向用戶傳達的品牌形象和調(diào)性。一方面，是較為淺層的視覺設計，即：商標、色彩和字體設計等；另一方面，更深層的，是用戶在與產(chǎn)品交互時，（有意或無意）刻印在用戶腦海中關于企業(yè)的品牌形象。

例如：提起海底撈就能想到他們無微不至的服務體驗。

③?成功標準：為了衡量產(chǎn)品目標是否實現(xiàn)，需要設立一些成功標準。標準可以通過定量的量化數(shù)據(jù)反饋進行衡量，也可以通過用戶調(diào)研產(chǎn)生的定性結論來進行衡量。

例如：通過頁面訪問埋點來衡量用戶活躍是否達到目標；通過用戶訪談了解用戶對品牌的印象。

（2）用戶需求

① 用戶細分：

首先要明確需要解決哪一類用戶的需求，常用的方法包括根據(jù)人口統(tǒng)計學特征、用戶行為、用戶生命周期等方式區(qū)分用戶，目前行業(yè)內(nèi)也有成熟的方法論和運營工具，在此就不詳細闡述。

② 用戶研究：

通過一定的用戶研究方法了解用戶的心理、行為特征和習慣，有助于我們設計更加符合用戶心智的產(chǎn)品。常用的用戶研究方法包括問卷調(diào)查、用戶訪談、焦點小組、可用性測試等，此處也不對方法內(nèi)容做過多詳細的介紹，感興趣的可以閱讀推薦書籍《設計調(diào)研》。

③ 用戶畫像：

給目標用戶群提供一個典型的人物側寫，幫助我們歸納目標用戶的行為習慣、心理動機、需求和痛點。它可以幫助我們在產(chǎn)品設計過程中，時刻提醒我們的目標用戶是誰，杜絕把自己代入為用戶。用戶畫像的內(nèi)容一般是基于定性和定量研究總結得出的，不是我們憑空想象的，具體的用戶畫像建立方法在此也不做過多介紹。

2. 范圍層：明確產(chǎn)品的功能和內(nèi)容

當把產(chǎn)品目標和用戶需求轉變?yōu)楫a(chǎn)品應該提供給用戶什么樣的功能或內(nèi)容時，戰(zhàn)略就變成了范圍。它本質(zhì)上就是把虛無縹緲的需求，變成踏實可見的功能。在范圍層中，需要輸出功能規(guī)格和內(nèi)容需求。

（1）功能規(guī)格：指的是產(chǎn)品所包含的功能和流程，在日常工作中通常是以需求文檔的形式呈現(xiàn)。

（2）內(nèi)容需求：指的是產(chǎn)品內(nèi)需要運營支持的內(nèi)容信息。比如新聞類產(chǎn)品，哪怕設計好了這款產(chǎn)品的全部功能，它的核心還是供用戶閱讀的新聞內(nèi)容，這些新聞內(nèi)容不是設計師能設計出來的。

3. 結構層：設計用戶行為和內(nèi)容信息架構

（1）交互設計

書里提到的交互設計和目前的互聯(lián)網(wǎng)交互設計概念有很大的不同。作者認為交互設計應該重點關注用戶的行為，即系統(tǒng)如何配合與相應用戶的行為，主要考慮跳轉邏輯和任務流程。（在如今的互聯(lián)網(wǎng)行業(yè)，交互設計的概念則范圍更廣，包括任務流程、信息架構和界面設計等）

示例：vivo錢包中的解鎖流程

（2）信息架構

信息架構考慮的是內(nèi)容的分類組織方式，讓用戶能夠高效、有效地游覽內(nèi)容。常用的結構類型有：①?樹形結構（層級結構）：最常見的結構，每個節(jié)點都有父節(jié)點，層層嵌套。

例如vivo的“設置頁”就是一處節(jié)點，通過它可以打開下一層級的“聲音”、“顯示”、“通知”等新節(jié)點，這樣層層嵌套

②?矩陣結構：這種結構的優(yōu)勢是可以讓帶著不同需求的用戶各自找到他們想要的東西。

例如某點評網(wǎng)站的分類導航，它在同一層級里采用了多種不同的分類方式，用戶通過不同的選擇方式，都可以通往他想要的店鋪

③?線性結構：線性結構的特點是每一步都只有一個出口和一個入口，用戶在當前頁面要么返回，要么進行下一步。

示例：vivo錢包借款流程

4. 框架層：界面元素、導航、信息設計

框架層是產(chǎn)品設計真正開始變得具體的一個層面，有以下三方面需要注意：

（1）界面設計

界面設計提供給用戶做某些事的能力，讓用戶接觸到具體功能。書中提到的“界面設計”特指選擇正確的界面元素（控件/組件），并對界面元素進行合適的位置布局，讓用戶容易理解和接受，從而幫助他完成任務。是“以任務為導向”的功能型產(chǎn)品需要重點關注的部分。

互聯(lián)網(wǎng)設計發(fā)展到現(xiàn)在，已經(jīng)有各種成熟的設計規(guī)范可以參考，設計師需要掌握的基本專業(yè)能力就是對各類型平臺的設計規(guī)范有一定的了解，并且能熟練運用合適的設計模式來解決實際用戶場景的問題。

示例：vivo部分組件

（2）導航設計

導航設計提供給用戶去某個地方的能力，在互聯(lián)網(wǎng)產(chǎn)品中用戶容易“迷路”，通過導航設計，來彌補用戶缺失的空間感，營造“位置”的感覺。是“以信息為導向”的信息型產(chǎn)品需要重點關注的部分。

依托于不同的載體，導航也有不同的方式。例如在網(wǎng)站上，常用的導航方式包括“導航菜單”、“下拉菜單”、“面包屑”、“固釘“、“分頁”等。在移動端上，常用的導航包括“底部標簽欄”、“側邊抽屜”、“標簽頁”、“列表”、“宮格”等?????

vivo官網(wǎng)導航和官網(wǎng)、游戲中心、商店、錢包導航示例

（3）信息設計

信息設計是指提供呈現(xiàn)信息的方法，使用戶更容易使用和理解。信息設計跨越了功能型產(chǎn)品和信息型產(chǎn)品的邊界，業(yè)務無論是界面設計還是導航設計，都需要良好的信息設計的支持。它包括兩個關鍵點：“信息排序”和“分類整理”。

每個界面上呈現(xiàn)的信息都有重要程度上的排序，優(yōu)先展示重要的信息，把不重要的信息隱藏起來。將同類信息進行歸類，把相關性強的信息放在一起體現(xiàn)他們的關聯(lián)性，這些都是我們常用的信息整理方法。

信息經(jīng)過整理重組以更加直觀符合認知的方式呈現(xiàn)給用戶。

5. 表現(xiàn)層：創(chuàng)造感知體驗

表現(xiàn)層要做的是將框架層得到的邏輯排布進行感知呈現(xiàn)。在這一層，內(nèi)容、功能和美學匯集到一起來產(chǎn)生一個最終設計，完成其他四個層面的所有目標，并同時滿足用戶的感官感受。

（1）忠于眼睛

用戶在使用產(chǎn)品時的視線移動是評估視覺設計的好方法。即使沒有精密的眼球追蹤儀器，也可以通過和用戶交流來詢問他們的視線移動。如果一個設計是成功的，那么用戶眼睛的移動軌跡的模式應該有以下兩個重要特點：①遵循一條流暢的路徑；② 為用戶提供有效的引導。

（2）對比和一致性

對比可以突出事物并吸引用戶注意力。對比要足夠徹底，讓差異足夠明顯，以免用戶困惑一致性能使設計有效地傳遞信息，而不會導致用戶的迷惑和焦慮，包括內(nèi)部一致性和外部一致性。內(nèi)部一致性是指一個產(chǎn)品本身應該保持一致，對于那些在產(chǎn)品中反復出現(xiàn)的設計元素，應該只做一次設計，然后在不同的環(huán)境中應用它們，在有需要的時候進行一些調(diào)整。外部一致性是指產(chǎn)品與同企業(yè)下的其他產(chǎn)品保持一致性，這有助于傳達一種統(tǒng)一的品牌識別形象。企業(yè)通常應該有專屬的設計規(guī)范，根據(jù)統(tǒng)一的規(guī)范設計產(chǎn)品可以保證一致性。

（3）配色和排版

色彩可能是向外界傳遞品牌識別的一個最有效的方法。核心的品牌色彩通常是一個更廣泛的配色方案的一部分。在顏色選用上，仍然要注意對比和一致性。排版會影響信息傳達，也會影響視覺效果。應要遵循格式塔原則，可以幫助我們設計出信息傳達效率高的排版布局。

四、總結