蘇州UI設(shè)計師培訓課程哪里好
UI設(shè)計師須要懂的7個按鈕設(shè)計原則
按鈕是UI和交互設(shè)計的基本元素,它們是用戶交互的時候,和系統(tǒng)進行溝通交流的核心組件,也是圖形化界面當中,**早出現(xiàn),也是**為常見的一種交互對象。
在下面的文章當中,將會回顧一下按鈕設(shè)計的7個基本原則,希望它們能夠在設(shè)計的時候幫到你。
面對著 UI 界面中的每個元素,用戶都需要對它們進行辨別和判斷,而這個過程越長,可用性其實就越差。
那么,用戶是如何判讀哪個元素是可交互的呢?
通常,用戶是基于以往的經(jīng)驗和視覺來對 UI 元素進行判斷,這就是為什么需要**合適的視覺符號來幫助用戶理解
(比如尺寸、形狀、顏色、陰影等),使得元素看起來像是按鈕。視覺符號為界面提供可供性。
不幸的是,在許多界面當中,按鈕的可發(fā)現(xiàn)性和指示性并不強,這使得交互發(fā)生的機率有所降低。
用戶會糾結(jié)于哪些可點擊,而哪些不可點擊,這個時候設(shè)計是否炫酷,就顯得不那么重要了。
即使視覺上界面設(shè)計得足夠突出,可用性很弱,會讓用戶陷入沮喪,產(chǎn)品也就不再具備可用性了。
為了確定按鈕是否可用,用戶在桌面端訪問網(wǎng)站的時候,需要將光標移動到元素上,檢查元素狀態(tài)是否會改變,才能判斷它是否是可點擊的。
而移動端用戶就麻煩了,根本沒有鼠標來執(zhí)行這樣的操作,元素能否點擊,只能都試一次,沒有其他更好的方法了。
不要假定你的 UI 中的元素對于用戶是顯而易見的。
在很多情況下,設(shè)計師會有意識地不將某些元素的交互性凸顯出來,因為他們會認為這些東西是顯而易見的。
但是事實并非如此,在設(shè)計 UI 的時候,應該牢記下面的事情。
作為設(shè)計師,是很容易搞清楚 UI 中哪些元素可交互,哪些不可交互,但是用戶并不清楚。
盡量在按鈕中采用用戶熟悉的設(shè)計。
以下是絕大多數(shù)用戶都熟悉的按鈕樣式:帶有矩形邊框的、填充有色彩的按鈕;帶有圓角矩形邊框的、填充色彩的按鈕;帶有陰影有色彩和內(nèi)容填充的按鈕;幽靈按鈕。
用戶對于頁面交互其實是有基本的感知和期望的,也就是說用戶對于按鈕的位置是有個基本的認知的。
不要讓用戶到處找按鈕,在用戶所期望的位置出現(xiàn)。
盡可能使用傳統(tǒng)的布局和標準的 UI 模式
所謂傳統(tǒng)的布局也就是貼合用戶經(jīng)驗的布局,用戶在瀏覽的時候會對于這樣「標準」的 UI 布局有明確的預期。
在對的位置看到了對的按鈕,整體更容易理解,自然也就可以**和界面進行交互了。
想要確認設(shè)計的可用性,只需要觀察用戶在使用過程中是否會**操作抵達你希望他們到達的位置,并且找到需要點擊的按鈕。
每個標簽上的文本標簽都應該盡量準確,簡明直接地介紹清楚它的真實功能。
用戶應該清楚他們點擊按鈕之后,會發(fā)生什么。舉個簡單的例子,想象一下,你不小心觸發(fā)了一個刪除按鈕,現(xiàn)在你看到了下面的報錯信息:
在這個界面當中,「OK」是一個相當模糊的表述,并沒有說明按鈕的作用。不論是「確定」還是「取消」,都沒有說清楚這個操作的真實含義。
尤其當刪除是一個存在潛在危險的操作,這個操作就更加需要精準的表述。
所以,這個地方兩個按鈕應該是「刪除」和「取消」更合適,而刪除應該用紅色進行區(qū)分標識,讓用戶意識到這個操作的重要性或者獨特性。
按鈕的大小應該反映出屏幕上這一元素的優(yōu)先級,更大的按鈕應該意味著更重要的交互。
按鈕優(yōu)先級
讓更重要的按鈕在視覺上就足以體現(xiàn)它的重要性。始終嘗試讓主要的按鈕更加突出,增加它的尺寸,并且使用高對比度的色彩來吸引用戶的注意力。
在 Dropbox 的界面上,設(shè)計師就是使用了大小和色彩的對比來創(chuàng)造優(yōu)先級。
讓按鈕適配用戶的手指
在許多 APP 當中,按鈕的設(shè)計太小了,這可能會導致用戶出現(xiàn)誤觸的情況。
舉個例子,比如「上一步/下一步」兩個按鈕應該如何安置方位呢?
通常而言,「上一步」是回卷操作,應該在左邊,而「下一步」則是前進操作,應該在右邊。
無論是設(shè)計網(wǎng)站還是 APP,請務必盡量考慮**重要的操作,控制好優(yōu)先級和復雜度。
7. 為按鈕交互提供視覺和音頻反饋
當用戶點擊按鈕的時候,他們更希望界面能夠給予適當?shù)姆答??;诓煌牟僮?,界面給予視覺或者音頻的反饋。
當用戶沒有收獲任何反饋的時候,他們可能會覺得界面沒有收到他們的操作,從而反復點擊,執(zhí)行多次不必要的操作。
想了解更多關(guān)于蘇州UI設(shè)計培訓資料,請咨詢:
咨詢聯(lián)系方式:13861302024(楊老師)或者QQ:2589245390 還可以直接在線咨詢
更多關(guān)于蘇州UI設(shè)計培訓的信息請點擊>> 蘇州UI設(shè)計培訓
更多關(guān)于蘇州UI設(shè)計師培訓班的信息請點擊>> 蘇州UI設(shè)計師培訓