題圖來自：Zoommy.

版權(quán)聲明
本文首發(fā)自微信公眾帳號(hào)：runner2sun汹粤；
無需授權(quán)即可轉(zhuǎn)載射亏，但請(qǐng)自覺保留以上版權(quán)聲明近忙。

讀完《How To Read A Book》之后，發(fā)覺自己的閱讀水平仍處于最低層次－－基礎(chǔ)閱讀智润，作為一名有上進(jìn)心的好青年及舍，當(dāng)然不會(huì)滿足現(xiàn)狀，于是打算提升自己的閱讀水平窟绷，接下來的一段時(shí)間我將嘗試使用書中介紹的方法來閱讀新的書籍锯玛，然后將讀書筆記整理于此。最近在讀的一本是《用戶體驗(yàn)要素》兼蜈。

這是一本什么樣的書攘残？

這是一本非虛構(gòu)的實(shí)用類書籍。

整本書在談?wù)摰氖鞘裁矗?/h1>

這本書主要介紹了用戶體驗(yàn)的重要性为狸、用戶體驗(yàn)的基本架構(gòu)歼郭，以及基本架構(gòu)中涉及的一些基礎(chǔ)概念。

作者是借著怎樣的整體架構(gòu)來發(fā)展他的觀點(diǎn)或陳述他對(duì)這個(gè)主題的理解辐棒？
全書可分為兩個(gè)主要部分：
第一個(gè)主要部分作者主要介紹了用戶體驗(yàn)的概念以及用戶體驗(yàn)的重要性病曾。
第二個(gè)主要部分作者主要介紹了用戶體驗(yàn)的五個(gè)要素以及其涉及的基本概念姊途。

第一個(gè)主要部分

作者通過生活中一些糟糕的體驗(yàn)引出用戶體驗(yàn)的定義：
產(chǎn)品如何與外界發(fā)生聯(lián)系并發(fā)揮作用，也就是人們?nèi)绾巍航佑|』和『使用』它知态。

通過將產(chǎn)品設(shè)計(jì)與用戶體驗(yàn)設(shè)計(jì)進(jìn)行比較推導(dǎo)出用戶體驗(yàn)設(shè)計(jì)要解決的問題：
綜合視覺設(shè)計(jì)與功能設(shè)計(jì)捷兰、頁面布局以及用戶操作流程等其他問題。

介紹了好的用戶體驗(yàn)?zāi)軒淼暮锰帲?/p>

1. 提高客戶忠誠度负敏。
2. 提高轉(zhuǎn)化率贡茅。
3. 提高效率。

提出了以用戶為中心的設(shè)計(jì)（user-centered design）的概念：

創(chuàng)建吸引人的其做、高效的用戶體驗(yàn)的方法顶考。

其設(shè)計(jì)思想是：

在開發(fā)產(chǎn)品的每一個(gè)步驟中，都把用戶列入考慮范圍妖泄。

指出了以用戶為中心的設(shè)計(jì)的好處：

確本匝兀控制決策所造成的全部結(jié)果。

說出了影響用戶體驗(yàn)的另外兩個(gè)因素：

內(nèi)容：要確保產(chǎn)品可以提供用戶需要的『內(nèi)容』蹈胡。
技術(shù)：技術(shù)的發(fā)展會(huì)影響用戶體驗(yàn)渊季。

第二個(gè)主要部分

作者說明了使用用戶體驗(yàn)要素的原因：

將設(shè)計(jì)用戶體驗(yàn)工作進(jìn)行拆分，有利于我們考慮用戶在體驗(yàn)中有可能遇到的麻煩罚渐。

詳細(xì)介紹用戶體驗(yàn)要素：

五要素

五層的建設(shè)順序

自下而上却汉，每一層都由其下層決定。在每一層最好根據(jù)競爭對(duì)手所做的事情荷并、業(yè)界最佳的實(shí)踐成果來做決定合砂。

五層的設(shè)計(jì)節(jié)奏

上一層要在下一層之后結(jié)束。

設(shè)計(jì)節(jié)奏

表現(xiàn)層（感知設(shè)計(jì)）

