《破繭成蝶》讀書筆記整理1

Part 2 技能

04 設(shè)計(jì)流程——設(shè)計(jì)師具體做什么

用戶體驗(yàn)設(shè)計(jì)的目標(biāo)歸納為:1.解決用戶需求;2.減少用戶理解和操作的成本棺禾;3.給用戶留下美好而深刻的印象

設(shè)計(jì)流程:需求分析→設(shè)計(jì)規(guī)劃→設(shè)計(jì)規(guī)劃→項(xiàng)目跟進(jìn)→成果檢驗(yàn)

書中原插圖

05 需求分析——拿回產(chǎn)品的主導(dǎo)權(quán)

5.1 和產(chǎn)品經(jīng)理一起做需求分析

做產(chǎn)品需要同時考慮商業(yè)價值和用戶需求。產(chǎn)品經(jīng)理一般都要背負(fù)各種產(chǎn)品績效指標(biāo),更多地站在商業(yè)/項(xiàng)目的角度去考慮問題蜡励,而設(shè)計(jì)師則更多地考慮用戶的需求境钟。在初始階段锦担,產(chǎn)品經(jīng)理和設(shè)計(jì)師應(yīng)該一起合作,通過融合各自的專業(yè)方法慨削,共同完成需求分析洞渔。

層級為:產(chǎn)品定位→產(chǎn)品需求→需求優(yōu)先級

5.1.1 產(chǎn)品定位

產(chǎn)品定位是產(chǎn)品設(shè)計(jì)的方向,也是需求文檔和設(shè)計(jì)產(chǎn)出的判斷標(biāo)準(zhǔn)缚态,也使團(tuán)隊(duì)成員形成統(tǒng)一的目標(biāo)和對產(chǎn)品的認(rèn)識磁椒。產(chǎn)品定位包括兩方面的內(nèi)容:產(chǎn)品定義和用戶需求,產(chǎn)品定義主要由產(chǎn)品經(jīng)理從項(xiàng)目角度考慮玫芦,用戶需求主要由設(shè)計(jì)師從用戶角度考慮浆熔。

用戶需求中的“目標(biāo)用戶”是再產(chǎn)品定義中的“使用人群”細(xì)分的基礎(chǔ)上得到的。

產(chǎn)品定義中的主要功能姨俩、產(chǎn)品特色和用戶需求中的目標(biāo)用戶形成了產(chǎn)品定位中最核心的內(nèi)容蘸拔,是產(chǎn)品設(shè)計(jì)最主要的方向和依據(jù)。

書中原插圖

·產(chǎn)品定義:用一句話概括某個產(chǎn)品

·使用人群:明確產(chǎn)品主要為誰服務(wù)环葵,所有的功能调窍、內(nèi)容、設(shè)計(jì)風(fēng)格的設(shè)定都圍繞這類人群來進(jìn)行

·主要功能:劃定功能的范圍和限制

·產(chǎn)品特色:區(qū)別于同類型競爭者的地方

·用戶需求:將一個個故事表述為“目標(biāo)用戶”“合理場景”下的“用戶目標(biāo)”张遭,就是解決“誰”在“什么環(huán)境下”想要“解決什么問題”邓萨,當(dāng)然這些內(nèi)容一定不要脫離前面產(chǎn)品定義的范圍。然后菊卷,對使用場景與用戶目標(biāo)進(jìn)行發(fā)散缔恳,這時候不需要太受人群類型的限制。

·目標(biāo)用戶:在用戶需求部分首先要確定的是目標(biāo)用戶洁闰,一方面是進(jìn)一步從使用人群中確定專注于服務(wù)的人群是哪一類歉甚,另一方面是目標(biāo)用戶的特征對于使用場景和用戶目標(biāo)的篩選有較大影響。選擇哪種類型作為目標(biāo)用戶扑眉,需要綜合權(quán)衡用戶對公司的價值以及潛在需求量(即產(chǎn)品的潛在用戶量)

·使用場景/用戶目標(biāo):根據(jù)目標(biāo)用戶對前面的發(fā)散內(nèi)容進(jìn)行篩選


5.1.2 需求從哪兒來

采集需求的主要方式有:頭腦風(fēng)暴(用戶簡單的常見的問題)纸泄、用戶調(diào)研赖钞、競品分析、用戶反饋(上線后)聘裁、產(chǎn)品數(shù)據(jù)(上線后)等

·用戶調(diào)研:通過問卷調(diào)查雪营、用戶訪談、信息采集等手段來挖掘需求的方式衡便,可以深入了解目標(biāo)用戶在真是使用環(huán)境下的感受献起、痛點(diǎn)、期望等

