按鈕設(shè)計(jì)的基本原則有哪些?按鈕設(shè)計(jì)基本原則包括:強(qiáng)化按鈕、凸顯按鈕位置、凸顯重要按鈕、把按鈕按照合理的順序放好、給按鈕匹配釋義標(biāo)簽、如果用戶(hù)不想做任何操作,不安排按鈕、弱化消極按鈕。按鈕創(chuàng)建并不是特別困難,但很容易在各類(lèi)產(chǎn)品中找到一些體驗(yàn)不好的按鈕設(shè)置影響用戶(hù)體驗(yàn)。
一、強(qiáng)化按鈕
強(qiáng)化按鈕邊緣或在按鈕下方添加陰影使得按鈕在視覺(jué)效果上更加強(qiáng)化,讓按鈕從背景上分離開(kāi);而且看起來(lái)可以吸引人去點(diǎn)擊。如果單詞周?chē)鷽](méi)有形狀和陰影包裹,那么沒(méi)有辦法感知其是一個(gè)按鈕;而且一個(gè)單詞是沒(méi)有辦法給予足夠的視覺(jué)提示,吸引用戶(hù)做點(diǎn)擊操作的;按鈕保持該有的按鈕的基本屬性。但許多網(wǎng)站設(shè)計(jì)師會(huì)擔(dān)心一個(gè)凌亂的舊的按鈕會(huì)破壞整體設(shè)計(jì)的格調(diào)。希望主操作按鈕設(shè)計(jì)得很棒,同時(shí)也包含基礎(chǔ)的按鈕屬性;而對(duì)于用戶(hù)來(lái)說(shuō),這是一個(gè)最重要的地方,所以需要讓用戶(hù)感知到帶有按鈕屬性的視覺(jué)愉悅。
二、凸顯按鈕位置
用戶(hù)體驗(yàn)中爭(zhēng)論最激烈的問(wèn)題之一是:“確定按鈕是在取消按鈕的左側(cè)或是右側(cè)?”。這邊還有一個(gè)關(guān)于按鈕組合同樣激烈的爭(zhēng)論,例如研究上一個(gè)和下一個(gè)按鈕的組合設(shè)計(jì)。你可以在很多地方找到這樣的爭(zhēng)論,而且觀點(diǎn)往往不一。設(shè)計(jì)只包含有確認(rèn)和取消兩個(gè)按鈕組合的對(duì)話框或彈窗。同時(shí)我也沒(méi)有在哪個(gè)地方看到過(guò)只包含有上一步和下一步兩個(gè)按鈕的頁(yè)面。在一個(gè)網(wǎng)頁(yè)中,總會(huì)包含有其他的元素,比如文本、圖像或者其他元素。
三、凸顯重要按鈕
在現(xiàn)有的產(chǎn)品中經(jīng)常看到界面上羅列了一堆相似的按鈕讓用戶(hù)去從中挑選,這個(gè)過(guò)程相當(dāng)有難度,需要耗費(fèi)用戶(hù)的認(rèn)知成本。為什么不給用戶(hù)一點(diǎn)提示,讓主按鈕更加突出?把它變大一點(diǎn)或讓它看起來(lái)更重要,創(chuàng)建一個(gè)更大的目標(biāo)供用戶(hù)單擊。或嘗試更傳統(tǒng)的方法:用一個(gè)更亮的顏色作為主要的動(dòng)作按鈕,來(lái)讓主按鈕變得顯而易見(jiàn)。
四、按鈕順序合理
如果主按鈕需要放在用戶(hù)下一個(gè)查看的位置,那么其他按鈕應(yīng)該放在哪里?應(yīng)該把其他的按鈕藏起來(lái),這樣用戶(hù)就不太容易發(fā)現(xiàn)它們。雖然這是一個(gè)很好的建議,但是如果您不考慮其他設(shè)計(jì)因素而遵循它,可能會(huì)出現(xiàn)不正確的布局。對(duì)于從左到右閱讀的語(yǔ)言,上一步按鈕應(yīng)該始終位于下一步按鈕的左側(cè),所以給出的解決方法是重新排列字段和按鈕。另一個(gè)方法是增加頁(yè)面的左邊距并將上一個(gè)按鈕放入其中。
五、給按鈕匹配釋義標(biāo)簽
最佳體驗(yàn)設(shè)計(jì)原則:給按鈕安置釋義標(biāo)簽。不受歡迎的消息類(lèi)彈框,告訴一些嚴(yán)重和可怕的錯(cuò)誤,并希望單擊確認(rèn)。這種體驗(yàn)不好,我不想在收到這樣的壞消息后再單擊“確定”,當(dāng)然不能保證用戶(hù)會(huì)看到按鈕上的標(biāo)簽。如果你在告警提示時(shí)放置了錯(cuò)誤的按鈕,一些用戶(hù)不會(huì)閱讀按鈕的標(biāo)簽,而是會(huì)單擊按鈕;一些用戶(hù)則會(huì)閱讀這些標(biāo)簽,因此可以通過(guò)編寫(xiě)每個(gè)按鈕釋義標(biāo)簽來(lái)幫助用戶(hù)快速理解;如果你發(fā)現(xiàn)自己陷入了一個(gè)爭(zhēng)論中,比如說(shuō),取消操作應(yīng)該在一個(gè)對(duì)話框中,記住你需要用它的功能性意思來(lái)標(biāo)記按鈕。
六、用戶(hù)不想做任何操作不安排按鈕
為了測(cè)試是否適用,我盡量去進(jìn)行填寫(xiě),但我真的不想注冊(cè)一個(gè)網(wǎng)站或申請(qǐng)貸款或做其他目的的表單,所以這個(gè)時(shí)候有一個(gè)重置或取消按鈕會(huì)比較方便。如果為從事表單設(shè)計(jì)的客戶(hù)做設(shè)計(jì),請(qǐng)確保包含重置按鈕。如果為別人設(shè)計(jì)的,問(wèn)問(wèn)自己是否真的想清楚所有的填寫(xiě)過(guò)的內(nèi)容。在流程中,用戶(hù)遇到“登錄”按鈕和“注冊(cè)”按鈕兩個(gè)選擇,但用戶(hù)要么不記得的登錄憑據(jù),要么不想注冊(cè),所以?xún)蓚€(gè)都不是用戶(hù)的選擇。用戶(hù)想做的是將注冊(cè)改為繼續(xù),從而實(shí)現(xiàn)了銷(xiāo)售額的大幅增長(zhǎng)。
七、弱化消極類(lèi)按鈕
放置用戶(hù)不想操作的按鈕,但是有時(shí)確實(shí)需要提供消極類(lèi)按鈕,如取消訂單。在自己案例庫(kù)中找到的看上去一個(gè)合理的“取消”按鈕,截圖來(lái)源一個(gè)網(wǎng)站,該網(wǎng)站的目標(biāo)用戶(hù)是那些即將準(zhǔn)備進(jìn)行一筆相當(dāng)大的購(gòu)買(mǎi)、每月支付長(zhǎng)期款項(xiàng)的非熟練用戶(hù),因?yàn)檫@批用戶(hù)不知道點(diǎn)擊關(guān)閉窗口的關(guān)閉按鈕就可以取消交易。
網(wǎng)頁(yè)是用戶(hù)和網(wǎng)頁(yè)的對(duì)話過(guò)程。按鈕在人和網(wǎng)頁(yè)的對(duì)話中起著至關(guān)重要的作用。按鈕設(shè)計(jì)一定要遵循設(shè)計(jì)基本原則。更多關(guān)于UI培訓(xùn)的問(wèn)題,歡迎咨詢(xún)千鋒教育在線名師。千鋒教育擁有多年IT培訓(xùn)服務(wù)經(jīng)驗(yàn),采用全程面授高品質(zhì)、高體驗(yàn)培養(yǎng)模式,擁有國(guó)內(nèi)一體化教學(xué)管理及學(xué)員服務(wù),助力更多學(xué)員實(shí)現(xiàn)高薪夢(mèng)想。