《用戶體驗要素》-讀書筆記

用戶體驗為什麼如此重要

• 說到我們所使用的那些產品和服務，我們對它們的感情可謂是愛恨交加。它們時而令我們備受鼓舞，時而令我們感到沮喪；它使生活變得簡單，又使生活變得複雜；它使我們變得疏遠，又使我們更加親近。即使這樣，我們還是不得不每天都和不計其數的產品或服務打交道，我們幾乎忘記了，技術產品也是由人們製造的。當產品滿足了人們的需要時，它的製造者應該受到讚揚，反之，則會受到指責。

• 我們所生產的產品是供人們在現實世界中使用的，在產品開發過程中，人們更多地關注產品將來用做什麼，用戶體驗是經常被忽略的另一個因素——即產品如何工作——而這一因素恰恰是決定產品成敗的關鍵因素。鬧鐘、咖啡機和收音機。

• 有些產品可能很好看且功能正常，但將「設計一個用戶體驗良好的產品」作為明確的目標，意味著不僅僅是功能或外觀那麼簡單。

• 對於產品直接面對用戶的那些部分——按鈕、布局、文字，也包括外觀，正確的產品形態絕對不是由「功能」所決定的，而是應該由「用戶自身的心理感受和行為」來決定的。

• 任何在用戶體驗上所做的努力，目的都是為了提高效率。1「幫助人們工作的更快」。2「減少他們犯錯的幾率」。人們所使用的工具效率的改進，會直接提高企業的整體生產力，在完成任務是你所花費的時間越少，那麼在一天之內你能完成的事情就越多。

認識這些要素

• 當我們做出的決定沒有和上下層面保持一致的時候，項目常常會偏離正常軌道，完成時間延遲，而在開發團隊試圖把各個不匹配的要素勉強拼湊在一起的同時，費用也開始飛速上漲。

• 在每一個層面的決定都會影響到它之上層面的可用選項。這種連鎖效應意味著在「較高層面」中選擇一個界限之外的選項將需要重新考慮「較低層面」中所做的決策。

• 事物都有兩個方面，在「較高層面」中的決定有時會促成對「較低層面」決策的一次重新評估(甚至是第一次評估)。在每一個層面，我們都根據競爭對手所做的事情、業界最佳的實踐成果來做決定，這是最簡單不過的老常識，這些決策可能產生的連鎖效應應該是雙方向的。

• 功能型產品，我們主要關注任務，所有的操作都被納入一個過程，去思考人們如何完成這個任務。在這裡我們把網站看成用戶用於完成一個或多個任務的一個或一組工具。

• 信息型產品，我們主要關注信息，網站應該提供哪些信息，這些信息對用戶的意義是什麼，創建一個富信息的用戶體驗，就是提供給用戶一個可以尋找、理解、且有意義的信息組合。

• 這種把用戶體驗劃分成各個方塊和層面的模式，非常有利於我們去考慮用戶在體驗中有可能遇到的麻煩。但是在現實世界中，這些區域之間的界限並沒有那麼明確。最常見的情形是，你很難鑒定某個用戶體驗的事件是否可以通過重視這個要素或那個要素去解決。是在視覺上晚一些小把戲就可以呢還是要改造最基本的導航設計？某些問題要求同時重視多個區域，而另一些甚至就橫跨在這個模型中各個要素的邊界上。

戰略層-產品目標&用戶需求

• 成功的用戶體驗，其基礎是一個被明確表達的「戰略」，知道企業與用戶雙方對產品的期許和目標，有助於促進用戶體驗各方面戰略的確立和制定。
• 我們要通過這個產品得到什麼？
• 我們的用戶要通過這個產品得到什麼？
• 用不狹義不廣義的方式定義「產品目標」，明確的定義「成功的條件」。
• 成功標準：即一些可追蹤的指標，在產品上線以後用來顯示它是否滿足了我們自己的目標和用戶的需求。好的成功標準不僅影響項目各階段的決策，也為衡量用戶體驗工作價值提供了具體的依據。特別是當你正申請下一個用戶體驗項目的預算，卻發現對方對用戶體驗的價值表示懷疑時。
• 客觀全局的分析事情全貌。好的用戶體驗不能為你帶來新用戶，必須依靠口碑或是市場營銷來吸引潛在用戶，但是用戶體驗能極大的影響訪問者的二次訪問幾率。測量回訪數據可能是一個很好的方法，但是競品是否在大規模廣告造勢、目前公司是否有負面新聞又同樣會造成影響。
• 用戶需求：確認用戶需求是複雜的，因為用戶之間存在巨大的差異性，我們要對這些用戶尋根究底，必須要定義誰是我們的用戶。
• 用戶細分：用戶細分將全部的用戶劃分成較小的、用共同需求的小組，以此來幫助我們更好的了解用戶的需求。
• 要了解用戶a.對於技術的熟悉程度和適應程度；b.對於網站相關內容的知識有多少。
• 我們要麼選擇針對單一用戶群設計而排除其他用戶群，要麼為執行相同任務的不同用戶群提供不同的方式。不論我們選擇哪一種，這個決策將會影響日後與用戶體驗相關的每一個選擇。
• 在用戶體驗設計的過程中，人物角色是從用戶研究中提取出的、可成為樣例的虛構人物。
• 所有參與者（設計師、程序員、信息架構師、項目經理）需要這份戰略文檔，以幫助他們在工作中做出正確的決定，戰略文檔通常包含敏感的資料，但僅僅因為這個就不告知應該理解戰略目標的團隊，只會破壞他們理解這些事情的能力。
• 戰略應該是在設計用戶體驗的流程中的起點，但那不意味在項目開始之前你的戰略需要完全確定下來。雖然設法擊中一個移動的目標可能會浪費很多時間和資源（更不用說極大的內心挫折感），但是戰略也應該是可以演變和改進的。當戰略被系統的修改與校正時，這些工作就能成為貫穿整個過程的、持續的靈感源泉。