決定框架層的邏輯排布的視覺呈現(xiàn)方式源织。

什么是好的視覺設(shè)計(jì)翩伪？

1. 第一時(shí)間吸引用戶注意力的元素是否符合產(chǎn)品目標(biāo)和用戶需求？若為肯定回答則是好的設(shè)計(jì)谈息。
2. 首先缘屹，用戶眼睛移動(dòng)的軌跡應(yīng)該是一條流暢的路徑。其次黎茎，簡單囊颅、樸素地為用戶提供有效選擇的当悔、某種可能的“引導(dǎo)”傅瞻。

設(shè)計(jì)工具

1. 對(duì)比（contrast）
   吸引用戶注意，讓用戶知道某個(gè)設(shè)計(jì)選擇是特意要傳達(dá)一些信息的盲憎。

2. 一致性（uniformity）
   使你的設(shè)計(jì)有效地傳達(dá)信息嗅骄，而不會(huì)導(dǎo)致用戶迷惑或焦慮。

3. 基于柵格線（grid-based layout）
   通過使用“母版”來確保設(shè)計(jì)的一致性饼疙。

配色方案和排版
色彩和排版是向外界傳遞品牌識(shí)別十分重要的手段溺森。

框架層（界面設(shè)計(jì) ＋ 導(dǎo)航設(shè)計(jì) ＋ 信息設(shè)計(jì)）

確定產(chǎn)品用什么樣的功能和形式來實(shí)現(xiàn)慕爬。

界面設(shè)計(jì)
界面設(shè)計(jì)要做的全部事情就是選擇正確的界面元素。成功的界面設(shè)計(jì)是那些能讓用戶一眼就看到“最重要的東西”的界面設(shè)計(jì)屏积。

技巧

1. 仔細(xì)考慮界面元素的默認(rèn)值医窿。
2. 最好能夠記錄用戶最后一次選擇的狀態(tài)。

導(dǎo)航設(shè)計(jì)
在每個(gè)頁面上放一些允許用戶瀏覽整個(gè)網(wǎng)站的鏈接炊林。

導(dǎo)航設(shè)計(jì)的目標(biāo)

1. 必須提供給用戶一種在網(wǎng)站間跳轉(zhuǎn)的方法姥卢。
2. 必須傳達(dá)出這些元素和它們所包含內(nèi)容之間的關(guān)系。
3. 必須傳達(dá)出它的內(nèi)容和用戶當(dāng)前瀏覽頁面之間的關(guān)系渣聚。

常見導(dǎo)航系統(tǒng)

1. 全局導(dǎo)航（global navigation）
   放置能到網(wǎng)站所有主要欄目到鏈接独榴。
2. 局部導(dǎo)航（local navigation）
   提供給用戶在這個(gè)架構(gòu)中到“附近地點(diǎn)”的通路。
3. 輔助導(dǎo)航（supplementary navigation）
   提供給用戶到達(dá)相關(guān)內(nèi)容的通路奕枝。
4. 上下文導(dǎo)航（contextual navigation）
   帶鏈接的內(nèi)容棺榔，可以理解為 a 標(biāo)簽。
5. 友好導(dǎo)航（courtesy navigation）
   放置一些公共信息的導(dǎo)航隘道，比如：聯(lián)系信息症歇、反饋、法律聲明谭梗。
6. 遠(yuǎn)程導(dǎo)航（remote navigation）
   類似于幫助文檔
7. 網(wǎng)站地圖（site map）
   提供給用戶一個(gè)網(wǎng)站整體結(jié)構(gòu)的快捷瀏覽方式当船。
8. 索引表（index）
   按字母順序排列的、鏈接到相關(guān)頁面的列表默辨。

信息設(shè)計(jì)
在視覺上選擇更好的信息展示方式以及整理散亂的信息德频。

指示標(biāo)識(shí)（wayfinding）
幫助用戶理解“他們?cè)谀摹币约啊八麄兡苋ツ摹钡南到y(tǒng)。

