交互設(shè)計技巧,創(chuàng)造好的用戶體驗(中)
因為唐納德?諾曼那些很棒的書,保持用戶界面設(shè)計的一致性可能是最廣為人知的原則之一了。當(dāng)用戶使用界面或者產(chǎn)品時,一個一致的UI或者交互是減少用戶學(xué)習(xí)量的一種很好的方法。當(dāng)我們按下按鈕,移動滑條的時候,我們希望這些交互元素看起來、用起來和被找到的方式是一樣的。一致性讓我們習(xí)慣了交互的方式,而一旦沒有了一致性,我們被迫進(jìn)入反復(fù)的學(xué)習(xí)中。一致性的界面元素可以通過多種方式來實現(xiàn),比如說:顏色,方向,行為,位置,大小,形狀,標(biāo)簽以及語言。然而在我們保持所有元素的一致性之前,請記住,保持元素的不一致性仍然是有價值的。不一致的元素或者行為的出現(xiàn)能從我們的習(xí)慣性潛意識的深處喚起我們的注意力——當(dāng)你有想要獲得關(guān)注的事情的時候,這是很有幫助的。試一試,但也要知道什么時候打破它。
28. 嘗試使用智能的默認(rèn)值,而不是要求額外的操作
使用智能默認(rèn)值,或者根據(jù)經(jīng)驗猜測預(yù)填表單字段能夠幫助用戶減少大量的工作量。這是一種節(jié)省用戶的寶貴時間,幫助用戶快速完成表單填寫的常用技巧。最糟糕的事情是從經(jīng)驗和轉(zhuǎn)化點出發(fā)要求用戶填寫的信息可能是他們在過去已經(jīng)反復(fù)多次提供過的。嘗試加載和顯示已經(jīng)驗證過的字段值,而不是每次都要求用戶填寫。用戶的工作量越少越好。
29. 嘗試遵守約定俗成的規(guī)則,而不是新建標(biāo)準(zhǔn)
統(tǒng)一的約定是一致性的好伙伴。如果我們在界面上保持元素的相似性,用戶使用起來就不會特別困難。另一方面,如果我們盡可能地保持多個界面上的元素的相似性,這就進(jìn)一步降低了用戶的學(xué)習(xí)成本。有了統(tǒng)一的UI約定,我們就知道屏幕右上角的叉是用來關(guān)閉窗口的。當(dāng)然這種約定隨著時間推移可能也會改變。不過記住,當(dāng)需要打破這種約定的時候,明確自己的意圖,并保證出發(fā)點是好的。
30. 嘗試聲明免于受損,而不是強調(diào)收益
我們都想贏,并且討厭失敗。根據(jù)說服力心理學(xué)的規(guī)則,我們更希望避免損失而不是獲得收益。這種規(guī)則也可以應(yīng)用于產(chǎn)品設(shè)計和宣傳中。宣傳產(chǎn)品能夠保護客戶現(xiàn)有的幸福、財富或社會地位,類似這種策略可能比嘗試向客戶提供客戶現(xiàn)在還沒有的、額外的東西要更有效。保險公司在宣傳的時候,是說我們可以在事故之后獲得賠償還是強調(diào)能保護我們現(xiàn)有珍視的東西呢?
31. 嘗試營造視覺層次,而不是平淡無奇
良好的視覺層次能區(qū)分重要的元素與不太重要的元素。視覺層次可以通過對齊、距離、顏色、色調(diào)、縮進(jìn)、字體大小、元素大小、填充、間距等方式來體現(xiàn)。當(dāng)這些視覺語言元素被正確運用,他們能在頁面上抓住用戶的注意力,提高頁面的可讀性。視覺層次結(jié)構(gòu)可以產(chǎn)生視覺摩擦,放慢我們從上到下瀏覽整個頁面的速度。通過一個好的視覺層次,我們可能會多花點時間在頁面上,最后的結(jié)果可能是我們注冊了更多的項目。就像是一次公路旅行,你可以走高速公路,很快地到達(dá)目的地(頁面底部);你也可以走風(fēng)景優(yōu)美的路線,放慢行程,沿路記住更多有趣的事物。給眼睛一個停留的地方。
32. 嘗試將相關(guān)的項目分組,而不是雜亂無序
將相關(guān)的項目分組在一起是增加產(chǎn)品可用性的一種基本方式。我們大多數(shù)人都知道刀和叉是放在一起的,同理打開和關(guān)閉功能通常也是在一起的。將相關(guān)的項目放在一起符合邏輯,也更符合用戶對產(chǎn)品的整體的認(rèn)知。用戶通常都不太樂意浪費時間到處找東西。
33. 嘗試進(jìn)行內(nèi)聯(lián)驗證,而不是提交后再報錯
當(dāng)處理表單時,通常在驗證到字段填寫不正確時就立馬給出錯誤提示,比填完提交之后再報錯要好得多。這里強調(diào)的交互模式當(dāng)然就是最著名的內(nèi)聯(lián)驗證了。當(dāng)驗證到錯誤的時候,將其立馬顯示出來(在輸入框右邊顯示出來),這樣上下文中出現(xiàn)錯誤時就可以立即被更正。另一方面,如果在表單提交之后再提示錯誤,就會強迫用戶回憶之前的操作步驟而做額外的工作。
34. 嘗試放寬輸入的條件,而不是要求嚴(yán)格的數(shù)據(jù)格式
標(biāo)簽(TAG) 設(shè)計知識 翻譯教程 ps基礎(chǔ)教程 設(shè)計 技巧 創(chuàng)造
上一篇:ps切片工具切圖技巧
下一篇:分享ps CC版本的省時技巧