如何通過按鍵顏色的對比來引導(dǎo)用戶

2015-09-29 16:41:00 來源:產(chǎn)品100 作者:佚名 人氣: 次閱讀 112 條評論

你有沒有過意外點錯按鍵的時候?當(dāng)用戶沒有被正確引導(dǎo)時往往會在模態(tài)窗口上做出錯誤的決策。很多模態(tài)窗口會在不明確不同行動區(qū)別的條件下就彈出來。不同按鍵之V間明確的顏...

如何通過按鍵顏色的對比來引導(dǎo)用戶

原作者:anthony

譯者:勵定洲

你有沒有過意外點錯按鍵的時候?當(dāng)用戶沒有被正確引導(dǎo)時往往會在模態(tài)窗口上做出錯誤的決策。很多模態(tài)窗口會在不明確不同行動區(qū)別的條件下就彈出來。

不同按鍵之間明確的顏色對比能夠引導(dǎo)用戶進(jìn)行正確的選擇。確實明確的行動指示則會讓用戶困惑并降低他們的效率。這甚至還可能導(dǎo)致他們做出產(chǎn)生惡劣影響的錯誤選擇。

正面、中性和負(fù)面行動

所有的按鍵都從屬于三個大類之下:

1 正面 —— 改變、發(fā)送、添加信息

2 中性 —— 不做改變、返回屏幕(比如“取消”)

3 負(fù)面 —— 刪除、重置、阻止信息

一個模態(tài)窗口上的幾個按鍵通常會集成好幾個行動。為了讓用戶能識別出它們之間的區(qū)別,每個按鍵的顏色對比是我們不可忽視的論題。

正面行為需要最高的對比度

正面行動時在模態(tài)窗口上最常見的一類。用戶需要知道那個行為能幫助他們完成任務(wù)。你應(yīng)該給這類行動按鍵最高的顏色對比度來幫助用戶去達(dá)成目的。放在它旁邊的其它任何中性或負(fù)面行動按鍵應(yīng)該具有較低的顏色對比。

如何通過按鍵顏色的對比來引導(dǎo)用戶

要想達(dá)到最高的對比度,給你的正面行為按鍵填充上一個冷色以及白色的文字。所謂冷色就是藍(lán)、綠和紫色等那些看著較為舒緩的顏色。而此類實色上的白色文字會比普通一般的黑字更加出挑些。

在正面行動旁邊的中性或負(fù)面行動按鍵不應(yīng)該被填充顏色。如果你那么做了會導(dǎo)致所有的按鍵之間的顏色對比變得太過相近。反之,如果只讓它們顯示邊框則能較好地凸顯正面行為按鍵。

當(dāng)負(fù)面行為按鍵擁有最高的對比度時

相較正面行動,負(fù)面行動不應(yīng)該具備更高的對比度。正面行動往往使用頻率更高且更安全,而對于負(fù)面按鍵,我們要確保用戶不會因為誤點而出錯。但是如果只有負(fù)面和中性兩種行動存在時,我們應(yīng)該賦予負(fù)面行動更高的對比。

如何通過按鍵顏色的對比來引導(dǎo)用戶

在這個案例中,你應(yīng)該給負(fù)面行動按鍵填充上暖色。所謂的暖色就是指紅、橙、黃等略刺眼的顏色。當(dāng)用戶看到它時,他們自然會明白點擊之前要三思。

賦予中性行動最低的對比度

中性行動永遠(yuǎn)不會在一個模態(tài)窗口里單獨存在,它總是會和正面或負(fù)面行動成對出現(xiàn)。它應(yīng)被賦予最低的顏色對比以不干擾到另外兩者。

如何通過按鍵顏色的對比來引導(dǎo)用戶

黑色邊框?qū)τ谟脩糇R別來說已經(jīng)足夠了。無填充顏色讓用戶的注意力不會從正面或負(fù)面行動上移開。

但注意了,不要灰化邊框+字,不然用戶很可能會誤認(rèn)為這是一個禁按(disable)的按鍵。再怎么樣他們也需要按鍵能和背景有所區(qū)別開來。

結(jié)語

如果顏色對比明晰的話,正面、中性和負(fù)面行動可以一塊出現(xiàn)。它們之間的對比越是清楚,用戶就能越快地完成任務(wù)。顏色在界面上扮演著非常重要的角色——不僅僅是美感,頁同樣是能引導(dǎo)用戶行動的一種強力工具。

    無相關(guān)信息