系統(tǒng)類(lèi)用戶(hù)界面設(shè)計(jì):UI界面設(shè)計(jì)10原則

0 評(píng)論 10677 瀏覽 16 收藏 7 分鐘

設(shè)計(jì)真正偉大的用戶(hù)界面沒(méi)有什么偉大的奧秘可言,做到保持簡(jiǎn)單易用就可以?!3趾?jiǎn)單易用’意味著不要讓用戶(hù)分心。好的UI讓用戶(hù)達(dá)成目標(biāo)后,相應(yīng)的培訓(xùn)和維護(hù)費(fèi)用便降低,同時(shí)獲得更開(kāi)心、滿(mǎn)足和高效率的用戶(hù)。

當(dāng)你面對(duì)一個(gè)全新的界面設(shè)計(jì)時(shí),別忘了上面的最基本的原則。下面細(xì)化介紹界面設(shè)計(jì)的9個(gè)原則:(原來(lái)有10個(gè)的但是十牌認(rèn)為可以精簡(jiǎn)為9個(gè)”)

1. 了解你的用戶(hù)
“關(guān)注用戶(hù):如果在關(guān)注競(jìng)爭(zhēng)對(duì)手還是用戶(hù)之間選擇,答案總是后者。工作總是首先從用戶(hù)開(kāi)始?!薄狫eff Bezos

了解用戶(hù),因?yàn)橛脩?hù)的目標(biāo)就是你的目標(biāo)。試著重述用戶(hù),了解他們的技能水平和體驗(yàn),以及什么是他們需要的。找出用戶(hù)偏好什么樣的界面,并觀(guān)察他們?cè)诮缑嬷腥绾尾僮鳌2灰詰儆谧分鹪O(shè)計(jì)趨勢(shì)的更新,或是不斷添加新的功能。首要的任務(wù)是關(guān)注你的用戶(hù),這樣才能創(chuàng)造出一個(gè)能讓用戶(hù)達(dá)成目標(biāo)的界面。

2. 重視模型
在系統(tǒng)軟件中用戶(hù)的大部分時(shí)間都消耗在界面操作中(數(shù)據(jù)錄入、數(shù)據(jù)修改、數(shù)據(jù)查閱、等等),這點(diǎn)與瀏覽為主的網(wǎng)站類(lèi)頁(yè)面的用戶(hù)操作完全不同。我們無(wú)需畫(huà)蛇添足,用戶(hù)希望在新創(chuàng)造的界面中看到那些、已有的、相似功能的、或遵循基本操作方式的軟件界面。所以利用已成慣例的UI模型,將使用戶(hù)感覺(jué)像在家中一樣熟悉。

3. 保持一致性
“用戶(hù)的期望越多的被正確驗(yàn)證,用戶(hù)就越覺(jué)得系統(tǒng)在自己掌控之中,從而也就更喜愛(ài)它(系統(tǒng))。”——Jakob Nielson

用戶(hù)需要一致性。操作的一致以及頁(yè)面風(fēng)格的一致。用戶(hù)需要知道一旦他們學(xué)會(huì)做某項(xiàng)操作,那么下次操作也同樣可行。語(yǔ)言、布局和設(shè)計(jì)是需要保持一致性的幾個(gè)界面元素。一致性的界面可以讓用戶(hù)對(duì)于如何操作有更好的理解,從而提升效率。

4. 運(yùn)用視覺(jué)等級(jí)
“設(shè)計(jì)師要從混亂中找到統(tǒng)一;要通過(guò)組織來(lái)操控文字、圖片,從而清晰地傳達(dá)設(shè)計(jì)意圖?!薄?Jeffery Veen

設(shè)計(jì)時(shí),要讓用戶(hù)把注意力放在最重要的地方。每一個(gè)元素的尺寸、顏色還有位置,它們?yōu)槔斫饨缑婀餐该髁说缆?。清晰的層?jí)關(guān)系將對(duì)降低外觀(guān)和操作的復(fù)雜性起到重要作用。

5. 提供反饋
界面要始終保持和用戶(hù)進(jìn)行溝通,不管當(dāng)他/她們的行為對(duì)錯(cuò)與否。隨時(shí)提示用戶(hù)的行為:狀態(tài)更改、出現(xiàn)錯(cuò)誤或者異常信息等。視覺(jué)提示或是簡(jiǎn)單文字提醒都能告訴用戶(hù),他/她們的行為是否能夠達(dá)到預(yù)期的結(jié)果。