·競品分析:找到有代表性的同類產(chǎn)品镣陕,對比產(chǎn)品之間的優(yōu)勢谴餐、劣勢,從而發(fā)現(xiàn)產(chǎn)品的突破口茁彭。競品分析可以根據(jù)規(guī)劃進(jìn)行总寒,也可以根據(jù)功能、設(shè)計(jì)細(xì)節(jié)來進(jìn)行理肺,這取決于項(xiàng)目情況和需要摄闸。在競品分析的過程種,我們可以研究別人是怎么擬定產(chǎn)品戰(zhàn)略妹萨、方向的年枕,怎么做用戶體驗(yàn)的,怎么處理邏輯乎完、界面層級熏兄、界面細(xì)節(jié)的等等

·用戶反饋/產(chǎn)品數(shù)據(jù):都是在產(chǎn)品上線后可以收集到的使用信息。為了能夠順利獲取到這些數(shù)據(jù)树姨,在設(shè)計(jì)時要考慮到后期數(shù)據(jù)收集的需求摩桶,預(yù)先埋點(diǎn)。還可以參考一些公共調(diào)研機(jī)構(gòu)出具的數(shù)據(jù)分析報(bào)告:比如艾瑞資訊帽揪、百度指數(shù)硝清、淘寶指數(shù)等,要挖掘數(shù)據(jù)背后潛在的意義


5.1.3 如何分析與篩選需求(產(chǎn)品需求→需求優(yōu)先級)

采集需求方式的多樣化转晰,會導(dǎo)致需求質(zhì)量難以控制芦拿,如不同需求之間可能有沖突、對用戶的理解可能有偏差查邢、采集的需求不適合你的產(chǎn)品等蔗崎,因此要進(jìn)行篩選,定義出需求優(yōu)先級

書中原插圖

1.首先篩掉明顯不合理的需求

2.其次扰藕,要從現(xiàn)象看本質(zhì)缓苛,挖掘用戶真實(shí)需求。比如邓深,做用戶調(diào)研時他嫡,某用戶說上班路上不怎么聽音樂番官,如果這時候追問他可能會說是因?yàn)椴僮髀闊敲雌鋵?shí)上班路上不需要聽音樂只是表象钢属,嫌麻煩才是真實(shí)的想法,我們要解決的就是簡化操作门躯。再比如淆党,在競品分析中發(fā)現(xiàn)用戶認(rèn)為某功能很貼心,我們要做的不是立刻把這個功能照搬過來讶凉,而是要分析這個功能為什么貼心染乌,解決了用戶什么問題

3.接下來,進(jìn)一步分析提煉出的用戶真實(shí)需求是否匹配產(chǎn)品定位(目標(biāo)用戶+主要功能+產(chǎn)品特色等)懂讯,被選中的需求可根據(jù)匹配程度排列需求優(yōu)先級

4.最后是考慮需求實(shí)現(xiàn)的成本以及收益


·需求文檔:

完成之后就可以重點(diǎn)描述每個需求的邏輯荷憋、內(nèi)容等,開始撰寫詳細(xì)的需求文檔褐望。需求文檔對設(shè)計(jì)師來說勒庄,更像是一個彼此約定好的產(chǎn)品功能清單,幫助提醒設(shè)計(jì)師接下來要做什么瘫里。需求文檔不僅面向設(shè)計(jì)師实蔽,也面向團(tuán)隊(duì)中的開發(fā)和測試人員,是項(xiàng)目成員參考的重要依據(jù)

需求文檔中應(yīng)該包含的內(nèi)容:文檔修改與審核記錄谨读;目錄(內(nèi)容過多時)局装;背景描述(為什么做這個產(chǎn)品);用戶類型和特征劳殖;項(xiàng)目時間安排(何時啟動铐尚、何時完成);信息結(jié)構(gòu)哆姻;整體業(yè)務(wù)流程說明宣增;需求詳細(xì)說明

需求文檔也需要不斷地修正、迭代填具。在完成需求文檔后需要進(jìn)行需求評審统舀,評審后,產(chǎn)品經(jīng)理會根據(jù)大家的意見重新修改劳景。在交互設(shè)計(jì)師拿到需求報(bào)告進(jìn)行設(shè)計(jì)產(chǎn)出時誉简,結(jié)果一般也會和需求文檔中的內(nèi)容不太一樣,只要經(jīng)過有效溝通盟广,產(chǎn)品經(jīng)理一般都是可以接受的闷串,也相當(dāng)于對需求文檔進(jìn)行了迭代。這時產(chǎn)品經(jīng)理可以在設(shè)計(jì)完成后在修正需求文檔筋量,也可以讓設(shè)計(jì)師把相應(yīng)的修改部分注釋在原型稿上


5.2 傾聽用戶的聲音

5.2.2 別被用戶牽著走

用戶提出的想法烹吵、要求可能會有如下問題:

1.用戶說的不一定是ta心中所想的

2.用戶沒有表達(dá)出自己的真實(shí)需求:比如在汽車未發(fā)明之前碉熄,問用戶想要什么,用戶只會說想要一匹更快的馬肋拔。要從用戶的言語中挖掘他內(nèi)心的真實(shí)需求锈津,而不是直接照著他的話去做

