掌握這20條用戶體驗設(shè)計原則,助力設(shè)計成長!

2022-3-14    seo達人


1.以用戶為中心 

這是最常被提及的用戶體驗設(shè)計基礎(chǔ),當涉及到產(chǎn)品設(shè)計決策時,提醒我們要學會使用同理心,而不是僅憑個人的想法或意見。

真正好的用戶體驗設(shè)計是為用戶量身打造的,用戶的意見、痛點、愿望、偏好和需求對產(chǎn)品來說至關(guān)重要,所以在項目初始階段需要投入大量的時間和精力去了解用戶。

圖片

用戶體驗研究重點是了解用戶,為接下來的產(chǎn)品設(shè)計做準備。以用戶為中心的設(shè)計理念是設(shè)計師迎合用戶的需求,區(qū)分了設(shè)計任何人都可以使用的產(chǎn)品和為目標用戶設(shè)計的產(chǎn)品。

一款特定的產(chǎn)品需要面對不同的目標群體,前期研究中需要了解目標人群需要什么并在產(chǎn)品中反映出來,這是針對性很強的設(shè)計研究。

 

2.了解信息架構(gòu)

可能很多人對信息架構(gòu)的定義很模糊,這里舉個例子來具象說明一下信息架構(gòu)的含義。

例如在一款產(chǎn)品中,如果把所有內(nèi)容都堆到一個列表或頁面中,可能我們將無法使用這款產(chǎn)品,所以我們看到大多數(shù)的App和網(wǎng)站都包含很多的導航和頁面結(jié)構(gòu),按照內(nèi)容重要程度有序地來組織內(nèi)容。

信息體系結(jié)構(gòu)的最終目標是幫助用戶理解他們在看什么,并幫助他們找到需要尋找的內(nèi)容。

圖片

信息架構(gòu)在制作線框圖或原型之前完成,因為它是產(chǎn)品的基礎(chǔ),有助于設(shè)計師考慮什么功能是最重要的,哪些是用戶最需要的以及哪些次要內(nèi)容可以隱藏起來等。

這種結(jié)構(gòu)與產(chǎn)品的導航設(shè)計密切相關(guān),有助于將用戶引導到正確的位置。導航和信息架構(gòu)都試圖讓用戶以最少的認知努力來完成操作。

信息架構(gòu)的設(shè)計不當會造成重大故障甚至可能危及整個產(chǎn)品。如果用戶在使用產(chǎn)品時找不到任何想要的內(nèi)容,點擊任何元素都沒有反應(yīng),會給用戶帶來很糟糕的使用體驗。

 

3.考慮使用場景

沒有場景,任何設(shè)計都很難生效。設(shè)計師在項目開始時會投入時間去了解用戶面臨的問題以及圍繞這些問題的背景。

圖片

這條原則有助于設(shè)計師考慮還有哪些因素會影響用戶和產(chǎn)品,很多產(chǎn)品設(shè)計會為用戶提供一些有助于消除使用摩擦的操作提示。

例如在設(shè)計表單時,會盡可能的添加輸入提示,最大程度地減少用戶出錯的機會。

 

4.了解一致性及其重要性

保持一致性是用戶體驗設(shè)計的關(guān)鍵原則。擁有一致設(shè)計的產(chǎn)品可以更快地被新用戶接受,因為用戶不需要再次學習如何操作,他們會回憶起之前的操作習慣并將其作為指導,這也解釋了為什么同類型的產(chǎn)品例如電商類App頁面設(shè)計的很相似。

保持一致意味著在需要時可以重復使用某些UI組件,并在整個產(chǎn)品中保持一致的行為。例如當點擊或懸停在按鈕上面時,所以按鈕的狀態(tài)應(yīng)該是一致的。

圖片

從邏輯上講,產(chǎn)品越大,這種一致性會變得越來越有挑戰(zhàn)性,這促使許多設(shè)計團隊創(chuàng)建自己的設(shè)計系統(tǒng)。一款產(chǎn)品的學習曲線越長越陡,放棄的用戶就會越多,在市場營銷中,這通常被稱為銷售漏斗中的漏洞。

 

5.給予用戶適當?shù)目刂茩?quán)

這條原則意味著用戶希望能控制產(chǎn)品,無論是完成任務(wù)還是定制滿足他們需求的內(nèi)容。

在設(shè)計過程中一直試圖給用戶盡可能多的控制權(quán),例如允許用戶撤消操作、更改設(shè)置、自定義UI外觀、創(chuàng)建快捷方式等。

圖片

需要注意的是,當提供太多選項或用戶太依賴于自己的選擇時,用戶可能會不知所措,造成所謂的選擇悖論。所以在設(shè)計時要了解用戶樂于掌控的余地,不能讓用戶感到使用壓力。

 

6.把可用性放在首位