線框圖（wire frame）
用來整合界面設(shè)計(jì)缩幸、導(dǎo)航設(shè)計(jì)和信息設(shè)計(jì)壹置。

結(jié)構(gòu)層（交互設(shè)計(jì) ＋ 信息架構(gòu)）

為產(chǎn)品創(chuàng)建一個(gè)概念結(jié)構(gòu)。

交互設(shè)計(jì)

關(guān)注于描述“可能的用戶行為”表谊，同時(shí)定義“系統(tǒng)如何配合與響應(yīng)”這些用戶行為钞护。

概念模型

用戶對(duì)于“交互組件將怎樣工作”的觀點(diǎn)。

作用：
規(guī)劃好概念模型有助于做出一致性的設(shè)計(jì)決定爆办。將某個(gè)特性處理成用戶所熟悉的某個(gè)概念难咕，有助于用戶更好的理解該特性，降低用戶的學(xué)習(xí)成本距辆。比如電商網(wǎng)站中的購物車的概念模型來自現(xiàn)實(shí)生活中的購物車余佃。

注意：擬物的概念模型對(duì)系統(tǒng)設(shè)計(jì)會(huì)有一定的價(jià)值，但切記全面擬物跨算，要權(quán)衡功能性爆土。

錯(cuò)誤處理

如何處理用戶的錯(cuò)誤以及如何防止用戶繼續(xù)犯錯(cuò)。

方式：

1. 設(shè)計(jì)成不可能犯錯(cuò)的產(chǎn)品诸蚕。比如自動(dòng)檔汽車在發(fā)動(dòng)時(shí)必須要掛在P檔步势。
2. 在錯(cuò)誤發(fā)生時(shí)提供錯(cuò)誤信息和幫助用戶從錯(cuò)誤中恢復(fù)的方式氧猬。

信息架構(gòu)

研究人們?nèi)绾握J(rèn)知信息的過程，對(duì)于產(chǎn)品而言則關(guān)注呈現(xiàn)給用戶的信息是否合理并具有意義坏瘩。

對(duì)于以內(nèi)容為主的網(wǎng)站盅抚，信息架構(gòu)主要負(fù)責(zé)設(shè)計(jì)組織分類和導(dǎo)航的結(jié)構(gòu)。

結(jié)構(gòu)化內(nèi)容
建立分類體系的方式：

1. 從上到下（top-down approach）
   根據(jù)產(chǎn)品目標(biāo)與用戶需求直接進(jìn)行結(jié)構(gòu)設(shè)計(jì)倔矾，先從最廣泛的泉哈、有可能滿足決策目標(biāo)的內(nèi)容與功能開始進(jìn)行分類，然后再依據(jù)邏輯細(xì)分出次級(jí)分類破讨。

2. 從下到上（bottom-up approach）
   把已有內(nèi)容先放到最低級(jí)別的分類中丛晦，然后再將它們分別歸屬到較高一級(jí)的類別，從而逐漸構(gòu)建出能反映我們的產(chǎn)品目標(biāo)和用戶需求的結(jié)構(gòu)提陶。

結(jié)構(gòu)方法
基本單位－－節(jié)點(diǎn)烫沙，可對(duì)應(yīng)任何信息片段或組合。
種類：

1. 層級(jí)結(jié)構(gòu)（hierarchical structure）
   節(jié)點(diǎn)與其他相關(guān)節(jié)點(diǎn)之間存在父級(jí)／子級(jí)的關(guān)系隙笆。

2. 矩陣結(jié)構(gòu)（matrix structure）
   允許用戶在節(jié)點(diǎn)與節(jié)點(diǎn)之間沿著兩個(gè)或更多的“維度”移動(dòng)锌蓄。

3. 自然結(jié)構(gòu)（organic structures）
   不會(huì)遵循任何一致的模式。節(jié)點(diǎn)是逐一連接起來的撑柔，沒有太強(qiáng)烈的“分類”概念瘸爽。

4. 線性結(jié)構(gòu)（sequential structures）

組織原則

決定哪些節(jié)點(diǎn)要編成一組，而哪些節(jié)點(diǎn)要保持獨(dú)立的標(biāo)準(zhǔn)铅忿。