3.用戶意見不一定專業(yè):用戶的意見只是一種直觀感受爆侣,設(shè)計(jì)師需要經(jīng)過判斷和思考伤锚,重新審視用戶意見的合理性

5.2.3 如何對待用戶的意見

將上一小節(jié)“如何分析與篩選需求”中的幾個考慮因素細(xì)分,得到5個處理用戶意見的因素:

1.根據(jù)目標(biāo)用戶考慮:提出要求的用戶是你的目標(biāo)用戶嗎捌臊?

2.根據(jù)使用場景考慮:用戶提出的這個問題一般發(fā)生在什么場景窿吩?合乎實(shí)際的使用情況嗎茎杂?使用場景一方面和使用平臺有關(guān),比如臺式機(jī)的使用場景一般較固定纫雁,而手機(jī)等移動端的使用場景則較為多樣化煌往;另一方面和目標(biāo)用戶有關(guān),用戶的職業(yè)轧邪、身份和興趣愛好也決定了使用的場景刽脖。人在不同場景下會有不同的動作,而用戶在提出各種意見反饋時闲勺,未必會考慮到不同的使用場景

3.根據(jù)用戶目標(biāo)(真實(shí)需求)考慮:用戶表達(dá)出自己的真實(shí)需求了嗎曾棕?【同上面的第2點(diǎn)】

4.根據(jù)產(chǎn)品定位考慮:用戶提出的要求符合產(chǎn)品的定位嗎?

5.根據(jù)項(xiàng)目資源考慮:用戶提出的這個要求需要多少開發(fā)資源菜循?價值有多大翘地?需要立即開發(fā)嗎?


5.3 設(shè)計(jì)師的逆襲

在實(shí)際的項(xiàng)目中癌幕,設(shè)計(jì)師處在一個比較被動的地位衙耕。需要主動出擊,主動和產(chǎn)品經(jīng)理溝通和交流——搬到產(chǎn)品經(jīng)理旁邊去勺远,及時關(guān)注產(chǎn)品經(jīng)理的動態(tài)橙喘,及時和ta探討

5.3.2 拒絕不靠譜的需求文檔

撰寫需求文檔的好處:需求文檔可以有效地幫助產(chǎn)品經(jīng)理理清產(chǎn)品功能、內(nèi)容胶逢、業(yè)務(wù)邏輯等整體信息厅瞎;需求文檔大大地方便了團(tuán)隊(duì)的溝通,讓團(tuán)隊(duì)成員在項(xiàng)目前期迅速準(zhǔn)確初坠、全面地了解你的想法和簸;需求文檔可以幫助其他項(xiàng)目成員有針對性地提出問題,而不是感到困惑和無所適從碟刺,這樣也提升了工作效率

如何辨別需求文檔的內(nèi)容是否合理:(如果設(shè)計(jì)師沒有參與前期的需求分析而是直接拿到需求文檔)

·首先锁保,要明確:需求文檔中關(guān)于業(yè)務(wù)邏輯、產(chǎn)品要求、資源限制等是設(shè)計(jì)師必須要正確理解的內(nèi)容爽柒,而與設(shè)計(jì)有關(guān)的信息結(jié)構(gòu)吴菠、任務(wù)流程、功能說明浩村、界面描述等做葵,僅代表產(chǎn)品經(jīng)理個人的意見,作為參考即可

·其次心墅,如果需求文檔中的內(nèi)容不合理蜂挪,或者設(shè)計(jì)師受到的需求文檔中就已經(jīng)有產(chǎn)品經(jīng)理繪制的一些精致線框圖,這時需要進(jìn)行“重新回爐”(見5.3.3)

·再者嗓化,如果產(chǎn)品經(jīng)理沒有給需求文檔,直接要求設(shè)計(jì)師照抄競品(見5.3.4)

5.3.3 從“功能需求”到“設(shè)計(jì)需求”

如果產(chǎn)品經(jīng)理撰寫的需求文檔并不合格谬哀,這種情況下設(shè)計(jì)師不應(yīng)該照著需求文檔的內(nèi)容去做設(shè)計(jì)刺覆,而需要“重新回爐”,通過用戶調(diào)研史煎、競品分析谦屑、用戶反饋、分析產(chǎn)品數(shù)據(jù)等方式重新歸納需求篇梭,考慮用戶的本質(zhì)需求氢橙,確立相應(yīng)的設(shè)計(jì)目標(biāo)(這里的設(shè)計(jì)目標(biāo)似乎是取代了原先產(chǎn)品定位的作用),再發(fā)散各種功能恬偷、內(nèi)容等悍手,篩選并排列優(yōu)先級,得到設(shè)計(jì)需求(這里的設(shè)計(jì)目標(biāo)和設(shè)計(jì)需求僅是設(shè)計(jì)師的設(shè)計(jì)方向和范圍袍患,是缺失了產(chǎn)品定位后設(shè)計(jì)師不得已采取的辦法坦康,但它依然無法完全替代鏟平定位和產(chǎn)品需求的作用)