在整體上看,建立高標準的可用性是為用戶做的最好的事情,有助于檢查用戶是否能夠輕松地完成任務(wù)、產(chǎn)品是否正常運行以及是否完成工作。

圖片

可用性的重要之處在于要理解可用性的靈活性和重要性。

 

7.了解用戶測試

結(jié)合可用性的概念,我們還要進行用戶測試,這是設(shè)計師對工作進行測試的方式,對新的產(chǎn)品來說至關(guān)重要。

當設(shè)計思想和理念被轉(zhuǎn)化為有形的原型時,設(shè)計師要觀察真實的用戶是如何與之交互的,可以通過許多不同的方式例如簡單的A/B測試到全面的審核測試等來實現(xiàn)。

圖片

測試通常分幾輪進行,團隊在向原型添加更多細節(jié)之前驗證每個步驟。隨著測試結(jié)果的出現(xiàn),設(shè)計也隨之發(fā)生了變化。

如果發(fā)生更改,將會進行新一輪的測試,通過這個過程,設(shè)計團隊可以改進他們的工作,直到達到可用性標準。

 

8.少即是多

在創(chuàng)造力和創(chuàng)造獨特事物的渴望中,很多設(shè)計師很容易無意中弄亂產(chǎn)品界面甚至產(chǎn)品本身。

功能過多的產(chǎn)品可能會失去焦點并削弱吸引力。具有太多元素的頁面會變得充滿視覺沖擊,但也會給用戶帶來負面體驗,在設(shè)計時要學會克制并優(yōu)先考慮真正關(guān)鍵的部分。

另外手機端的屏幕空間非常小,創(chuàng)建一個有效的布局,想出巧妙的方法來隱藏次要元素并創(chuàng)建一個令人愉悅的界面需要付出很大的努力和創(chuàng)造力。

 

9.視覺層次

視覺層次是向用戶傳達產(chǎn)品中元素重要性的方式。良好的層次結(jié)構(gòu)有助于用戶視線在界面上移動,并立即了解最重要的內(nèi)容以及這些內(nèi)容與其他部分的關(guān)系。

視覺層次結(jié)構(gòu)與布局設(shè)計緊密相連,幫助用戶消化所接觸到的信息。

圖片

創(chuàng)建層次結(jié)構(gòu)從概念的草圖開始,一直持續(xù)到完成設(shè)計。例如發(fā)送按鈕通常會用綠色而是不紅色,而次要按鈕會顯示為灰色或與背景混合,并顯示“撤消”或“返回”。

 

10.了解用戶的心智模型

為用戶創(chuàng)建心智模型是嘗試使用同理心的一種方式,是幫助設(shè)計師從用戶的角度看待問題的工具。

圖片

做到準確就是直觀的產(chǎn)品,用戶不需要投入精力就可以使用它,而錯誤的思維模型會導致一些問題,例如界面混亂、高昂的交互成本。

為了匹配用戶的心智模型,可以采用多種不同類型的研究方法,常見的方法包括卡片分類、決策樹、對用戶行為的密切觀察,或者使用大量的數(shù)據(jù)來建立關(guān)鍵用戶的心理模型。

 

11.設(shè)計中的講故事

講故事的方式更加直觀,利用圖像、視頻、動畫和文本等元素讓整個頁面與用戶對話。用戶體驗設(shè)計中的視覺敘事是為了喚起用戶的情感,給用戶留下持久的印象。

圖片

想出一種可視化的方式來傳達復雜的內(nèi)容具有挑戰(zhàn)性,但同時也是有益的,可以更好地接近用戶并將其作為提高產(chǎn)品可學習性的方法。

 

12.不要直接跳到高保真原型上

高保真原型是設(shè)計項目的最終目標,但是直接使用原型軟件不斷添加各種頁面細節(jié)是錯誤的操作。

圖片

避免直接出高保真的主要原因是因為這樣做的成本會更高。在沒有任何用戶研究和測試的情況下,一款產(chǎn)品無論具有多少的細節(jié)都有可能面臨不符合用戶使用的情況。

 

13.可訪問性測試很重要

不僅要檢查關(guān)鍵用戶是否可以流暢地使用產(chǎn)品,還應(yīng)該檢查其他所有用戶例如少數(shù)群體等是否都能夠正常使用產(chǎn)品。

圖片

事實上,殘疾人和其他用戶一樣需要數(shù)字產(chǎn)品,但很多產(chǎn)品在設(shè)計時并沒有考慮到這些群體,但這也提供了一個機會,為所有用戶提供一個可以依賴的好產(chǎn)品。

 

14.熟悉并在用戶體驗設(shè)計中使用

我們知道為用戶提供一致的設(shè)計有助于克服學習曲線,同時為用戶提供熟悉的東西也有助于縮短學習曲線。

例如,大多數(shù)用戶都會立即識別某些UI組件(漢堡菜單/單選按鈕),這意味著他們會本能地知道這些組件代表什么意思或者如何操作。