語言和元數(shù)據(jù)

命名原則

描述剪决、標(biāo)簽，和網(wǎng)站使用的其它術(shù)語檀训。（要使用用戶的語言并且保持一致）

元數(shù)據(jù)

關(guān)于信息的信息柑潦，以一種結(jié)構(gòu)化的方式來描述內(nèi)容的信息。

范圍層（功能規(guī)格 ＋ 內(nèi)容需求）

該層不僅可以讓我們確定我們項(xiàng)目的目標(biāo)以及何時(shí)能達(dá)到這個(gè)目標(biāo)峻凫，還可以幫助我們鎖定需求渗鬼，規(guī)劃好版本確保項(xiàng)目如期上線。
功能規(guī)格

定義產(chǎn)品的“功能”以及相應(yīng)的組合荧琼。

內(nèi)容需求

定義產(chǎn)品需要顯示的內(nèi)容譬胎。

需求的分類

1. 適用于整個(gè)產(chǎn)品的需求，如品牌需求命锄，技術(shù)需求堰乔。
2. 適用于特殊特性的需求，產(chǎn)品必須擁有的累舷、某種特性的一句簡短描述浩考。

定義需求
定義需求過程中的三類需求：

1. 從用戶講述他們想要的特性中得出的需求。
2. 從用戶講述他們想要的但實(shí)際上并不能解決他們問題的特性中得出的真正需求被盈。
3. 從人們不確定他是否需要的特性中得出的需求析孽。

我們可以通過以下幾種方式明確需求：

1. 讓不同崗位的同事一起參與產(chǎn)品討論，可以讓我們獲得對(duì)產(chǎn)品的更多視角只怎。
2. 研究產(chǎn)品需求時(shí)必須考慮到硬件需求袜瞬，因?yàn)橛布枨髸?huì)限制產(chǎn)品的功能可能性。
3. 將人物模型放到一個(gè)具體的場景中身堡，可以幫助我們明確潛在需求邓尤。
4. 從競爭對(duì)手的產(chǎn)品中獲得需求提示。
5. 從其他產(chǎn)品中發(fā)掘可能的潛在需求贴谎。

功能規(guī)格說明

定義

只包含在設(shè)計(jì)或開發(fā)過程中出現(xiàn)有可能混淆的功能定義汞扎，只記錄在創(chuàng)建這個(gè)產(chǎn)品時(shí)已經(jīng)確定下來的決議，且必須可驗(yàn)證擅这。

規(guī)則

1. 樂觀（be positive）
   描述這個(gè)系統(tǒng)將要做什么事情去“防止”不好的事情發(fā)生澈魄，而不是描述這個(gè)系統(tǒng)“不應(yīng)該”做什么不好的事情。
   錯(cuò)誤示范：

這個(gè)系統(tǒng)不允許用戶購買沒有風(fēng)箏線的風(fēng)箏仲翎。

正確示范：

如果用戶想買一個(gè)沒有線的風(fēng)箏痹扇，這個(gè)系統(tǒng)應(yīng)該引導(dǎo)用戶到風(fēng)箏線的界面。

2. 具體（be specific）
   盡可能詳細(xì)地解釋清楚狀況溯香。

錯(cuò)誤示范：

最受歡迎的視頻要重點(diǎn)標(biāo)注鲫构。

正確示范：

上一周被播放最多的視頻要顯示在列表的最前端。

3. 避免主觀語氣（avoid subjective language）
   錯(cuò)誤示范：

這個(gè)網(wǎng)站的風(fēng)格應(yīng)該是時(shí)尚玫坛、閃耀的结笨。

正確示范：

這個(gè)網(wǎng)站的風(fēng)格應(yīng)該符合企業(yè)的品牌指南文檔。

內(nèi)容需求說明