5.3.4 如何“抄襲”競品

流程與5.3.3一致,也是通過倒推的方法诡延,分析競品的流程圖滞欠,然后得到原始用戶需求與業(yè)務(wù)邏輯,再提煉設(shè)計(jì)目標(biāo)肆良,確定設(shè)計(jì)需求筛璧,開始正常的設(shè)計(jì)過程∪鞘眩可以通過前面提到的用戶調(diào)研夭谤、競品分析、用戶反饋座舍、產(chǎn)品數(shù)據(jù)等方式沮翔,了解我們的用戶和競品用戶的區(qū)別,以及精品用戶在使用中有什么痛點(diǎn)和期望,如何更好地滿足用戶需求……拒絕不動腦子的“抄襲”

書中原插圖



06 設(shè)計(jì)規(guī)劃——從需求到設(shè)計(jì)草圖

交互設(shè)計(jì)師在這一環(huán)節(jié)中起到主導(dǎo)作用

我們根據(jù)需求來確定應(yīng)該提供哪些必要的信息給用戶采蚀,然后對信息分門別類疲牵、有效地組織起來,并以導(dǎo)航的形式展現(xiàn)在界面上榆鼠,讓用戶可以快速找到自己想要的信息纲爸;同時我們會根據(jù)需求來設(shè)計(jì)相應(yīng)的任務(wù),排列任務(wù)優(yōu)先級妆够,并在界面上通過一些列引導(dǎo)识啦,幫助用戶快速完成任務(wù)。信息和任務(wù)并不是孤立存在的神妹,而是相互關(guān)聯(lián)的:完成任務(wù)的過程中離不開信息的提示颓哮,而尋找信息有時為了完成一系列的任務(wù)

書中原插圖

6.1 從需求到界面,隔著一扇門

這扇門就是信息的組織與任務(wù)的設(shè)定

6.1.1 如何搞定信息分類

·邏輯歸類:根據(jù)人們在生活中熟悉的分類邏輯對內(nèi)容進(jìn)行組織鸵荠,比如買一件男士T恤冕茅,會按照“男裝>上裝>T恤”的順序來分類,而不是“上裝>男裝>T恤”

·卡片分類:可以設(shè)計(jì)出符合用戶心智模型的信息架構(gòu)蛹找。招募進(jìn)行卡片分類的志愿者最好要是與設(shè)計(jì)不相關(guān)的人員姨伤,在用戶進(jìn)行分類時,設(shè)計(jì)師和用研人員可以觀察用戶的分類過程庸疾,以及他們對標(biāo)簽含義的理解乍楚,最后對結(jié)果進(jìn)行分析。數(shù)據(jù)量小的時候可以直接在白板上分析分類情況届慈,或拍照記錄數(shù)據(jù)徒溪,數(shù)據(jù)量大時可以使用專門的數(shù)據(jù)分析軟件,如IBMEZSort拧篮、CardZort词渤、WebSort等

卡片分類一般可分為兩類:

開放式:給用戶足夠的自由度來進(jìn)行信息歸類,用戶自由地決定把卡片分為幾組串绩,每組多少張卡片缺虐,最后再由用戶為分好組的卡片命名,適用于內(nèi)容簡單礁凡、信息量較少的情況(否則會讓結(jié)果變得不可控)

封閉式:設(shè)計(jì)師會首先把導(dǎo)航的架構(gòu)設(shè)計(jì)好高氮,確定出導(dǎo)航的個數(shù)和名稱,再將屬于這些類目的卡片分發(fā)給用戶顷牌,讓用戶根據(jù)自己的期望把卡片歸類到不同的導(dǎo)航分類下剪芍。如果有些卡片用戶不知道該將它分到哪個類目下,可以將它拿出來窟蓝,所有卡片不一定要全部分完罪裹。封閉式更利于掌控,可用于對信息設(shè)計(jì)的結(jié)果進(jìn)行驗(yàn)證的階段


6.1.2 好的導(dǎo)航是成功的一半

信息的組織與分類是導(dǎo)航設(shè)計(jì)的基礎(chǔ),在保證結(jié)構(gòu)合乎邏輯的同時状共,還要考慮是否能正確引導(dǎo)用戶套耕,深度與廣度是否平衡,用戶的習(xí)慣和使用場景等問題

1.導(dǎo)航的自我解釋:成功的導(dǎo)航設(shè)計(jì)可以自我解釋峡继,讓用戶在導(dǎo)航系統(tǒng)中清楚地認(rèn)識到信息結(jié)構(gòu)和自己所處的位置冯袍,讓用戶具有方向感

