用戶體驗(yàn)要素——以用戶為中心的產(chǎn)品設(shè)計(jì)

用戶體驗(yàn)是指產(chǎn)品如何與外界發(fā)生聯(lián)系并發(fā)揮作用,也就是人們?nèi)绾巍敖佑|”和“使用”它。
用戶體驗(yàn)設(shè)計(jì)通常要解決的是應(yīng)用環(huán)境的綜合問(wèn)題,兼顧視覺(jué)和功能兩個(gè)方面的因素,同時(shí)解決產(chǎn)品所面臨的其他問(wèn)題。產(chǎn)品越復(fù)雜,確定如何向用戶提供良好的使用體驗(yàn)就越困難。任何在用戶體驗(yàn)上所做的努力,目的都是為了提高效率。這基本上是以兩種主要形式體現(xiàn)出來(lái)的:“幫助人們工作得更快”和“減少人們犯錯(cuò)的幾率”。
影響用戶體驗(yàn)的因素有很多,其中內(nèi)容和技術(shù)是兩個(gè)最重要的因素。內(nèi)容決定了產(chǎn)品能對(duì)用戶提供的價(jià)值,技術(shù)決定了能提供給用戶的體驗(yàn)狀態(tài)。除了這兩個(gè)因素外,影響用戶體驗(yàn)的就是下面這五大要素:戰(zhàn)略層,范圍層,結(jié)構(gòu)層,框架層,表現(xiàn)層。
為了方便具體闡述各個(gè)層面的內(nèi)涵,我們把產(chǎn)品分為兩個(gè)大類:功能型產(chǎn)品和信息型產(chǎn)品。功能型產(chǎn)品是從傳統(tǒng)的桌面和客戶端軟件的角度出發(fā),主要關(guān)注的是任務(wù)。所有的操作都被納入一個(gè)過(guò)程,去思考人們?nèi)绾瓮瓿蛇@個(gè)過(guò)程。信息型產(chǎn)品是從信息的發(fā)布和檢索的角度出發(fā),主要關(guān)注的是信息。網(wǎng)站應(yīng)該提供哪些信息,這些信息對(duì)影虎的意義是什么。
下面,我們就來(lái)具體闡述這五個(gè)層面的具體含義。
戰(zhàn)略層
為什么要做這個(gè)產(chǎn)品?企業(yè)能得到什么好處——產(chǎn)品目標(biāo);用戶得到什么好處——用戶需求。我們的用戶是誰(shuí)?他們的需求是什么?
【成果形態(tài):戰(zhàn)略文檔,包括目標(biāo)清單和用戶調(diào)研報(bào)告】
范圍層
我們應(yīng)該為用戶提供哪些功能和信息?不能為用戶提供哪些功能和信息?定義需求,確定需求的優(yōu)先級(jí)。
【成果形態(tài):PRD,主要指功能規(guī)格說(shuō)明書】
結(jié)構(gòu)層
這些功能和信息該如何組織到一起呢?他們之間都是什么關(guān)系?(并列、父子)功能盡量依托于某個(gè)概念模型,而且要應(yīng)對(duì)好各種錯(cuò)誤處理;信息的有效組織依賴于元數(shù)據(jù)。
【成果形態(tài):架構(gòu)圖】
框架層
這些層次關(guān)系比較清晰的功能和信息該如何在頁(yè)面中布局?界面設(shè)計(jì)是選擇正確的界面元素,導(dǎo)航設(shè)計(jì)是在告訴用戶他們?cè)谀膬?,他們又可以去哪兒,信息設(shè)計(jì)是放置和排列信息的優(yōu)先級(jí)。
【成果形態(tài):框架圖】
表現(xiàn)層
關(guān)注視覺(jué)設(shè)計(jì),決定這種安排在視覺(jué)上如何呈現(xiàn)。
【成果形態(tài):風(fēng)格指南】
創(chuàng)建良好的用戶體驗(yàn)最重要的工作內(nèi)容是大量收集亟待解決的非常細(xì)微的問(wèn)題。
戰(zhàn)略層——產(chǎn)品目標(biāo)和用戶需求
戰(zhàn)略層定義
我們要通過(guò)這個(gè)產(chǎn)品得到什么——產(chǎn)品目標(biāo)
我們的用戶要通過(guò)這個(gè)產(chǎn)品得到什么——用戶需求
產(chǎn)品目標(biāo)
商業(yè)目標(biāo)/商業(yè)驅(qū)動(dòng)因素:替公司賺錢或替公司省錢
品牌識(shí)別:視覺(jué)設(shè)計(jì)(商標(biāo),色調(diào)和字體設(shè)計(jì)),概念系統(tǒng),情緒反應(yīng)
成功標(biāo)準(zhǔn):“什么時(shí)候到達(dá)了終點(diǎn)”,可追蹤的指標(biāo) | 印象樹(shù):網(wǎng)站上每一個(gè)廣告的每天被展示的數(shù)量
用戶需求(他們是誰(shuí)?他們的需求是什么?)
用戶細(xì)分:人工統(tǒng)計(jì)學(xué),消費(fèi)心態(tài)檔案
可用性和用戶研究:必須知道他們是誰(shuí)——用戶研究:收集必要的信息來(lái)達(dá)成共識(shí)——市場(chǎng)調(diào)研方法:現(xiàn)場(chǎng)調(diào)查、人任務(wù)分析、用戶測(cè)試(卡片排序法)
收集信息的方法:?jiǎn)柧碚{(diào)查、用戶訪談、焦點(diǎn)小組、現(xiàn)場(chǎng)調(diào)查、任務(wù)分析、用戶測(cè)試、卡片排序法
創(chuàng)建人物角色:用戶模型/用戶簡(jiǎn)介/用戶鏡像
團(tuán)隊(duì)角色和流程
戰(zhàn)略文檔/愿景文檔:文檔并不是越多越好;可演變和改進(jìn);共享
目標(biāo)清單:目標(biāo)的關(guān)系分析、目標(biāo)是如何融入企業(yè)環(huán)境、目標(biāo)的優(yōu)先級(jí)
用戶調(diào)研報(bào)告
范圍層——功能規(guī)格和內(nèi)容需求
范圍層定義
定義項(xiàng)目范圍則同時(shí)在做兩件事:這是一個(gè)有價(jià)值的過(guò)程,同時(shí)能產(chǎn)生有價(jià)值的產(chǎn)品。
用文檔來(lái)定義產(chǎn)品需求的兩大主要原因
這樣你才知道你正在建設(shè)什么:這個(gè)項(xiàng)目的目標(biāo)是什么,什么時(shí)候?qū)⑦_(dá)到這個(gè)目標(biāo)。
這樣你才知道你不需要建設(shè)什么:范圍蠕變
功能和內(nèi)容
我們?yōu)槭裁匆_(kāi)發(fā)這個(gè)產(chǎn)品——我們要開(kāi)發(fā)的是什么
定義需求
需求分為三個(gè)主要類別
- 人們講述的他們想要的東西
- 人們?cè)谀硞€(gè)過(guò)程或某個(gè)產(chǎn)品中遭遇到一些困難,想象有某種解決辦法可以緩解這一困難
- 人們不知道他們是否需要的特性
收集需求的兩個(gè)信息來(lái)源:用戶和競(jìng)爭(zhēng)對(duì)手
功能規(guī)格定義
樂(lè)觀:描述這個(gè)系統(tǒng)將要做什么事情去“防止”不好的情況發(fā)生
具體:盡可能詳細(xì)地解釋清楚情況
避免主觀的語(yǔ)氣:使需求“保持明確”和“避免歧義”
可量化:對(duì)功能的描述最好具體到數(shù)字
內(nèi)容需求定義
定義每一個(gè)內(nèi)容特性的更新頻率
不要混淆某段內(nèi)容的格式和它的目的
定義內(nèi)容元素的大小
確定需求優(yōu)先級(jí)
考慮需求實(shí)現(xiàn)的可行性
結(jié)構(gòu)層——交互設(shè)計(jì)與信息架構(gòu)
結(jié)構(gòu)層定義
確定各個(gè)將要呈現(xiàn)給用戶的元素的“模式”和“順序”。交互設(shè)計(jì)關(guān)注于將影響用戶執(zhí)行和完成任務(wù)的元素,信息架構(gòu)則關(guān)注如何將信息表達(dá)給用戶的元素。
交互設(shè)計(jì)
關(guān)注于描述“可能的用戶行為”。同時(shí)定義“系統(tǒng)如何配合與響應(yīng)”這些用戶行為。
程序員更容易創(chuàng)建出一個(gè)在技術(shù)上效率更高,卻忽略了什么才是對(duì)用戶而言最好的系統(tǒng)。
概念模型
用戶對(duì)于“交互組件將怎樣工作”的觀點(diǎn)稱為概念模型,例如電子商務(wù)網(wǎng)站中的購(gòu)物車
使用人們熟悉的概念模型,會(huì)使用戶很快適應(yīng)一個(gè)不熟悉的網(wǎng)站
一個(gè)概念模型可以反映系統(tǒng)的而一個(gè)組件或是整個(gè)系統(tǒng)
概念模型是用于在交互設(shè)計(jì)的開(kāi)發(fā)過(guò)程中保持使用方式的一致性的
錯(cuò)誤處理
如何一個(gè)交互設(shè)計(jì)的項(xiàng)目都有很大的部分牽涉處理“用戶錯(cuò)誤”
第一個(gè)同時(shí)也是最好的防止錯(cuò)誤的方法,是將系統(tǒng)設(shè)計(jì)成不可能犯錯(cuò)的那種
第二個(gè)避免錯(cuò)誤的方法是使錯(cuò)誤難以發(fā)生
有效的錯(cuò)誤信息和容易自我解釋的界面可以在錯(cuò)誤發(fā)生之后幫助用戶糾正,例如“撤銷”
信息架構(gòu)
在以內(nèi)容為主的網(wǎng)站上,信息架構(gòu)主要的工作是設(shè)計(jì)組織分類和導(dǎo)航的結(jié)構(gòu),讓用戶可以高效率、有效地瀏覽網(wǎng)站的內(nèi)容
一個(gè)高效結(jié)構(gòu)的優(yōu)點(diǎn)是具備“容納成長(zhǎng)和適應(yīng)變動(dòng)“的能力
結(jié)構(gòu)方法:層級(jí)結(jié)構(gòu)、矩陣結(jié)構(gòu)、自然結(jié)構(gòu)、線性結(jié)構(gòu)
戰(zhàn)略告訴我們”用戶的需求是什么“,范圍則告訴我們”什么樣的信息將滿足用戶那些用戶需求“。在創(chuàng)建結(jié)構(gòu)時(shí),我們就要具體地識(shí)別出用戶心目中至關(guān)重要的那些信息
受控詞典:強(qiáng)調(diào)一致性的工具,是網(wǎng)站使用的一套標(biāo)準(zhǔn)語(yǔ)言。它有助于建立起貫穿所有內(nèi)容的一致性。
架構(gòu)圖
信息架構(gòu)或交互設(shè)計(jì)的主要文檔是示意圖
架構(gòu)圖最重要的是記錄概念關(guān)系:哪些類別需要放在一起,而哪些需要保持獨(dú)立?在交互過(guò)程中那些步驟要怎樣相互配合?
框架層——界面設(shè)計(jì)、導(dǎo)航設(shè)計(jì)和信息設(shè)計(jì)
框架層定義
結(jié)構(gòu)層界定了我們的產(chǎn)品江永什么方式來(lái)運(yùn)作,框架層則用于確定用什么樣的功能和形式來(lái)實(shí)現(xiàn)
關(guān)注點(diǎn)幾乎全部在獨(dú)立的組件以及它們之間的相互關(guān)系上
界面設(shè)計(jì)考慮可交互元素的布局,導(dǎo)航設(shè)計(jì)考慮在產(chǎn)品中引導(dǎo)用戶移動(dòng)的元素的安排,而信息設(shè)計(jì)考慮傳達(dá)給用戶的信息要素的排布
習(xí)慣和比喻
讓你的界面與用戶早已養(yǎng)成的那些習(xí)慣保持一致很重要,但是更重要的是,界面要與它自身保持一致
有效的使用比喻,就是要減少用戶在”理解和使用你的產(chǎn)品功能“時(shí)對(duì)猜測(cè)的要求
界面設(shè)計(jì)
界面設(shè)計(jì)要做的全部事情就是選擇正確的界面元素
哪個(gè)功能要在哪個(gè)界面上完成,是我們?cè)诮Y(jié)構(gòu)層的額交互設(shè)計(jì)中已經(jīng)決定的;而這些功能在界面上如何被用戶認(rèn)知到,則屬于界面設(shè)計(jì)的范疇
成功的界面設(shè)計(jì)是那些能讓用戶一眼就看到”最重要的東西“的界面設(shè)計(jì)
一個(gè)設(shè)計(jì)良好的界面是要組織好用戶最常采用的行為,同時(shí)讓這些界面元素用最容易的方式獲取和使用
導(dǎo)航設(shè)計(jì)
網(wǎng)站的導(dǎo)航設(shè)計(jì):在每個(gè)頁(yè)面上放一些允許用戶瀏覽整個(gè)網(wǎng)站的鏈接
導(dǎo)航設(shè)計(jì)的三個(gè)目標(biāo)
- 提供給用戶一種在網(wǎng)站間跳轉(zhuǎn)的方法
- 傳達(dá)出這些元素和它們所包含內(nèi)容之間的關(guān)系
- 傳達(dá)出它的內(nèi)容和用戶當(dāng)前瀏覽頁(yè)面之間的關(guān)系
導(dǎo)航系統(tǒng):全局導(dǎo)航、局部導(dǎo)航、輔助導(dǎo)航、上下文導(dǎo)航、友好導(dǎo)航
信息設(shè)計(jì)
把各種設(shè)計(jì)元素聚合到一起,決定如何呈現(xiàn)這些信息,使人們能很容易使用或理解它們
指示標(biāo)識(shí):幫助用戶理解”他們?cè)谀膬骸耙约啊彼麄兡苋ツ摹暗南到y(tǒng),來(lái)自物理世界中公共空間的設(shè)計(jì),機(jī)場(chǎng)中的指示設(shè)施。好的指示標(biāo)識(shí)能使用戶很快滴得到一個(gè)心理圖像,”他們?cè)谀膬骸?、”能去哪兒“和”哪條路能使他們離自己的目標(biāo)更近“。
線框圖
頁(yè)面布局是將信息設(shè)計(jì)、界面設(shè)計(jì)和導(dǎo)航設(shè)計(jì)放置到一起,形成一個(gè)統(tǒng)一的、有內(nèi)在凝聚力的架構(gòu)的地方。
線框圖是整合在框架層的全部三種要素的方法:通過(guò)安排和選擇界面元素來(lái)整合界面設(shè)計(jì);通過(guò)識(shí)別和定義核心導(dǎo)航系統(tǒng)來(lái)整合界面設(shè)計(jì);通過(guò)放置和排列信息組成部分的優(yōu)先級(jí)來(lái)整合信息設(shè)計(jì)
表現(xiàn)層——感知設(shè)計(jì)
表現(xiàn)層定義
解決并彌補(bǔ)”產(chǎn)品框架層的邏輯排布“的感知呈現(xiàn)問(wèn)題
忠于眼睛
用戶眼睛的移動(dòng)軌跡的模式的額特點(diǎn)
遵循的是一條流暢的路徑
為用戶提供有效選擇的、某種可能的“引導(dǎo)”
對(duì)比和一致性
對(duì)比能夠把用戶的注意力吸引到界面中的關(guān)鍵部分,幫助用戶理解頁(yè)面導(dǎo)航元素之間的關(guān)系,是傳達(dá)信息設(shè)計(jì)中的概念群組的主要手段。
一致性能使你的設(shè)計(jì)有效地傳達(dá)信息,而不會(huì)導(dǎo)致用戶迷惑或焦慮。
一個(gè)成功的設(shè)計(jì)不僅僅是收集小巧的、精心設(shè)計(jì)的東西;相反,這些東西應(yīng)該能形成一個(gè)系統(tǒng),作為一個(gè)有凝聚力、連貫的整體來(lái)使用。
配色方案和排版:色調(diào),字體
設(shè)計(jì)合成品和風(fēng)格指南
“合成”的意思是“綜合的”,是從選定的組件中建立起來(lái)的、一個(gè)最終的可視化產(chǎn)品。
承載這些設(shè)計(jì)決策的權(quán)威性文檔是風(fēng)格指南,包括設(shè)計(jì)柵格、配色方案、字體標(biāo)準(zhǔn)或標(biāo)志應(yīng)用等等。
本文由 @無(wú)敵小金剛666?原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理?,未經(jīng)許可,禁止轉(zhuǎn)載。
結(jié)構(gòu)層到底是什么意思呢