6. 界面保持寬容
無(wú)論設(shè)計(jì)的界面多么的清晰明了,用戶(hù)都會(huì)犯錯(cuò)。所以在設(shè)計(jì)界面時(shí)應(yīng)當(dāng)考慮如何允許并寬容的對(duì)待用戶(hù)的錯(cuò)誤。例如要為用戶(hù)提供可以撤銷(xiāo)行為的方式和入口;對(duì)不同的輸入數(shù)據(jù)盡量寬容(沒(méi)人愿意只是因?yàn)樘铄e(cuò)了生日的格式而重頭再來(lái))。另外如果用戶(hù)的行為引起了一個(gè)錯(cuò)誤,在恰當(dāng)?shù)臅r(shí)機(jī)運(yùn)用信息顯示什么行為是錯(cuò)誤的,并確保他/她們明白如何防止這種錯(cuò)誤的再次發(fā)生。

7. 鼓勵(lì)用戶(hù)
一旦用戶(hù)在完成了關(guān)鍵操作,要及時(shí)告知用戶(hù)(彈出對(duì)話(huà)框等)。

值得注意的是把一個(gè)復(fù)雜的流程任務(wù)分解為若干簡(jiǎn)單步驟將會(huì)更顯繁復(fù)和讓人精力分散。所以無(wú)論正在執(zhí)行的任務(wù)有多么復(fù)雜和漫長(zhǎng)在界面上要保持流程的不間斷性。

8. 融入用戶(hù)的語(yǔ)言
“如果對(duì)每個(gè)像素、每個(gè)圖標(biāo)、每個(gè)字體都要考慮再三,那么同樣需要斟酌每個(gè)詞語(yǔ)。” —— Getting Real

所有的界面或多或少都有文字在上。讓文稿盡量口語(yǔ)化,減少華美辭藻的堆砌。為行為提供清晰、簡(jiǎn)明的標(biāo)簽,保持簡(jiǎn)樸的文字?jǐn)⑹觥S脩?hù)對(duì)此將會(huì)很贊賞,因?yàn)樗麄儾辉偈锹?tīng)命于他人的官腔——他們聽(tīng)到的是如朋友般甚至自己說(shuō)話(huà)的表述方式。

9. 保持簡(jiǎn)潔
“創(chuàng)造復(fù)雜的界面很簡(jiǎn)單,但如何將復(fù)雜的界面簡(jiǎn)化卻很難”—— Per Almqvist

正所謂:大音希聲、大象無(wú)形。優(yōu)秀的系統(tǒng)類(lèi)軟件頁(yè)面中,你看不到華而不實(shí)的UI修飾,更看不到那些用不到的設(shè)計(jì)元素。換而言之,必須出現(xiàn)的元素一定是簡(jiǎn)潔且有意義的。所以當(dāng)想著是否要在界面上加一個(gè)新功能或是新元素的時(shí)候,再思考一下:“用戶(hù)或者界面中真的需要這些么?”,“為什么用戶(hù)想要在這里當(dāng)這個(gè)小巧的動(dòng)態(tài)圖標(biāo)?”。是否只是因?yàn)槌鲇谧晕蚁埠煤晚?yè)面的漂亮而去添加這些元素??jī)?yōu)秀的UI工程師做出來(lái)的系統(tǒng)類(lèi)界面不會(huì)十分華麗,頁(yè)面中沒(méi)有任何分散用戶(hù)注意力打攪用戶(hù)操作的元素。甚至應(yīng)該達(dá)到在用戶(hù)使用系統(tǒng)的時(shí)候完全注意不到頁(yè)面和操作復(fù)雜的問(wèn)題,一切都應(yīng)該是順理成章的。

系統(tǒng)類(lèi)用戶(hù)界面設(shè)計(jì)的最終目的就是:將軟件設(shè)計(jì)成原本就應(yīng)該展現(xiàn)的那樣子。

來(lái)自:Kyle Sollenberger

整理:十牌

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒(méi)評(píng)論,等你發(fā)揮!