2.深廣度平衡:層級的數(shù)目可以稱為導(dǎo)航的深度,每一層集中包含的菜單項(xiàng)數(shù)可以稱為導(dǎo)航的廣度碾牌。如果導(dǎo)航深度過深康愤,用戶就需要耗費(fèi)多此點(diǎn)擊才能找到所需信息,每多一次點(diǎn)擊操作都會流失掉一批用戶舶吗。相較于鼠標(biāo)的不停點(diǎn)擊征冷,眼睛在頁面上掃視的成本要低很多,廣度導(dǎo)航更利于用戶發(fā)現(xiàn)信息誓琼,但如果廣度超出用戶可以接受的范圍资盅,必須以此閱讀很多項(xiàng)才能在其中選擇,也會大大增加用戶的選擇負(fù)擔(dān)

書中原插圖
書中原插圖
書中原插圖

3.用戶所需信息與商業(yè)推廣信息的平衡:導(dǎo)航設(shè)計(jì)踊赠,一方面要了解用戶的信息需求,另一方面也要了解網(wǎng)站背后的商業(yè)目的每庆。比如亞馬遜筐带,相關(guān)商業(yè)推廣并不會一開始就干擾用戶瀏覽商品類目、購買商品缤灵,而是在用戶選擇的內(nèi)容附近默默出現(xiàn)伦籍。在不同產(chǎn)品頁面,為用戶推薦符合其目標(biāo)的信息腮出,可以起到事半功倍的作用帖鸦;在不影響用戶找到所需信息的情況下進(jìn)行商業(yè)推廣(比如使其在視覺上弱于用戶所需信息),可以減少對用戶的干擾

4.為重要功能和常用功能設(shè)置快捷入口:用戶在使用時胚嘲,并不會考慮到產(chǎn)品的邏輯是否合理清晰作儿,只希望在需要時能立刻找到自己想要的功能。但設(shè)置快捷入口哦也是一個需要權(quán)衡的過程馋劈,必要的“快捷通道”可以提高使用效率攻锰,但如果快捷入口過多,產(chǎn)品反而會變得混亂復(fù)雜

書中原插圖

6.1.3 主要任務(wù)與次要任務(wù)

如果把產(chǎn)品比作一座購物商城妓雾,那么信息架構(gòu)就是商場的框架娶吞,比如商場有多少層,每層都賣什么東西械姻;任務(wù)流程則相當(dāng)于商場里面的通道和指示妒蛇,用戶沿著過道完成“購物”、“支付”等主要任務(wù),根據(jù)提示完成“去衛(wèi)生間”绣夺、“找停車位”等次要任務(wù)吏奸,用戶在完成任務(wù)的過程中滿足了自己的需求,而產(chǎn)品也從中實(shí)現(xiàn)了其商業(yè)價值

次要任務(wù)是為了讓用戶完成最重要的任務(wù)而存在的乐导,因此是否設(shè)計(jì)支線(次要行為流)要看次要行為流是否能對用戶完成主行為流產(chǎn)生必要的幫助

任務(wù)流程確定后苦丁,就可以通過一系列草圖去把用戶完成任務(wù)的過程表現(xiàn)出來,這樣我們就得到了任務(wù)流物臂、頁面流設(shè)計(jì)旺拉,然后再去細(xì)化具體的界面

書中原插圖

6.1.4 如何突出主要任務(wù)

1.分解用戶任務(wù):從用戶的行為處罰,詳細(xì)描述用戶的使用過程棵磷,將用戶任務(wù)分解為具體的行為操作蛾狗,這些用戶行為就可以稱作這個任務(wù)的子任務(wù),每一個子任務(wù)都可以對應(yīng)到一個產(chǎn)品功能仪媒、一個界面模塊

書中原插圖

2.排列任務(wù)優(yōu)先級:要突出用戶的主要任務(wù)沉桌,就要對這些子任務(wù)所對應(yīng)功能的優(yōu)先級進(jìn)行排列。確定優(yōu)先級不是憑感覺算吩,要有可以量化的標(biāo)準(zhǔn)來衡量哪些功能優(yōu)先級高留凭,哪些功能優(yōu)先級低。我們可以通過使用人數(shù)偎巢、使用頻率和重要程度這三個維度來排布蔼夜,將優(yōu)先級分為三個層次:第一優(yōu)先級、第二優(yōu)先級压昼、第三優(yōu)先級求冷。優(yōu)先級并不是指出現(xiàn)的先后次序(那是行為流),而是在頁面中的重要程度

書中原插圖

3.組織合并相關(guān)任務(wù):將次序相同窍霞、操作類似匠题、界面類似的任務(wù)組合起來,合并為同一組模塊展示在用戶面前但金。在頁面中韭山,對于不同級別的任務(wù)要有不同的展現(xiàn)形式,一級任務(wù)一級展示冷溃,二級任務(wù)二級展示掠哥。

書中原插圖
書中原插圖
書中原插圖

6.1.5 如何引導(dǎo)用戶完成任務(wù)

按照用戶的操作邏輯,采用相似性引導(dǎo)秃诵、方向性引導(dǎo)续搀、運(yùn)動元素引導(dǎo)等:

·相似性引導(dǎo):如果大小、形態(tài)菠净、色彩禁舷、視覺元素等因素相似彪杉,那么這些相似的因素可以牽引著用戶的視覺,引導(dǎo)用戶操作

書中原插圖

·方向性引導(dǎo):可以利用具有指向性的箭頭牵咙;也可以利用清晰的視覺縱線建立起無形的方向性派近,同一方向上的視覺順序使頁面向下的邏輯關(guān)系很明顯

書中原插圖

·運(yùn)動元素引導(dǎo):比如購物頁面,添加到購物車之后會有一個從添加按鈕“飛到”購物車入口按鈕的一條運(yùn)動軌跡

跨域多個頁面的引導(dǎo):向?qū)Э丶╓izard)洁桌,用來引導(dǎo)用戶完成多步操作渴丸,還可以告訴用戶,要完成任務(wù)以哦那個需要多少步另凌,你現(xiàn)在所處的步驟是哪個谱轨,還有多少步可以完成任務(wù)等

書中原插圖

6.2 設(shè)計(jì)友好而易用的界面

6.2.1 如何簡化復(fù)雜的操作

1.減少冗余步驟和干擾項(xiàng):多一次跳轉(zhuǎn),意味著多一次注意力的轉(zhuǎn)移吠谢,多閱讀和理解一個頁面的信息土童。減少不必要的步驟,會讓用戶操作起來覺得輕松很多工坊。

2.講復(fù)雜操作轉(zhuǎn)移給系統(tǒng):復(fù)雜性存在一個臨界點(diǎn)献汗,超過了這個點(diǎn),過程就無法再簡化了王污“粘裕可以將復(fù)雜操作從用戶轉(zhuǎn)移給系統(tǒng),讓機(jī)器代替用戶進(jìn)行操作昭齐,也就是讓機(jī)器變得更智能(比如地圖軟件的路線起點(diǎn)自動定位為當(dāng)前地點(diǎn)等)

3.簡化操作方式:比如以前搜索一個詞條刃麸,先在原頁面選中詞條并復(fù)制,然后打開新的頁面粘貼到搜索欄司浪,然后點(diǎn)擊搜索,現(xiàn)在直接在原頁面選中詞條把沼,右鍵就會有一個直接跳轉(zhuǎn)搜索的按鍵

4.優(yōu)化操作過程:操作中得不到反饋啊易,發(fā)生錯誤后全部重新填寫,因?yàn)槿鄙兕A(yù)先提示而導(dǎo)致的重復(fù)操作比操作流程的冗余更可怕(再比如系統(tǒng)更新之前不先提示電量不足饮睬,在更新過程中因?yàn)闆]電導(dǎo)致需要重新更新)租谈。提供合適的首選項(xiàng)、適時幫助捆愁、及時反饋割去、提供合理的默認(rèn)值等等,可以幫助用戶降低出錯幾率昼丑,更快更順暢的完成任務(wù)

書中原插圖

6.2.2 信息量太大呻逆,頁面怎么擺

有人舉過一個例子:“我們精心設(shè)計(jì)過的頁面,在用戶看來菩帝,更像是以每小時100公里的速度駛過的廣告牌咖城〔缤龋”

1.讓頁面層次不言而喻:在設(shè)計(jì)以信息呈現(xiàn)為主的界面的時候,我們可以將要呈現(xiàn)的大段信息分解成易于理解的信息模塊宜雀,根據(jù)“用戶想看到什么”“我們想讓用戶看到什么”切平,為內(nèi)容板塊排列優(yōu)先級。這與分析用戶任務(wù)的過程類似辐董,都遵循“分解—排列—組織”的原則

在視覺呈現(xiàn)上悴品,要突出信息模塊之間的邏輯關(guān)系:

·邏輯相關(guān)的信息在視覺上分為一組:可以利用“接近原則”,物體之間的相對距離會影響我們對其組織方式的感知简烘,在模塊與模塊之間苔严,段落與段落之間等劃分幾個固定的高度,嚴(yán)格按照這幾個間距進(jìn)行排布夸研,從而形成整個頁面的節(jié)奏感邦蜜,用不同的間距表明界面內(nèi)容的關(guān)系

·內(nèi)容或重要程度不同的在視覺上體現(xiàn)出差異:使用“差異原則”

·邏輯上有包含關(guān)系的在視覺上進(jìn)行嵌套:就像在寫文章時,如果太長我們需要以一種層級結(jié)構(gòu)來展示各段及其子段落

2.讓重點(diǎn)信息“跳出來”:強(qiáng)調(diào)界面的重點(diǎn)元素亥至,而其他非重點(diǎn)的元素應(yīng)該盡量藏起來悼沈,或是顯得暗淡些