範圍層-功能規格&內容需求

• 我們做的某些事情是因為其過程具有價值，就像慢跑或練習鋼琴一樣。而我們做的另一些事情是因為其產品具有價值，就像做一塊蛋糕或修理一輛汽車。定義項目範圍則同時在做這兩件事：這是一個有價值的過程，同時能產生有價值的產品。
• 技術不穩定、我們好像根本不了解用戶...這些都不是導致不能推出一個產品的真正原因，這個項目最大的絆腳石是沒有一個人願意去定義需求。產品經理需要把他的精力集中在新功能的思考上，這樣做的結果，就產生里一個不斷變化的、混合了完整產品的各個階段功能的產品。只要有人讀到的一篇新文章或一個新的想法，都會啟發這個產品負責人的靈感，然後考慮增加另一個功能特性，我們倒是有一個固定的工作流程，但是沒有日程安排、沒有里程碑，項目也看不到盡頭。因為根本沒有人知道這個項目的範圍。
• 用文檔來定義產品需求。原因一：這樣你才知道你在建設什麼。詳細的記錄下你正在建設的內容，每一個人就會知道這個項目的目標是什麼，最終產品不再是一個只停留在產品經理頭腦里的不定形的圖像。原因二：這樣你才知道你不需要建設什麼。了解你「不需要做什麼」也就意味著知道哪些是你「不需要馬上去做」的東西。把這些傑出的想法收集起來，找到一種適宜的方式，讓它們符合你的長期規劃，這才是真正的價值所在。

• 讓一個工程師、一個客服人員、一個營銷人員坐到一間會議室中談論同一個產品，這會對大家都有啟發意義。聽取從自己不熟悉的角度出發來考慮的、對於產品的觀點，並給予反饋，可以鼓勵人們多角度全方位地思考開發中的產品遇到的問題以及解決辦法。
• 當事情在實施過程中改變的時候，你不應該舉起你的雙手宣稱撰寫功能規格說明書是沒有價值的，而是應該讓撰寫的過程變得快速簡便，不要把它變成產品開發過程中的一個獨立項目。

結構層-交互設計&信息架構

• 在內容建設方面，主要是通過信息架構來構建用戶體驗，這個領域涉及多個學科，包括向來都要考慮的組織管理、分類、順序排列，以及與內容呈現有關的：圖書管理、新聞學、和技術通訊等其他學科。交互設計和信息架構都強調一個重點：確定各個將要呈現給用戶的元素的「模式」和「順序」。交互設計關注於將影響用戶執行和完成任務的元素。信息架構則關注如何將信息表達給用戶的元素。

• 交互設計關注於描述「可能的用戶行為」，同時定義「系統如何配合與響應」這些用戶行為。一個挺好的比喻：人類在使用產品的時候，用戶和機器這兩者之間就會產生某種類似舞蹈的步伐。用戶移動，系統響應；接著用戶再移動，來回應系統的響應，這樣舞蹈才能繼續進行。但一般的軟體設計並沒有刻意地留意這種舞步，此類軟體的設計思路是：反正每一種應用程序的舞步都會有一些不同的地方，讓用戶來適應這些不同的舞步並不算過分的要求。所以系統就可以自己跳自己的，要是有些用戶的腳步被踩了，那也只能當成是學習過程的一部分，可事實上，每一位舞者都會告訴你，成功的舞蹈是要求每一個參與者能夠預測對方的移動。

• 軟體自存在以來，一直為這樣的惡名所困擾：軟體是複雜的、混亂的難以使用的。這就是為什麼這麼多年來，「計算機基礎培訓」曾被廣泛的認為是用戶和軟體能和平相處的唯一方式。現在，與其針對機器的最佳工作方式來設計系統，還不如設計一個對用戶而言最好的系統。從此以後，把文職員工送去上編程課以提高他們的計算機基礎，這樣的活動就被逐漸省略了，取而代之來幫助軟體開發者的，是一個被稱作交互設計的新興學科。