1. 定義出所有不同類型的內(nèi)容湿镀。（文本禀梳？圖像？音頻肠骆？視頻算途？）
2. 不要忽視某段內(nèi)容的格式和它的目的。（FQA 的價(jià)值在于為用戶提供普遍需要的信息）
3. 提供每一個(gè)特性規(guī)模的大致預(yù)估蚀腿。（圖片尺寸嘴瓤、文字?jǐn)?shù)量、PDF等文件的大小等）
4. 確定內(nèi)容元素負(fù)責(zé)人莉钙。
5. 通過平衡用戶期望和有效資源來定義每一個(gè)內(nèi)容特性的更新頻率廓脆。
6. 為不同類型的用戶設(shè)計(jì)不同的內(nèi)容呈現(xiàn)方式。

確定需求優(yōu)先級(jí)

1. 剔除與產(chǎn)品目標(biāo)不匹配的特性（若特性足夠好也可重新思考產(chǎn)品目標(biāo)）磁玉。
2. 根據(jù)戰(zhàn)略目標(biāo)的優(yōu)先級(jí)確定需求優(yōu)先級(jí)停忿。

戰(zhàn)略層（產(chǎn)品目標(biāo) ＋ 用戶需求）
產(chǎn)品目標(biāo)

我們通過這個(gè)產(chǎn)品得到了什么？（用盡可能具體的詞匯來定義我們期望產(chǎn)品“本身”能完成的事情）

傳遞品牌識(shí)別是一種非常普遍的產(chǎn)品目標(biāo)蚊伞。
為了驗(yàn)證我們是否達(dá)成了產(chǎn)品目標(biāo)和滿足了用戶需求我們需要定義成功標(biāo)準(zhǔn)：

一些可追蹤的指標(biāo)席赂。

成功指標(biāo)可體現(xiàn)在對(duì)網(wǎng)站的間接影響吮铭。

用戶需求

我們的用戶通過這個(gè)產(chǎn)品得到了什么？
先定義誰是我們的用戶颅停，然后再來分析他們的需求谓晌。以下方法可以幫助我們實(shí)現(xiàn)這個(gè)目標(biāo)。

用戶細(xì)分

將用戶按照某種共同關(guān)鍵特征劃分成不同的群組癞揉，一種揭示用戶最終需求的手段纸肉。

可以根據(jù)以下維度對(duì)用戶進(jìn)行劃分。

1. 人口統(tǒng)計(jì)學(xué)標(biāo)準(zhǔn)（性別喊熟、年齡柏肪、教育水平、婚姻狀況芥牌、收入等）烦味。
2. 消費(fèi)心態(tài)檔案（psychographic profiles）。
3. 對(duì)于技術(shù)對(duì)熟悉度胳泉。
4. 對(duì)產(chǎn)品內(nèi)容的了解程度（專業(yè)程度）拐叉。
5. 社會(huì)或?qū)I(yè)角色。
   在進(jìn)行用戶研究之后扇商，可以對(duì)用戶細(xì)分群組進(jìn)行調(diào)整凤瘦，比如合并需求相似的群組，拆分存在不同需求的群組案铺。

收集用戶的觀點(diǎn)與感知的方法：

1. 問卷調(diào)查蔬芥。
2. 用戶訪談。
3. 焦點(diǎn)小組控汉。

了解用戶行為以及與產(chǎn)品交互時(shí)表現(xiàn)的方法：

1. 現(xiàn)場調(diào)查笔诵。
2. 任務(wù)分析。
3. 用戶測試（還可用于測試產(chǎn)品的可用性以及改版效果）姑子。

探索用戶如何分類或組織各種信息元素的方法：卡片排序乎婿。

用戶模型
通過將帶面孔、名字以及通過用戶研究得到的信息來創(chuàng)建的用戶模型可以幫中我們更好地理解用戶需求街佑。

生成戰(zhàn)略文檔
將產(chǎn)品目標(biāo)和用戶需求寫進(jìn)正式的文檔谢翎，以幫助我們?cè)诠ぷ髦凶龀稣_的決定。

作者想要你做什么沐旨？

讓我了解用戶體驗(yàn)師的決策環(huán)境并了解與用戶體驗(yàn)相關(guān)的基本概念森逮，然后建議我們通過他提供的基本架構(gòu)－－五個(gè)層面來設(shè)計(jì)用戶體驗(yàn)。