3.將次要信息“藏起來”:比如Google的首頁分了三個層級,用戶最常用的功能放置在導(dǎo)航欄上姐扮,使用頻率次之的功能放置在“更多”展開的菜單里絮供,在菜單的最后一項(xiàng)還有一個“更多”,點(diǎn)擊這里會跳轉(zhuǎn)到Google所有產(chǎn)品的列表頁茶敏,使用頻率最低的功能被放置在這里壤靶。有效地隱藏使大多數(shù)用戶可以快速找到常用功能。隱藏策略不僅可以讓界面重點(diǎn)更突出惊搏,還可以減少跳轉(zhuǎn)贮乳,滿足用戶的快捷操作


6.2.3 理性的規(guī)劃 VS 感性的界面

既要學(xué)會理性的規(guī)劃網(wǎng)站層級和邏輯,又要學(xué)會通過感性的界面吸引用戶

1.以人為本的界面設(shè)計(jì):目標(biāo)明確的用戶在使用產(chǎn)品時會按照流程一步步完成任務(wù)恬惯,而對于目標(biāo)不明確的用戶向拆,則需要通過更多的展示內(nèi)容來吸引他。用戶被吸引了才有可能嘗試操作酪耳,進(jìn)而完成任務(wù)浓恳。比如淘寶的收藏夾和購物車的界面又很大的差別,是因?yàn)榭紤]到了用戶的使用情境和心理感受:收藏夾需要適度的突出圖片碗暗、評論和人氣等颈将,吸引用戶去購買;而購物車則應(yīng)盡量簡潔明了言疗,不過多干擾用戶晴圾,方便迅速下單

書中原插圖

2.幫助用戶找到想要的東西:信息組織與分類的目的,就是要讓信息易于找尋:讓有明確目標(biāo)的用戶快速找到噪奄;讓有不明確目標(biāo)的用戶通過瀏覽和尋找一點(diǎn)點(diǎn)明確并最終找到疑务;讓沒有目標(biāo)的用戶在探索中激發(fā)需求

書中原插圖

3.吸引無目標(biāo)用戶:不能再用利性沾凄、邏輯的思維方式來對待他們,而要充分的換位思考知允,用感性的思維方式來給他們營造貼心撒蟀、友好、有吸引力的界面温鸽。對于閑逛型用戶保屯,如果也買你的內(nèi)容無法吸引他們,則很可能會流失掉涤垫。讓用戶在沒有注冊的時候也可以對網(wǎng)站的內(nèi)容略知一二姑尺,他們就有可能留下來,并注冊成為活躍用戶(如新浪微博和知乎的登陸頁面對比)

書中原插圖
書中原插圖

4.符合用戶心理模型


6.3 捕獲用戶的芳心

6.3.1 來自真實(shí)世界的靈感:如果界面設(shè)計(jì)的元素可以與現(xiàn)實(shí)世界中的潛意識因子相呼應(yīng)蝠猬,勾起用戶的回憶切蟋,引起用戶的共鳴,那么當(dāng)用戶看到界面時榆芦,能夠令其產(chǎn)生認(rèn)同感和情緒體驗(yàn)柄粹,與界面產(chǎn)生情感互動,從而引導(dǎo)用戶積極操作

1.擬物化的視覺:通過模擬現(xiàn)實(shí)中的物體匆绣,使用戶產(chǎn)生熟悉感驻右,讓信息和功能更加易于識別和理解,圖標(biāo)的擬物化設(shè)計(jì)能夠傳達(dá)應(yīng)用的使用方式崎淳。擬物不是百分百的還原堪夭,抽象出物體最有特征的部分,將繁復(fù)的視覺元素進(jìn)行簡化處理(比如網(wǎng)易云的播放頁面僅保留了留聲機(jī)最有特征的兩個元素:唱片和唱針)

2.隱喻化的操作:當(dāng)應(yīng)用中的可視化對象和操作與現(xiàn)實(shí)世界中的對象與操作類似時拣凹,用戶就能快速領(lǐng)會如何使用它森爽。比如ios的文件夾,點(diǎn)擊時就像現(xiàn)實(shí)生活中的抽屜一樣展開嚣镜,這種操作之間的邏輯關(guān)系爬迟,形成了一種空間感,這種邏輯關(guān)系越符合現(xiàn)實(shí)祈惶,就越容易讓用戶理解


6.3.2 貼心的設(shè)計(jì)惹人愛

1.可控的感受:人們對外部世界的控制感能夠帶來積極的情緒體驗(yàn),也更愿意接受挑戰(zhàn)和嘗試新鮮事物(比如加載狀態(tài)的進(jìn)度條)扮匠。為了增強(qiáng)用戶的可控干捧请,界面還需要預(yù)先提供提示,向用戶透露一些接下來將要發(fā)生的事情棒搜,讓用戶建立預(yù)期(比如聊天軟件中的“正在輸入”)

2.積極的反饋:積極的反饋可以增強(qiáng)用戶的信心疹蛉,提升用戶體驗(yàn)的愉悅感和成就感(比如用戶完成任務(wù)后獎勵一個閃閃發(fā)亮的獎?wù)拢o予一個大大的對勾和贊嘆的話語)