• 用戶對於「交互組件將怎樣工作」的觀點稱為概念模型。它是用於在交互設計的開發過程中保持使用方法一致性的。在理想情況下，我們不需要告訴用戶網站時用的是什麼概念模型，用戶在使用網站的時候，基本是憑直覺的，因為這個網站的交互行為與他們隱含的期望值完全相符。
• 有效的錯誤信息和容易自我理解的界面可以在錯誤發生之後幫助用戶糾正。

• 網站是個有生命的個體，它們需要持續的關心和灌溉，同時網站也不可避免的會隨著時間的流逝而成長、改變。在許多情況下，滿足新的需求不應該導致重新考慮網站的整體結構。一個高效結構的優點就是具備「容納成長和適應變動」的能力。

框架層-界面設計&導航設計&信息設計

• 習慣和反射作用是我們與這個世界交互時的各種基礎。
• 成功的界面設計是那些能讓用戶一眼就看到「最重要的東西」的界面設計。
• 一個設計良好的界面是要組織好用戶最常採用的行為，同事讓這些界面元素用最容易的方式獲取和使用。
• 線框圖是整合在框架層的全部三種要素的方法：通過安排和選擇界面元素來整合界面設計；通過識別和定義核心導航系統來整合導航設計；通過放置和排列信息組成部分的優先順序來整合信息設計。把這三者放到一個文檔中，線框圖就可以確定一個建立在基本概念結構上的架構，同時指出了表現層的設計應該前進的方向。

表現層-感知設計

• 這裡，內容、功能和美學彙集到一起來產生一個最終設計，完成其他四個層面的所有目標並同時滿足用戶的感官感受。
• 代替用「什麼具有美感」來評估一個視覺設計方案的是，你應該把注意力集中在它們的「運作是否良好」上。對於那些在之前的層面就確定的目標，視覺設計給予它們的支持效果如何？例如，產品的外觀有沒有破壞結構？有沒有使結構中的各個模塊之間的區別變得不清楚、模稜兩可？或者，外觀有沒有強化結構，使用戶可用的選項清楚明了？
• 視覺設計不一定要精確地按照線框圖來做，只要它考慮到了相關的重要級別以及線框圖中各元素的組合關係。

專業辭彙：

element 要素

component 組件

surface 表現層

skeleton 框架層

structure 結構層

scope 範圍層

strategy 戰略層

information-rich 富信息

user need 用戶需求

product objective 產品目標

functional specification 功能規格

content requirement 內容需求

interaction design 交互設計

information architecture 信息架構

information design 信息設計

interface design 界面設計

navigation design 導航設計

sensory experience 感知體驗

content 內容

technology 技術

explicit 明確

business goals 商業目標

business drivers 商業驅動因素

brand identity 品牌識別

success metrics 成功標準

impressions 印象數

user segmentation 用戶細分

demographic 人口統計學

psychographic profile 消費心態檔案

user research 用戶研究

market research methods 市場調研方法

contextual inquiry 現場調查

task analysis 任務分析

user testing 用戶測試

usability 可用性

card sorting 卡片排序法

personas 用戶模型

strategists 戰略專家

stakeholder 決策層

strategy document 戰略文檔

vision document 願景文檔

process 過程

product 產品

working flow 工作流程

schedule 日程安排

milestones 里程碑

scope creep 範圍蠕變

functional specifications 功能需求規格

feature 特性

scenarios 場景

be positive 樂觀

be specific 具體

avoid subjective language 避免主觀的語氣

interaction design 交互設計

information architecture 信息架構

patterns 模式

sequences 順序

conceptual model 概念模型

top-down approach 從上到下

node 節點

hierarchical structure 層級結構

hub-and spoke 中心輻射

matrix structure 矩陣結構

organic structure 自然結構

sequential structure 線性結構

organizing principle 組織原則

nomenclature 命名原則

controlled vocabulary 受控詞典

architecture diagram 架構圖

interface design 界面設計

navigation design 導航設計

information design 信息設計

checkbox 複選框

radio button 單選框

text field 文本框

dropdown list 下拉菜單

list box 多選菜單

action button 按鈕

global navigation 全局導航

local navigation 局部導航

supplementary navigation 輔助導航

contextual navigation 上下文導航

courtesy navigation 友好導航

remote navigation

site map 網站地圖

index 索引表

way finding 指示標識

color coding 顏色編碼

wire frame 線框圖

eye tracking 眼球追蹤

contrast 對比

uniformity 一致性

grid-based layout 基於柵格線

color palette 配色方案

typography 排版
推薦閱讀：