2023-6-1 博博
“系統(tǒng)應(yīng)該在合理的時(shí)間內(nèi)通過(guò)適當(dāng)?shù)姆答仯冀K讓用戶了解正在發(fā)生的事情” --尼爾森。
用戶都希望產(chǎn)品是可控的、狀態(tài)是可預(yù)測(cè)的,所以無(wú)論用戶在界面上做了什么,系統(tǒng)應(yīng)該在合適的時(shí)間給予合理的反饋,始終保持界面的狀態(tài)可見(jiàn)、變化可見(jiàn)、內(nèi)容可見(jiàn),讓用戶對(duì)已經(jīng)發(fā)生的、正在進(jìn)行的、以及后續(xù)走向都有所了解,以避免在后續(xù)的轉(zhuǎn)化決策中出現(xiàn)錯(cuò)誤。
界面不僅僅是為了把信息呈現(xiàn)給用戶,還需要引導(dǎo)用戶來(lái)操作,讓用戶清楚的知道當(dāng)前在什么位置,以及操作時(shí)最想要知道的信息。
例如,訂單頁(yè)頂部的導(dǎo)航分欄,不僅將字體加大加粗、色彩加深,還添加了主題色的形狀,為的就是強(qiáng)化用戶當(dāng)前所在位置。購(gòu)買(mǎi)產(chǎn)品VIP時(shí),按鈕中會(huì)顯示金額,也是為了讓用戶的視線停留在CTA按鈕上,避免用戶想要查看價(jià)格時(shí)將視線從CTA按鈕上移開(kāi)。
對(duì)于同一操作,系統(tǒng)需要搭配不同的時(shí)間場(chǎng)景給予不同的反饋,確保反饋的及時(shí)性,避免讓用戶產(chǎn)生焦慮或不安。例如在跳轉(zhuǎn)頁(yè)面時(shí),即時(shí)跳轉(zhuǎn),用戶通常看不到任何跳轉(zhuǎn)中的狀態(tài),時(shí)間稍長(zhǎng)會(huì)看到加載動(dòng)效,若長(zhǎng)時(shí)間沒(méi)有響應(yīng),則會(huì)提示其他問(wèn)題,如網(wǎng)絡(luò)問(wèn)題、跳轉(zhuǎn)失敗等。
用戶需要清晰感知到已經(jīng)發(fā)生、正在發(fā)生以及即將發(fā)生的事情,以便于他們進(jìn)行下一步?jīng)Q策。每當(dāng)用戶進(jìn)行交互后,系統(tǒng)應(yīng)將當(dāng)前狀態(tài)、位置、進(jìn)度以及操作結(jié)果適當(dāng)?shù)姆答伣o用戶,以減少不確定性。如果用戶存在失誤,更應(yīng)加以正確方向上的引導(dǎo),避免用戶產(chǎn)生疑惑或重復(fù)操作。
例如在電商應(yīng)用中,將商品收藏、添加到購(gòu)物車等,這種操作行為不會(huì)造成任何損失,系統(tǒng)在反饋時(shí)盡量不要打斷用戶,使用類似toast簡(jiǎn)短彈窗提示即可。但對(duì)于金額支付、內(nèi)容刪除等,會(huì)涉及用戶利益或安全方面的操作,就需要通過(guò)彈窗打斷用戶當(dāng)前操作,讓其二次確認(rèn)后再作決策,以減少不必要的損失。
“系統(tǒng)應(yīng)該說(shuō)用戶的語(yǔ)言,用戶熟悉的單詞,短語(yǔ)和概念,而不是系統(tǒng)導(dǎo)向的術(shù)語(yǔ)。遵循現(xiàn)實(shí)世界的約定,使信息以自然和合乎邏輯的順序出現(xiàn)”--尼爾森。
設(shè)計(jì)師需要站在用戶的角度去做設(shè)計(jì),但并不能就此代表用戶,不要將自己對(duì)產(chǎn)品的理解、行業(yè)中的專業(yè)術(shù)語(yǔ)代入用戶場(chǎng)景中,因?yàn)橛脩舻恼J(rèn)知大多來(lái)源于多周圍環(huán)境的感知,我們需要使用最貼近目標(biāo)用戶群體生活場(chǎng)景的表達(dá)方式,讓信息表現(xiàn)的自然,用戶能更容易理解。
對(duì)于環(huán)境貼切原則,直接點(diǎn)就是“說(shuō)人話”,蘋(píng)果之父「喬布斯」和微信之父「張小龍」的產(chǎn)品核心理念便是如此,用最簡(jiǎn)單直白的語(yǔ)言、用戶最熟悉的概念呈現(xiàn)信息,盡量貼近真實(shí)的世界,將產(chǎn)品做到傻瓜也能操作,才能保證與用戶溝通交流的順暢。
產(chǎn)品的設(shè)計(jì)語(yǔ)言需要針對(duì)不同的用戶群體以及不同的使用習(xí)慣,使用該群體所熟知的文字、圖形、版式、配色以及設(shè)計(jì)風(fēng)格等,讓用戶覺(jué)得這個(gè)產(chǎn)品能解決自己的問(wèn)題,不會(huì)有認(rèn)知上的困難。
從大了講,例如微信的標(biāo)準(zhǔn)模式符合大多數(shù)常規(guī)用戶的操作,但又另外設(shè)計(jì)了一套關(guān)懷模式,將文字、按鈕變的更大,色彩變的更強(qiáng),這就是為老年人的視覺(jué)障礙而準(zhǔn)備的一套解決方案。還可以開(kāi)啟聽(tīng)文字消息,在會(huì)話框中只要點(diǎn)擊一下文字消息,系統(tǒng)就可以直接閱讀,將信息的傳達(dá)從視覺(jué)轉(zhuǎn)移至聽(tīng)覺(jué),更大程度的解決了視覺(jué)障礙問(wèn)題。其實(shí),不管是微信的標(biāo)準(zhǔn)模式、關(guān)懷模式,還是其他的鄉(xiāng)村模式、青少年模式、大學(xué)生模式等,都是為了迎合不同的用戶群體。
將范圍縮小至產(chǎn)品的某個(gè)功能,如高德地圖視覺(jué)障礙模式(色盲/色弱用戶的專屬配色)、首頁(yè)設(shè)置(搜索框位置的調(diào)整)等也是為了滿足不同用戶群體或同一用戶群體的不同使用習(xí)慣而設(shè)計(jì)。
將現(xiàn)實(shí)世界中的物體映射至產(chǎn)品設(shè)計(jì)中,能讓用戶通過(guò)對(duì)現(xiàn)實(shí)環(huán)境的認(rèn)知感受到產(chǎn)品的真實(shí)易懂,很大程度上降低了學(xué)習(xí)成本,幫助用戶更快的理解并輕松掌握其使用方式。模擬現(xiàn)實(shí)世界的物體并不僅僅局限其外形,對(duì)于其動(dòng)態(tài)效果、聲音以及其他屬性特征等都可以加以融合,打造更真實(shí)的用戶體驗(yàn)。
iOS系統(tǒng)早期的桌面圖標(biāo)就是如此,即便后來(lái)逐漸過(guò)渡到扁平化,但很多地方依然保留了擬物化的設(shè)計(jì),如同步變化的動(dòng)態(tài)時(shí)鐘表盤(pán)、接近于物品外觀的相機(jī)、計(jì)算器圖標(biāo)等。網(wǎng)易云音樂(lè)播放頁(yè)面中,復(fù)古的黑膠唱片,不僅模仿了早期的留聲機(jī),還融入的懷舊情感,與其他同類產(chǎn)品的差異性也即刻凸顯。
產(chǎn)品不僅可以使用人們對(duì)真實(shí)物體的視覺(jué)感知,還可以利用文化觀念進(jìn)行隱喻。
例如,紅色意味著危險(xiǎn)、禁止,綠色則代表安全、通過(guò),而產(chǎn)品中的審核結(jié)果就可以用顏色醒目的圖標(biāo)強(qiáng)化提示,紅色表示審核未通過(guò)、綠色表示審核通過(guò)。另外在現(xiàn)實(shí)生活中,“+、-”符號(hào)代表增加和減少,對(duì)于互聯(lián)網(wǎng)產(chǎn)品,同樣可以使用“+、-”來(lái)表示內(nèi)容的增加與減少,常見(jiàn)的有購(gòu)買(mǎi)商品數(shù)量調(diào)整、自定義內(nèi)容布局等。
“用戶通常會(huì)錯(cuò)誤地選擇了系統(tǒng)的某個(gè)功能,并且需要一個(gè)明確標(biāo)記的「緊急出口」來(lái)離開(kāi)不想要的狀態(tài),而不必進(jìn)行擴(kuò)展對(duì)話。支持撤消和重做”--尼爾森。
用戶需要擁有控制系統(tǒng)和來(lái)去自由的權(quán)利,且產(chǎn)品要在用戶可能犯錯(cuò)誤之前及時(shí)警示并給予正確的引導(dǎo),但總有些特殊場(chǎng)景,用戶發(fā)生主觀上的失誤不可避免,為了不讓用戶進(jìn)入到錯(cuò)誤的場(chǎng)景,這時(shí)系統(tǒng)應(yīng)該提供一個(gè)“緊急出口”,便于用戶撤銷和重做。
在使用產(chǎn)品的過(guò)程中,系統(tǒng)檢測(cè)到用戶有可能出現(xiàn)操作失誤的情況,應(yīng)給予明確的提示和指引,關(guān)閉/返回就是最為常見(jiàn)的“緊急出口”,即便大部分用戶知道向右側(cè)滑返回,但“緊急出口”依然要明確顯示。
另外,在刪除某些信息時(shí),系統(tǒng)給予的確認(rèn)彈窗也是為了減少用戶操作失誤,以免造成不必要的損失。
用戶的失誤行為已不可避免的發(fā)生,應(yīng)當(dāng)提供撤銷、取消或重做等相關(guān)功能。
在社交類應(yīng)用中,短時(shí)間內(nèi)發(fā)出的消息可撤回重新編輯,便是給了用戶可以反悔的權(quán)利,辦公類產(chǎn)品中的回收站亦是如此。
“不應(yīng)該讓用戶懷疑不同的話語(yǔ)、場(chǎng)景或行為是否在表達(dá)同樣的一件事情。系統(tǒng)設(shè)計(jì)需遵循平臺(tái)慣例,保持一致性”--尼爾森。
對(duì)用戶來(lái)說(shuō),同一產(chǎn)品需要統(tǒng)一的設(shè)計(jì)規(guī)范,其視覺(jué)樣式、交互形式都應(yīng)該遵循基本的用戶習(xí)慣,保持功能、操作的一致性為確保用戶對(duì)界面的學(xué)習(xí)使用至關(guān)重要。
設(shè)計(jì)規(guī)范就是為保持產(chǎn)品內(nèi)部的一致性而生,不管是色彩間距、還是組件模塊,保持一致性不僅能讓用戶感覺(jué)使用的是同一個(gè)產(chǎn)品,還有助于品牌傳播,給用戶留下一定的印象。
對(duì)于業(yè)務(wù)非常復(fù)雜的大型產(chǎn)品,雖然各元素組件樣式繁多,但會(huì)從視覺(jué)風(fēng)格和交互形式上來(lái)確保產(chǎn)品的一致性,這都可以減少用戶的思考負(fù)擔(dān)和學(xué)習(xí)成本。
雖然很多產(chǎn)品都在呼吁創(chuàng)新、去同質(zhì)化,但差異化較大的設(shè)計(jì)雖然達(dá)到了去同質(zhì)化的目的,卻給用戶增加了更多的學(xué)習(xí)及思考成本。這里意思請(qǐng)大家不要誤解,并不是說(shuō)不去創(chuàng)新,而是除非你的產(chǎn)品有足夠的影響力,對(duì)于較大的變動(dòng),企業(yè)能承擔(dān)起試錯(cuò)成本、以及增加了額外學(xué)習(xí)成本可能造成的用戶流失,否則只能進(jìn)行一些小的改動(dòng),循序漸進(jìn)的跟隨主流。
對(duì)于同類型的產(chǎn)品,我們依然需要參考競(jìng)品的一些設(shè)計(jì)形式,如下圖是音樂(lè)APP的播放頁(yè)面,其主要功能的優(yōu)先級(jí)排列、頁(yè)面布局基本相同,即便是創(chuàng)新也是從設(shè)計(jì)風(fēng)格、氛圍以及微動(dòng)效等方面做出差異化。
先舉個(gè)例子,之前有不少產(chǎn)品引用費(fèi)茨定律“任意一點(diǎn)移動(dòng)到目標(biāo)中位置距離越短,所花費(fèi)的時(shí)間就越少”這一原則,于是將左上角的返回按鈕搬到了左下角(側(cè)滑返回操作沒(méi)有影響),沒(méi)錯(cuò),對(duì)于現(xiàn)在的大屏手機(jī)來(lái)說(shuō),返回效率確實(shí)提升了,但卻違背了用戶的使用習(xí)慣,增加了誤操作的可能性。
返回按鈕放置左上角,與絕大多數(shù)產(chǎn)品保持一致的使用習(xí)慣,這意味著用戶只需付出更少的學(xué)習(xí)成本甚至無(wú)需學(xué)習(xí)即可快速上手。
“系統(tǒng)要么消除容易出錯(cuò)的情況,要么檢查它們,并在用戶采取行動(dòng)之前向用戶提供確認(rèn)選項(xiàng)”--尼爾森。
用戶的很多操作都是比較隨意、無(wú)意識(shí)性的,也因此造成了一些不可挽回的錯(cuò)誤。系統(tǒng)應(yīng)該在用戶出錯(cuò)之前采取一定的措施,這并沒(méi)有多么復(fù)雜,或許只是一個(gè)走心的設(shè)計(jì),如使用引導(dǎo)用戶、溫馨提示、有效控制等方式以減少錯(cuò)誤的發(fā)生。
主動(dòng)引導(dǎo)的目的就是為了給用戶提供明確的路徑,減少錯(cuò)誤操作。很多APP首次下載或更新迭代之后就會(huì)提供新手引導(dǎo),還有表單的占位符提供的格式規(guī)范、內(nèi)容描述也是如此。
在用戶操作時(shí),系統(tǒng)對(duì)用戶錄入的已有信息進(jìn)行預(yù)判并提供相匹配的內(nèi)容讓用戶選擇,也是一種常用的防錯(cuò)方式。如搜索聯(lián)想詞、商品錯(cuò)誤文字自動(dòng)修正等。
對(duì)于一些較為敏感、可能存在危險(xiǎn)或不可逆轉(zhuǎn)的操作時(shí),系統(tǒng)需要提供二次確認(rèn)引起用戶注意,以起到警示作用。例如注銷賬號(hào)、刪除某些內(nèi)容或中途退出流程,都會(huì)有彈窗提醒用戶,避免誤操作帶來(lái)不必要的損失。
從表面來(lái)看,限制用戶似乎并不友好,但為了避免用戶錯(cuò)誤理解,利用明確的限制阻止用戶犯錯(cuò)也是一個(gè)不錯(cuò)的選擇。例如無(wú)效內(nèi)容置灰、未達(dá)到操作條件的限制,都能很好的防止用戶無(wú)效操作。
筆者曾使用過(guò)一個(gè)產(chǎn)品,在選擇出生年齡時(shí),往前的年份能滑到清朝時(shí)期(一百多歲玩不動(dòng)智能手機(jī)了),往后面能滑到今年之后的幾十年(我還沒(méi)出生呢),這并不是在質(zhì)疑設(shè)計(jì)的合理性,而是無(wú)效或過(guò)于冷門(mén)的選項(xiàng)越多,用戶可能會(huì)有選擇性困難「綜合癥」、也可能會(huì)提高隨意性以及選擇錯(cuò)誤的幾率,這對(duì)后期用戶數(shù)據(jù)分析的精準(zhǔn)度有很大影響。
適當(dāng)?shù)南拗撇僮鞣秶瑢?duì)產(chǎn)品來(lái)說(shuō)也是一個(gè)很好的防錯(cuò)策略。例如:美團(tuán)定酒店的日歷限制在半年以內(nèi)、在手機(jī)號(hào)碼表項(xiàng)中限制輸入11位數(shù)字等,都可以降低用戶出錯(cuò)的概率。
對(duì)于隨意性較強(qiáng)的用戶,通常都是「做多錯(cuò)多」,所以在部分場(chǎng)景下,如果對(duì)用戶的操作需求明確可控,可根據(jù)實(shí)際場(chǎng)景提供符合目標(biāo)的默認(rèn)值,以減少用戶操作成本。
添加銀行卡時(shí),輸入卡號(hào)后會(huì)自動(dòng)匹配對(duì)應(yīng)的銀行、購(gòu)物下單時(shí)系統(tǒng)也會(huì)自動(dòng)選擇一個(gè)默認(rèn)收貨地址,這些默認(rèn)值的存在都或多或少的減少了用戶操作步驟,即便不是用戶所需,也不會(huì)造成什么負(fù)擔(dān),這本該就是用戶完成任務(wù)的必要流程。
在數(shù)字信息輸入場(chǎng)景中,可以利用一些特定格式,不僅能減少出錯(cuò),還能有效避免將錯(cuò)誤信息帶入下一步流程。
例如,輸入手機(jī)號(hào)、銀行卡號(hào)、身份證號(hào)等,可以將幾個(gè)數(shù)字分為一組,以此類推,這樣更有利于用戶自查。
“通過(guò)使用對(duì)象、動(dòng)作和選項(xiàng)的可視化表達(dá),最大限度地減輕用戶的記憶負(fù)擔(dān)”--尼爾森。
在產(chǎn)品設(shè)計(jì)的時(shí)候,需保證組件、按鈕以及選項(xiàng)的可見(jiàn)性,用戶不需要去動(dòng)腦筋,產(chǎn)品應(yīng)該把用戶當(dāng)傻瓜對(duì)待,盡可協(xié)助其記憶。在特殊情況下,用戶離開(kāi)當(dāng)前頁(yè)面,產(chǎn)品可提供關(guān)鍵信息讓其確認(rèn),而不是讓用戶去回憶,徒增記憶負(fù)荷。
產(chǎn)品能做決定的就不要讓用戶去選擇、能讓用戶選擇的就不要讓他們自己輸入。其實(shí)選擇和輸入的操作成本相差巨大,很多用戶都不愿意在輸入上面花費(fèi)過(guò)多時(shí)間。
問(wèn)個(gè)比較現(xiàn)實(shí)的問(wèn)題,如果你申請(qǐng)信用卡的意愿不是很明確、在辦與不辦之間猶豫徘徊時(shí),有多少人是被幾頁(yè)超長(zhǎng)表單勸退的?需要用戶提供的信息我們無(wú)權(quán)刪減,但可以利用設(shè)計(jì)手段降低操作成本,如果將部分輸入框變成選擇框,讓任務(wù)變的更容易完成,用戶的抵觸心理自然也會(huì)降低。例如:微信添加銀行卡時(shí),手機(jī)號(hào)、銀行卡號(hào)都能從相應(yīng)的接口獲取,減少了很多操作。
與其讓用戶逐步完成任務(wù),不如讓用戶只進(jìn)行一步簡(jiǎn)單操作,產(chǎn)品就智能化的將信息提取出來(lái)、自動(dòng)拆分并送到用戶手中,不僅節(jié)省了大量的交互步驟和瀏覽時(shí)間,也降低了用戶因自行輸入信息可能出錯(cuò)而帶來(lái)的不可控感,大大提高了產(chǎn)品的易用性。
新建收貨地址時(shí),將地址信息粘貼至輸入框,產(chǎn)品即可自動(dòng)拆分省/市/區(qū)、詳細(xì)地址及個(gè)人信息;綁定信用卡時(shí),只需掃描卡片就能自動(dòng)提取卡號(hào)、開(kāi)戶行、有效期等信息。
特別是一些隱藏的交互操作,一定要使用用戶最熟悉的方式,避免浪費(fèi)時(shí)間去回憶或手動(dòng)試錯(cuò),要保證用戶在最短的時(shí)間內(nèi)有效識(shí)別、理解。
例如,左滑列表中的某個(gè)內(nèi)容可進(jìn)行刪除操作、屏幕邊緣右滑返回上一頁(yè)、雙擊短視頻點(diǎn)贊等。
眾所周知,文字表意明確,也是最能讓用戶理解的方式,不過(guò)它的信息傳達(dá)效率遠(yuǎn)遠(yuǎn)不如圖形,所以在眾多UI設(shè)計(jì)中,有圖標(biāo)的出現(xiàn),就會(huì)搶占信息組中的主視覺(jué),但這并不代表可以完全替代文字,很多時(shí)候,我們應(yīng)該讓文字成為輔助的存在,以加深用戶的理解。圖標(biāo)+文字組合表意更加明確,能迎合更廣泛的用戶群體,避免少數(shù)用戶產(chǎn)生疑惑。
這里要說(shuō)明一點(diǎn),圖標(biāo)并非不能單獨(dú)出現(xiàn),而是要慎用。就如搜索圖標(biāo),全球99%都在用這個(gè)放大鏡造型,無(wú)可厚非。花瓣APP底部標(biāo)簽欄也使用了純圖標(biāo)形式,因?yàn)樗鎸?duì)的用戶絕大多數(shù)都是設(shè)計(jì)師,而設(shè)計(jì)師對(duì)圖標(biāo)的識(shí)別和理解自然沒(méi)什么難度。
針對(duì)一些需要用戶記住或?qū)τ脩魜?lái)說(shuō)較為重要的信息,即便已進(jìn)入下一步流程,產(chǎn)品有必要二次呈現(xiàn)用給用戶確認(rèn),避免用戶回憶(想不起來(lái)就會(huì)離開(kāi))。
在購(gòu)物下單頁(yè)面,會(huì)提供商品的關(guān)鍵信息給用戶確認(rèn);部分產(chǎn)品的表單任務(wù)完成后,點(diǎn)擊提交,也會(huì)彈出之前輸入的內(nèi)容給用戶自查。
系統(tǒng)應(yīng)該提供用戶最近的訪問(wèn)項(xiàng),幫助他們提供未完成或想要重復(fù)完成的任務(wù),即便是跨系統(tǒng)、設(shè)備,再次使用也不用來(lái)回調(diào)整,歷史記錄功能便是這個(gè)需求的最佳體現(xiàn)。
例如騰訊視頻的觀看歷史模塊,按照時(shí)間排序,提供了看過(guò)的內(nèi)容以及進(jìn)度,點(diǎn)進(jìn)去之后會(huì)從上次退出時(shí)的位置節(jié)點(diǎn)接著播放,視頻、音樂(lè)、閱讀類應(yīng)用都是如此。
“好的產(chǎn)品需要同時(shí)兼顧新用戶和資深用戶的需求,對(duì)新用戶來(lái)說(shuō),需要功能明確、清晰,對(duì)于老用戶需要快捷高效使用高頻功能。不可迎合某一種用戶,把不必要的信息占據(jù)重要部分”--尼爾森。
靈活高效原則旨在滿足多樣化的使用群體,通過(guò)對(duì)他們的使用場(chǎng)景、任務(wù)流程進(jìn)行深挖,讓其在最短的路徑以最快的速度完成目標(biāo)需求。
系統(tǒng)要同時(shí)照顧新老用戶的使用體驗(yàn),對(duì)于新手用戶,要盡量降低學(xué)習(xí)成本,能讓其快速上手是留住他們的必要手段。而對(duì)老用戶來(lái)說(shuō),對(duì)產(chǎn)品的信任度有一定的基礎(chǔ),能快捷高效、心情愉悅的使用至關(guān)重要。
沒(méi)有什么能比提供快捷操作更能節(jié)省時(shí)間成本了,但凡使用過(guò)手機(jī)、電腦辦公的用戶都用該知道Ctrl+C、Ctrl+V、Ctrl+S這三組合的神奇之處,提升的效率真的不是一星半點(diǎn)兒。
在UI設(shè)計(jì)中,很多快捷的入口、操作方式都相對(duì)降低了用戶使用門(mén)檻,例如快捷登錄(QQ、微信、手機(jī)號(hào)一鍵登錄)減少操作步驟,節(jié)省用戶很多時(shí)間;另外,在一些產(chǎn)品截圖后就會(huì)彈出分享、反饋入口,這也是通過(guò)行為預(yù)判為用戶提供便捷操作的體現(xiàn)。
一些頻繁使用的功能,可在不同的頁(yè)面重復(fù)顯示,當(dāng)用戶有使用需求時(shí),能隨時(shí)通過(guò)就近的操作入口進(jìn)入。微信的掃一掃在會(huì)話列表、通訊錄、個(gè)人信息等頁(yè)面都有操作入口,非常方便;支付寶首頁(yè)的花唄、借唄、芝麻信用等功能在我的頁(yè)面幾乎都重復(fù)了一遍,觸手可及,對(duì)產(chǎn)品轉(zhuǎn)化也有很大的幫助。
「功能自定義」意味著用戶可以對(duì)自己常用或喜歡的功能進(jìn)行隨意排列、增減,兼顧了不同用戶對(duì)不同功能的使用需求,提高產(chǎn)品的靈活性。
支付寶讓用戶根據(jù)自己的喜好選擇13個(gè)常用功能放在首頁(yè),操作起來(lái)更加方便,滿足了用戶的自定義需求。網(wǎng)易云音樂(lè)則更個(gè)性化,不僅能對(duì)功能模塊、底部導(dǎo)航自定義,系統(tǒng)還提供了3種不同的版式風(fēng)格,對(duì)于這種靈活的調(diào)整,不管是“蘿卜”還是“青菜”,總有一款是你的最愛(ài)。
提供默認(rèn)選項(xiàng)上述有提到過(guò),通過(guò)減少多余操作,不僅對(duì)防止用戶出錯(cuò)有極大的幫助,對(duì)于提升任務(wù)完成效率也尤為明顯。
不同的用戶就有不同的需求、不同的喜好、不同的使用習(xí)慣,產(chǎn)品需要做到千人千面,以最大化的程度滿足多種用戶群體。
這種類似的案例非常之多,且不說(shuō)各大電商通過(guò)背后隱藏的算法為各種用戶匹配不同的內(nèi)容,就說(shuō)明面上能看到的如關(guān)愛(ài)模式、鄉(xiāng)村模式、青少年模式等,還有高德地圖搜索框上/下位置調(diào)整、京東商品頁(yè)的宮格樣式/列表樣式等,都在為滿足絕大多數(shù)的用戶的使用需求而付出了最大努力。
“不要包含不相關(guān)或低頻次的信息/操作。頁(yè)面中的每個(gè)額外信息都會(huì)降低主要內(nèi)容的相對(duì)可見(jiàn)性”--尼爾森。
在設(shè)計(jì)頁(yè)面時(shí),需要注意信噪比(有效信息與無(wú)效信息的比例),處理好信息層級(jí),方便用戶能快速捕捉到自己想要知道、或產(chǎn)品想讓用戶知道的信息。因?yàn)橛脩舻淖⒁饬τ邢蓿魏蔚皖l次或不相關(guān)的信息都將成為視覺(jué)“噪音”,導(dǎo)致原本重要的信息被用戶忽略。
不管是模塊與模塊之間、還是單個(gè)模塊內(nèi)的各個(gè)類容,都有其一定的等級(jí)權(quán)重,劃分好信息層級(jí)能集中用戶注意力,更好的引導(dǎo)用戶操作,避免用戶分不清重點(diǎn)而徒增使用成本。需知什么內(nèi)容都想突出,其結(jié)果必定是什么也突出不了。
產(chǎn)品的視覺(jué)效果需要和諧統(tǒng)一,富有設(shè)計(jì)感、獨(dú)具一格的效果能給人眼前一亮個(gè)感覺(jué)。這就是為什么很多小而美產(chǎn)品能頻頻登上App Store的榜單的原因。例如,躺平(已下線)、即刻、小宇宙等應(yīng)用獲得了用戶的一致好評(píng)。
不管一個(gè)頁(yè)面中信息量的多少,但是一定要有“主角”,很多時(shí)候,我們會(huì)通過(guò)添加次要信息或背景裝飾來(lái)襯托這個(gè)“主角”的存在。設(shè)計(jì)之前一定要權(quán)衡視覺(jué)重點(diǎn),應(yīng)弱化或去除頁(yè)面中的無(wú)關(guān)信息,減少信息“噪音”的干擾,使用體驗(yàn)?zāi)艿玫搅己玫奶嵘?
所有的設(shè)計(jì)都應(yīng)該遵循產(chǎn)品設(shè)計(jì)四大原則,即親密、對(duì)齊、重復(fù)、對(duì)比。很多時(shí)候,頁(yè)面設(shè)計(jì)不夠精致,總感覺(jué)差點(diǎn)意思,但又找不出真正的原因,就是基礎(chǔ)原則沒(méi)有掌握好,或許只是間距、字號(hào)、大小的一個(gè)微調(diào),即可達(dá)到意想不到的視覺(jué)效果。關(guān)于設(shè)計(jì)四原則,暫不多做贅述,后續(xù)會(huì)單獨(dú)出具詳細(xì)的文章。
“錯(cuò)誤的信息應(yīng)該用通俗易懂的語(yǔ)言表達(dá),較準(zhǔn)確的指出問(wèn)題,并且提出解決方案。避免通過(guò)代碼等用戶難以理解的形式”--尼爾森。
筆者相信有很多人見(jiàn)過(guò)這樣的問(wèn)題,在遇到網(wǎng)絡(luò)問(wèn)題時(shí)過(guò)了幾分鐘后的頁(yè)面還是一片白板、很多錯(cuò)誤反饋就顯示什么錯(cuò)誤404/505/321之類的代碼,真心搞不懂,很讓人抓狂。
用戶在使用過(guò)程中,有時(shí)候出錯(cuò)不可避免,系統(tǒng)應(yīng)該通過(guò)明確的提示性文字或插圖來(lái)提醒用戶,并附上解決方案,而不是給一堆看不懂的代碼草草了事,需要幫助用戶從識(shí)別、診斷、并從錯(cuò)誤中恢復(fù)過(guò)來(lái)。
用戶在操作前(預(yù)判)、操作中、操作后都可能出錯(cuò),系統(tǒng)可通過(guò)前端驗(yàn)證(優(yōu)先使用)和后端驗(yàn)證明確告知出錯(cuò)的原因以及解決方法。
例如手機(jī)號(hào)碼表單項(xiàng)都是限制在11位數(shù),如果用戶手滑少輸了一位數(shù)字,在離開(kāi)輸入框時(shí),系統(tǒng)應(yīng)及時(shí)通過(guò)前端驗(yàn)證告知用戶。這里要吐槽一點(diǎn),一些產(chǎn)品是等用戶完成所有表單內(nèi)容并提交后才統(tǒng)一反饋,這并不太友好。還有產(chǎn)品在用戶未達(dá)到表單要求的情況下,始終將下一步按鈕處于置灰狀態(tài),期間并沒(méi)有任何提示,這就需要用戶反復(fù)查看每個(gè)表單項(xiàng)的內(nèi)容是否達(dá)標(biāo),無(wú)故浪費(fèi)大量的時(shí)間成本,實(shí)則不可取。
當(dāng)網(wǎng)絡(luò)出現(xiàn)問(wèn)題或長(zhǎng)時(shí)間無(wú)響應(yīng),系統(tǒng)會(huì)給出明確的提示,并提供重新加載、刷新、設(shè)置網(wǎng)絡(luò)等操作入口,讓用戶知道問(wèn)題出現(xiàn)的原因以及如何解決。
當(dāng)錯(cuò)誤已經(jīng)發(fā)生,系統(tǒng)應(yīng)盡可能的幫助用戶從錯(cuò)誤中恢復(fù),將損失降到最低。
發(fā)布微信朋友圈,如果內(nèi)容有問(wèn)題刪除后,系統(tǒng)會(huì)提供“重新編輯”入口,并保留了原先所有內(nèi)容,能很輕松的、以最小的操作成本就完成了二次編輯。iPhone相冊(cè)中的回收站會(huì)保留30天內(nèi)所刪除的內(nèi)容,方便隨時(shí)恢復(fù),這都用戶犯錯(cuò)后能及時(shí)止損的最佳體現(xiàn)。
“如果系統(tǒng)能讓用戶不需要閱讀文檔就會(huì)使用那是最好的,但通常情況下還是需要幫助文檔的。任何信息應(yīng)該容易被搜索,且專注于用戶的目標(biāo)任務(wù),并列出具體的步驟來(lái)告知用戶”--尼爾森。
雖然很多時(shí)候,用戶并不需要幫助或稍加摸索便能上手,但要考慮到意外情況的發(fā)生,系統(tǒng)有必要提供一份幫助文檔,方便用戶有需要時(shí)能隨時(shí)了解,以便接下來(lái)專注于完成任務(wù)。
能進(jìn)行清晰直觀、符合用戶習(xí)慣的設(shè)計(jì)再好不過(guò)了,無(wú)需任何幫助,用戶也能順暢的完成任務(wù)。如組件庫(kù)的打造,就是為了讓設(shè)計(jì)更簡(jiǎn)單、用戶更容易理解與使用。
對(duì)于那些用戶只需花費(fèi)少量的時(shí)間就能熟練使用的功能,產(chǎn)品為了實(shí)現(xiàn)快速轉(zhuǎn)化或給少數(shù)的特定人群提供幫助,會(huì)提供一次性幫助。如首次進(jìn)入App的新手引導(dǎo)、迭代后的部分新功能指引等。
對(duì)于較為復(fù)雜的操作流程或存在必須要用戶注意的問(wèn)題,產(chǎn)品會(huì)在必要的位置提供說(shuō)明,方便用戶在需要時(shí)能及時(shí)獲得幫助。
例如粵通卡ETC激活流程,對(duì)于這種冷門(mén)卻又必須要用的功能,即便使用過(guò)的老用戶也未必能記住所有步驟,所以每次進(jìn)入激活功能,首先看到的便是操作指引。其他如綁定信用卡時(shí),輸入簽約手機(jī)號(hào)、安全碼,對(duì)應(yīng)位置都有固定的幫助入口。
對(duì)于一些常見(jiàn)的使用問(wèn)題,系統(tǒng)會(huì)提供一個(gè)「幫助中心」功能入口,將所有問(wèn)題集合在一起,方便用戶隨時(shí)查看。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( axecq.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://axecq.cn