3.貼心的提醒:比如在發(fā)郵件的時候如果用戶在郵件內(nèi)容中提及到了“附件”二字卻沒有添加附件力麸,或者沒有填寫郵件主題可款,則會在發(fā)送前提醒用戶育韩;再比如查看消息列表時,看過的消息標(biāo)題會變灰闺鲸,降低飽和度筋讨,而未讀的消息標(biāo)題前則會有一個小標(biāo),且標(biāo)題醒目


6.3.3 如何調(diào)動用戶的情感

1.互動的樂趣:比如設(shè)計(jì)的幽默又友好的404頁面

2.驚喜的力量:雖然在功能方面沒有什么實(shí)際的用處摸恍,但用戶偶爾發(fā)現(xiàn)后悉罕,會增添一份特殊的喜悅,增強(qiáng)用戶的探索欲望(比如微信中的彩蛋:輸入“生日快樂”會出現(xiàn)滿屏的蛋糕等立镶,還有Google在特定的節(jié)日也會有一些彩蛋)

3.情景的烘托:講故事的方式壁袄,比如qq便民的充值中心在春節(jié)期間設(shè)計(jì)的活動頁面,選取了春運(yùn)媚媒、年終獎嗜逻、打電話拜年等過年時常見的場景,對保險缭召、彩票栈顷、充話費(fèi)等業(yè)務(wù)進(jìn)行了推廣

書中原插圖

6.4 快速表達(dá)我的想法——紙面原型

紙面原型的目的不是為了交付,而是為了溝通恼琼、測試妨蛹,無需考慮格式和規(guī)則。其中最需要關(guān)注的是框架晴竞、流程蛙卤、基本功能和內(nèi)容,設(shè)計(jì)細(xì)節(jié)可以忽略噩死。如果覺得紙面原型難以直觀的表達(dá)動態(tài)效果颤难,還可以使用POP-Prototyping on Paper和“快現(xiàn)”兩款手機(jī)應(yīng)用

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市已维,隨后出現(xiàn)的幾起案子行嗤,更是在濱河造成了極大的恐慌,老刑警劉巖垛耳,帶你破解...
    沈念sama閱讀 221,406評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件栅屏,死亡現(xiàn)場離奇詭異,居然都是意外死亡堂鲜,警方通過查閱死者的電腦和手機(jī)栈雳,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,395評論 3 398
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來缔莲,“玉大人哥纫,你說我怎么就攤上這事〕兆啵” “怎么了蛀骇?”我有些...
    開封第一講書人閱讀 167,815評論 0 360
  • 文/不壞的土叔 我叫張陵厌秒,是天一觀的道長。 經(jīng)常有香客問我擅憔,道長鸵闪,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,537評論 1 296
  • 正文 為了忘掉前任雕欺,我火速辦了婚禮岛马,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘屠列。我一直安慰自己啦逆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,536評論 6 397
  • 文/花漫 我一把揭開白布笛洛。 她就那樣靜靜地躺著夏志,像睡著了一般。 火紅的嫁衣襯著肌膚如雪苛让。 梳的紋絲不亂的頭發(fā)上沟蔑,一...
    開封第一講書人閱讀 52,184評論 1 308
  • 那天,我揣著相機(jī)與錄音狱杰,去河邊找鬼瘦材。 笑死,一個胖子當(dāng)著我的面吹牛仿畸,可吹牛的內(nèi)容都是我干的食棕。 我是一名探鬼主播,決...
    沈念sama閱讀 40,776評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼错沽,長吁一口氣:“原來是場噩夢啊……” “哼簿晓!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起千埃,我...
    開封第一講書人閱讀 39,668評論 0 276
  • 序言:老撾萬榮一對情侶失蹤憔儿,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后放可,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體谒臼,經(jīng)...
    沈念sama閱讀 46,212評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,299評論 3 340
  • 正文 我和宋清朗相戀三年耀里,在試婚紗的時候發(fā)現(xiàn)自己被綠了蜈缤。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,438評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡备韧,死狀恐怖劫樟,靈堂內(nèi)的尸體忽然破棺而出痪枫,到底是詐尸還是另有隱情织堂,我是刑警寧澤叠艳,帶...
    沈念sama閱讀 36,128評論 5 349
  • 正文 年R本政府宣布,位于F島的核電站易阳,受9級特大地震影響附较,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜潦俺,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,807評論 3 333
  • 文/蒙蒙 一拒课、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧事示,春花似錦早像、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,279評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至劝堪,卻和暖如春冀自,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背秒啦。 一陣腳步聲響...
    開封第一講書人閱讀 33,395評論 1 272
  • 我被黑心中介騙來泰國打工熬粗, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人余境。 一個月前我還...
    沈念sama閱讀 48,827評論 3 376
  • 正文 我出身青樓驻呐,卻偏偏與公主長得像,于是被迫代替她去往敵國和親葛超。 傳聞我的和親對象是個殘疾皇子暴氏,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,446評論 2 359