按：在產品設計相關的書目中，這本書算是一本經典，被各種UI設計，交互設計或者PM等各個互聯網產品設計相關職業的讀書列表所收錄，幾乎所有的產品經理在入門時都被推薦過這本書。因為當UCD（User-Centered Design）設計已經成為互聯網產品通用思想的時候，UCD幾乎等同于產品設計本身，所以本書應該是每個想從事互聯網或者產品設計的人應該通讀的。從書名來看，以為是對用戶體驗的構成要素進行闡述，例如如易用性，情感化，愉悅性之類的內容，但此書從用戶體驗項目出發，通過戰略層，范圍層，結構層，框架層，表現層的五層分解，說明了用戶體驗工作從0到1的過程：
>內容簡介?
這不是一本關于“怎樣做（How-to）”的書。有很多很多討論如何建設網站的書，這本不是。
這不是一本關于技術的書。在這里你找不到一行代碼。
這不是一本有答案的書。相反，這本書說的是“如何提出正確的問題”。
這本書將告訴你，在你閱讀其他書籍的之前，你需要提前了解什么。如果你需要一個大的概念，如果你需要了解用戶體驗設計師所做出的決策的環境，這本書很適合你。
這本書經過精心設計，使你可以在一兩個小時之內讀完。如果你是一個剛剛進入用戶體驗領域的新手─可能你是一個負責組建用戶體驗團隊的管理人員，或者你是一個碰巧進入這個領域的作家或設計師─那么這本書將給你一些基礎的概念。如果你已經對這些方法和用戶體驗領域的關注點很熟悉了，那么這本書將幫助你更有效地把這些概念傳達給與你合作的人們。
本書是AJAX之父的經典之作。本書用簡潔的語言系統化地詮釋了設計、技術和商業融合是最重要的發展趨勢。全書共8章，包括關于用戶體驗以及為什么它如此重要、認識這些要素、戰略層、范圍層、結構層、框架層、表現層以及要素的應用。..
全書用清晰的說明和生動的圖形分析了以用戶為中心的設計方法（UCD）來進行網站設計的復雜內涵，并關注于思路而不是工具或技術，從而使你的網站具備高質量體驗的流程。
聰明的企業意識到網頁設計遠遠比創建條理清晰的代碼和鮮明的圖形重要多得多。一個網站在滿足您的戰略目標的同時，還應該滿足您的用戶需求。如果沒有一個“有凝聚力、統一的用戶體驗”來支持的話，即使最好的內容和最精密的技術也不能幫助您平衡這些目標。
但是創建用戶體驗看上去是出乎意料的復雜。有很多方面都要考慮到──可用性、品牌識別、信息架構、交互設計──這使得“建立一個成功的網站的唯一方法”似乎就是花大價錢請那些完全了解這些細節的專家來做。
本書用清晰的說明和生動的圖形分析了“以用戶為中心的設計方法（UCD）”來進行網站設計的復雜內涵，并關注于思路而不是工具或技術。Jesse James Garrett給了讀者一個關于“網站用戶體驗開發的總體概念”，從戰略和信息架構需求到視覺設計。這種簡單易學的介紹方法有助于任何一個網站開發團隊，大的或小的，去創建一個成功的用戶體驗。
>作者簡介
Jesse James Garrett 是用戶體驗咨詢公司Adaptive Path的創始人之一。從用戶體驗要素“在2000年3月初次發布到網上以來，Jesse的所繪制的這個模型已經被下載了2萬多次。Jesse的互聯網從業經驗包括AT&T、Intel、Boeing、Motorola、Hewlett-packard以及和美國國家公眾廣播等。他在用戶體驗領域的貢獻包括”視覺詞典（the Visual Vocabulary）“，一個為規范信息架構文檔而建立的開放符號系統，現在這個系統在全球各個企業中得到廣泛的應用。他的個人網站 www.jjg.net 是提供信息架構資源的網站中最受歡迎的一個.
>書摘
故針對不同的產品，應該有不同的交互設計理念，以及不同產品定位。
功能性產品于用戶有廣義上的兩個意義：
1. 產品的用途；
2. 產品如何與用戶發生聯系并發揮作用；
用戶體驗即決定產品如何與用戶發生聯系并發揮作用的一個重要指標。這一指標恰恰是決定產品成敗的關鍵因素。
一個好的用戶體驗可以提升一個產品的整體形象，從而留住現有的用戶（提升用戶忠誠度），吸引更多的用戶（口碑傳播）。
任何在用戶體驗上所作的努力，目的都是為了提高效率。這基本上是以兩種主要形式體現出來的：“幫助人們提升效率”和“減少人們犯錯的幾率”。
只有好的用戶體驗，才會吸引到用戶不斷登錄你的網站。
3. 用戶體驗的要素
一個Web產品的用戶體驗要素自下而上分了5個層次。戰略層為底層，表現層為最上層。可以想象一個產品就像一顆大樹一樣。從根到軀干，到枝葉，最后到開花結果。
1. 戰略層
產品的經營者想從這個產品得到些什么，用戶又想從產品得到些什么。有些戰略目標是顯而易見的，而有些戰略目標并不是很容易說清楚。就像騰訊最早在做免費聊天軟件，誰都不知道它想要干什么。戰略層關注的內容主要為：用戶需求以及網站目標。
2. 范圍層(scope)
我偏向于把它理解成為功能層，即你的這個產品都可以干些什么。這個產品有哪些功能。例如“weibo.com”，能發圖片，發文字，能互相關注，這就是范圍層需要考慮的東西。范圍層關注的內容為：產品的功能設計和信息的內容需求（定義內容的詳細屬性）。
3. 結構層(structure)
結構層比較抽象，主要用于設計用戶如何到達某個頁面，當完成了這個頁面的任務以后，用戶又要去什么地方。框架層定義了導航條上各項的排列方式，而結構層則確定了哪些類別應該出現在導航條上。結構層關注的內容：產品的交互設計和信息架構設計。
4. 框架層(skeleton)
網頁中的圖片，文字，按鈕，表格不是胡亂擺放在一起的，而是有一個組織結構，有一個布局設計，能達到這些元素之間的最大效果。例：在我需要看數據的時候有一個表格，而不是文字或者其他的按鈕。框架層關注的內容：信息設計、界面設計和導航設計。
5. 表現層(surface)
表現層就用戶直接看到的東西，用戶看得見摸得到（用鼠標）的東西，像網頁上的圖片，文字等等。表現層需要關注的內容：視覺設計。
一個好的Web產品絕不是來源于某一個boss的拍腦門，也絕對不是來自抄襲某一個外國網站。一個好的產品應該是經過深思熟慮，從五個層面自下而上的建立起來的。
可以從下圖看看如何完成一個Web產品。每一個底層的決定的方案，對會都上一層起到影響的作用，而最終形成一個確定的產品。
在設計產品時需要做好計劃。我們常常可能會遇到需求的變更或者根據競爭對手或行業標準去做一些產品上的調整。這樣就要求我們對產品的設計要足夠靈活。即范圍層進行一些調整，不會導致結構層完全無法承受。
舉個例子：地瓜在最初的時候的需求是只要能夠下載游戲就OK，所以就只針對游戲下載做了開發。后面需求變更，滿足不了下載軟件的條件時，進行結構上的大調整。這樣延誤了時間也耗費了人力。如果能在一開始就對整個產品的定義非常明確，在結構上設計的比較靈活，就能在后面的工作中規避很多諸如此類的問題（游戲版本、同一個包名的修改版等等）。
4. 戰略層
戰略層定義無非就是明確兩個問題的答案。
? 我們要從這個網站得到什么？
? 我們的用戶要從這個網站得到什么？
對第一個問題的回答有幾個關鍵詞：“目標”，“品牌”，“利益”，“頁面瀏覽量”，“用戶轉化率”等等。
對第二個問題的回答也有幾個關鍵詞：“用戶類型”，“現場調研”，“市場調研”，“用戶模型”等等。
首先我們在做一個Web產品的時候，需要明確自己要做一件什么事，需要在腦中有一個比較宏觀的構想，當朋友或者伙伴問起你：“嘿，這個東西最終到底是什么樣的啊？”你能頭頭是道的說出所以然來，可能當時的想法會很粗略或者很幼稚，但是必須有一個明確清晰的方向，這樣才不會導致在越做越多的功能和需求中迷失自己。最終要明白做這件事，自己到底想要得到的東西。（不是指商業目的）
其次，需要想清楚第二個問題，我們的用戶到底想要從這個網站得到什么？用弄清楚這個問題就得先考慮清楚我們的用戶是些什么人？是和尚？是道士？是學生？還是白領？這類人有些什么特性？他們為什么會需要我們的產品？他們最終會以什么樣得形式留在我們的網站中？可以適當使用一些調研方法去研究這些問題。問卷調查、用戶訪談等等。
5. 范圍層
設計范圍層需要注意的幾點：
? 收集和篩選需求
其次需要收集需求。需求是來自四面八方的，由來自用戶的，有來自boss的，有來自自己的，有朋友隨口提的。但是無論來自何處的需求，都需要注意以下幾點：
1. 不要被自己的思維方式限制住，不要太迷信自己，切不可認為自己就是典型用戶，認為自己的需求就是用戶的需求。
2. 要去各個渠道，各種方面收集需求。多開展頭腦風暴。
3. 從表象挖掘深層需求。
? 確定需求的優先級
戰略目標高于一切。分清需求的特性和戰略目標。將特性排除在戰略目標之外。有時候可能會突發奇想一個點子“我們做一個提醒用戶天氣的功能吧！這樣用戶會覺得很溫馨，每天瀏覽我們的網頁，都能看到溫馨的天氣提示。”在說這句話的時候想一想，我們的產品到底是要干什么用的，如果是旅游產品，提醒用戶景點的天氣無可厚非，但是如果是一個在線看電影的網站，提醒用戶天氣好像跟我們的戰略目標沒有太多相關聯之處。
? 需求設計
1. 用積極解決問題方式的心態進行設計，不論最終這個功能的結果是否能使用戶滿意，但是這個過程必須是使用戶感到滿意的。要隨時以友好的態度面對任何一個功能上的交互流程。
2. 具體，詳細的解釋需求。確認開發人員完全能理解設計的意圖，不會因為文檔或者溝通方面的問題導致產品返工。
3. 避免主觀語氣。在功能需求描述中切忌出現一些主觀描述詞語。例如：“弄得美觀一些”，“然后就那樣彈出提示”等等。
? 內容需求
只有當我們把內容需求制定得足夠明確，知道我們提供給用戶的內容都有哪些屬性，才會在后面的產品設計過程中得心應手。
我們要確定產品一共有幾維的屬性？在確定的屬性中還有可能增加新的維度嗎？這些問題我們都得在設計時候反復考慮。或者使用一個比較靈活的結構承載信息的內容需求。
6. 結構層
設計結構層需要注意的幾點：
? 理解用戶的思維方式和工作方式
最好的方法就是從既有的成功的產品中學習用戶如何使用產品和思考產品，當你的設計和大家的設計表現形式相同卻到達了兩個結果，這樣的設計就是壞的設計，是會困惑到用戶的設計。
? 關注交互設計
用戶會有哪些可能的行為，而這些可能的行為又會帶來哪些可能的響應？我們的產品應該如何配合用戶的這些行為。當用戶點擊了一個菜單以后，是應該在點擊菜單的附近出現選項，還是在另外頁面一個不容易察覺的角落出現選項？這些都是需要我們去細心考慮和學習的東西。
? 使用概念模型
用戶對于“交互組件將怎樣工作”的觀點稱為概念模型。例如你在淘寶上買東西，你會把東西放進購物車中而不是盒子中，不是盆子中，也不是口袋中。因為購物車有很強的概念模型，用戶在理解購物車的功能中要比理解盆子或者盒子更加容易得多。盡可能的去降低用戶的學習成本，所以要去使用好的概念模型。
? 錯誤處理
首先要從設計上規避一些常見的錯誤選擇出現，然后要去積極地解決每一個級別可能會出現的錯誤，確保更高比例的用戶能有積極的體驗。對一個Web產品來說最可怕的就是用戶在使用該產品的時候有強烈的挫敗感。用戶很快就能很容易找到另外一個替代品。
? 合理的信息架構
需要使用靈活的信息架構。一個有效結構的特點就是具備“容納成長和適應變動”的能力。當有新的需求時，不應該導致重新考慮網站的整體結構。而是在現有的結構中做一些調整就可以滿足需求。
? 結構方法
信息架構的基本單位是節點(node)。節點可以對應產品中的任意的信息片段或者組合，例節點可以是商品的價格屬性，也可以是呈現商品的頁面。然后節點通過不同的組織方式構成不同的信息架構。以下為幾種節點構成的信息架構。
層級結構：也成為樹狀結構，或中心輻射結構。節點和節點之間存在父級/子級的關系。像我們現在的網站“android.d.cn”就是一個標準的層級結構。
矩陣結構：允許用戶在節點與節點之間沿著兩個或更多的維度移動。例如地瓜可能會在以后做的關聯游戲推薦，通過兩個游戲之間的標簽作為節點進行關聯的一種結構。
自然結構：不會遵循任何一致的模式。節點是逐一被連接起來的。這種結構沒有太強的“分類”的概念。現在很少能看到這種結構。
線性結構：線性結構經常被見到于Web產品注冊流程或者網店商品購買流程之中。
? 組織原則
組織原則就是我們決定哪些節點要編成一組，哪些節點要保持獨立的標準。不同的組織原則將被應用在不同的區域和網站不同的層面。
我們的網站會按照時間或者熱度或者下載量對游戲進行組織。這就是我們的組織原則。不同的產品會使用不同的組織原則。微博在個人主頁是使用用戶發表的信息進行組織，而QQ在個人主頁是使用用戶關系進行組織。
戰略層告訴我們“用戶的需求是什么”，范圍層告訴我們“什么樣的信息將滿足用戶的需求”，然后我們在結構層就可以使用這些原則進行節點之間的組織。
? 使用通俗易懂的語言
與用戶談話并且了解他們的溝通方式，是開發出一個讓用戶感到命名原則自然的最有效方式。
當時在網游門戶部做需求的時候，去了解用戶最喜歡把鏈接叫飛機。所以考慮將新功能叫做坐飛機，但是考慮到是否新增用戶是否會理解這個語言的含義，所以還是使用比較傳統的叫法。
書中還提到了創建控制性詞典、類詞詞典的方法。和如何建立使用元數據。有興趣的同學可以仔細研讀該處。
7. 框架層
在框架層需要非常緊密的將界面設計，導航設計，信息設計三個元素結合起來。要像齒輪一樣的咬合，才能搭建出比較完美的框架層。
在實際設計中可能會發現這三者的邊界變得模棱兩可，但是把它們定義為獨立的領域可以幫助我們更準確的評估是否已經找到合適的解決方案。
通過“界面設計”，用戶可以接觸到在結構層的交互設計中確定的具體功能。
通過“導航設計”，用戶可以看到我們網站的信息結構中自由穿行。
通過“信息設計”，用戶在網站的信息結構中駐足的時候，他得到是有用的信息，還是一片無用的垃圾？
設計框架層需要注意的點：
? 尊重用戶的習慣；
在設計布局的時候，應該尊重用戶的習慣。不能天馬行空，讓用戶在使用你的產品時感到很強的挫敗感。應該像電話中數字矩陣的“3*4”布局。讓界面的布局和自身保持一致性。
? 使用合理的比喻方式
盡量讓用戶少思考就能明白你要傳達給用戶的意思。例如使用放大鏡比喻搜索的意思，用垃圾箱表示刪除的意思等等。
? 界面設計
在一個界面的第一次呈現給用戶的時候，仔細考慮每一個選項的默認值，仔細考慮界面中信息的排序方式，用戶需要哪些信息。站在用戶的角度去思考任務和目標。
還有一種做法就是記住用戶的最后一次選擇狀態。
? 導航設計
在信息空間中，大多數人是不會有太強的方向感的，所以需要設計導航指引人們當前的位置。就是你的網站需要告訴用戶“你現在在哪兒？”，“下一步可以去哪兒？”
? 信息設計
首先需要站在用戶的角度進行思考，想想什么樣得信息結構更適合于用戶瀏覽。就像寫作文一樣，我們的用戶是語文老師，老師認為作為就應該是龍頭豬肚鳳尾，所以我們把作文寫成龍頭豬肚鳳尾就能得高分，而寫成豬頭鳳肚龍尾就是不行的。我們給用戶呈現的信息也應該最遵循用戶認為正確的結構進行組合。
當時在做地瓜管理列表中呈現給用戶的內容時，考慮到用戶在管理列表中更希望看到的信息是他的所安裝游戲的版本號和大小。所以我們改掉了普通列表中顯示星級和評論數的設計，而將用戶可能更加關心的信息呈現給用戶。
? 指示標示
這個很容易理解。就是把免費的標成綠色，下載按鈕用更加顯眼的形狀或者顏色進行標注。
? 線框圖
線框圖是對頁面中所有的組成部分以及它們如何結合到一起的一個露骨的描述。我們常常使用頁面原型進行表達。
8. 表現層
最終呈現到用戶眼前的東西。
需要一個非常好的VI設計和UI設計。讓用戶能非常快樂的接受你想傳達給他們的信息。（審美觀比較差的人就不發表什么意見了。）