圖片

使用用戶已經(jīng)熟悉的東西并不一定會讓產(chǎn)品的獨特性消失,有經(jīng)驗的設(shè)計師會利用這種熟悉性來來創(chuàng)造一些獨特的設(shè)計,同時也是直觀的,不需要太多努力就可以使用。

設(shè)計一個完全不依賴熟悉度的產(chǎn)品可能是具有風險的行為,因為它很容易讓那些不熟悉產(chǎn)品的用戶超負荷,形成巨大的學習曲線,增加用戶負擔。

 

15.了解交付成果的力量

可交付成果是可以在整個團隊中交付的內(nèi)容,包括用戶畫像、心智模型、用戶旅程以及線框圖和原型等,是一種有形和具體的表現(xiàn)。

可交付成果是用戶體驗設(shè)計原則,可以幫助設(shè)計團隊和其他利益相關(guān)者理解和交流概念。

圖片

▲ 用戶畫像可以捕捉理想用戶,并提供可以相關(guān)聯(lián)的真實面孔,是一種指導設(shè)計的工具。用戶旅程圖幫助設(shè)計師了解用戶完成任務(wù)需要的具體步驟,有助于確保這些步驟確實可以輕松執(zhí)行,并且整個過程很流暢。

這些交付成果服務(wù)于關(guān)鍵功能,設(shè)計師需要在整個項目中都依賴它們,不斷轉(zhuǎn)換為用戶可以與之交互的真實有形的設(shè)計。

 

16.專業(yè)的原型設(shè)計工具

用戶體驗設(shè)計的過程不是線性的,而是一個循環(huán)。無論創(chuàng)建什么樣的產(chǎn)品,都需要專業(yè)的原型工具,將基本框架放在一起,然后添加可能需要的所有細節(jié)。

圖片

從邏輯上講,設(shè)計團隊的具體需求會因團隊而異,但一些關(guān)鍵功能例如團隊協(xié)作、需求管理、交互設(shè)計和開發(fā)移交等,對于大多數(shù)團隊來說是必要的。

 

17.精心管理產(chǎn)品需求

一切都從收集需求開始,然后慢慢創(chuàng)建關(guān)鍵列表。雖然簡單地列出一個列表聽起來很容易,但隨著項目的進展,要保持列表的條理性確實是一個挑戰(zhàn)。

圖片

除了創(chuàng)建需求和檢查需求之外,還有一個問題就是調(diào)整需求,需要從設(shè)計、技術(shù)和業(yè)務(wù)各個方面來處理各種需求,還要確保這些需求之間沒有相互矛盾。

 

18.了解移動和網(wǎng)頁產(chǎn)品之間的差異

網(wǎng)頁端和移動端產(chǎn)品最明顯的區(qū)別是屏幕尺寸,這意味著所有的視覺層次結(jié)構(gòu)和信息架構(gòu)都將從Web到App發(fā)生變化。

圖片

移動端產(chǎn)品會有更多影響設(shè)計決策的因素,例如設(shè)備的操作系統(tǒng)、使用產(chǎn)品的環(huán)境等。了解移動端產(chǎn)品在導航設(shè)計、用戶流程等關(guān)鍵方面的差異是至關(guān)重要的用戶體驗設(shè)計原則。

 

19.利用UX設(shè)計模式

幾乎所有的產(chǎn)品都專注于設(shè)計模式,它們可靠、易于查找并通過減少設(shè)計時間來為項目增加實用性。

圖片

▲ 當用戶在谷歌搜索中輸入的內(nèi)容有問題時,谷歌會提供一個相關(guān)的搜索提示,輔助用戶進行精確地搜索,解決用戶使用不同方式在搜索欄中傳達他們正在尋找的內(nèi)容的問題。

 

20.使用合適的工具才能有效

擁有單一的內(nèi)容來源可以為團隊帶來清晰性和高效性,如果線框和原型分散在多個渠道中,這種內(nèi)容的集合就會變得很難達成。

圖片

通過合適高效的工具能夠避免產(chǎn)品在到達終點時遇到各種各樣的可用性問題,防止產(chǎn)品細節(jié)沒有表現(xiàn)出來或者被忽略。

 

最后

通過這份用戶體驗設(shè)計原則的合集希望能夠讓你對這個領(lǐng)域有一個大致的了解。

沒有人知道用戶體驗設(shè)計在未來會引領(lǐng)我們走向哪里,不過我們可以確定,無論它帶給我們什么,肯定都會很有趣。

 


 

原文地址:Clip設(shè)計夾(公眾號)

作者:Clippp

轉(zhuǎn)載請注明:學UI網(wǎng)》掌握這20條用戶體驗設(shè)計原則,助力設(shè)計成長!

藍藍設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍藍設(shè)計m.sillybuy.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、

UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司


分享本文至:

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://m.sillybuy.com

存檔