按鈕是界面設(shè)計(jì)中最常見(jiàn)的元素之一。比如播放器的“播放”和“暫退泵”按鈕时迫。也正是在使用某一款播放器的時(shí)候遇到的問(wèn)題促使我記錄以下文字。
這是Windows Media Player的播放控制區(qū)域沐兵。在音樂(lè)停止時(shí)，中間的播放按鈕圖標(biāo)顯示為一個(gè)三角形便监，這是通用的播放圖標(biāo)扎谎，提示用戶點(diǎn)擊按鈕后會(huì)開(kāi)始播放音樂(lè)。當(dāng)正在播放音樂(lè)時(shí)烧董，按鈕圖標(biāo)則顯示為暫停毁靶，提示用戶點(diǎn)擊按鈕后會(huì)暫停播放。
以上設(shè)計(jì)已經(jīng)沿用多年逊移，用戶也習(xí)慣了此類模式预吆，在使用過(guò)程中完全不會(huì)多想。就如同燈的開(kāi)關(guān)胳泉，按一下開(kāi)燈拐叉，再按一下關(guān)燈。不過(guò)最近在使用某一款視頻播放器的時(shí)候扇商，播放按鈕上圖標(biāo)的設(shè)置則是與上面的使用習(xí)慣相反：視頻正在播放時(shí)凤瘦，圖標(biāo)顯示三角形；視頻暫停時(shí)案铺，圖標(biāo)顯示兩條豎線蔬芥。因?yàn)檫@種設(shè)計(jì)與習(xí)慣相反，一開(kāi)始讓我有些不知所措，反復(fù)點(diǎn)擊了幾下按鈕才搞明白笔诵。細(xì)想一下返吻，設(shè)計(jì)師應(yīng)該是想用圖標(biāo)表達(dá)當(dāng)前播放的狀態(tài)。先不說(shuō)這樣的思路對(duì)不對(duì)乎婿，在一個(gè)已經(jīng)成熟的設(shè)計(jì)模式上做創(chuàng)新挑戰(zhàn)用戶習(xí)慣確實(shí)要冒極大風(fēng)險(xiǎn)测僵，且有點(diǎn)不必要。
不過(guò)再深入想想次酌，按鈕這個(gè)簡(jiǎn)單的東西并不那么簡(jiǎn)單恨课。
來(lái)看看維基百科的解釋：按鈕，全名：命令按鈕岳服。英文：Command Button剂公。程序或網(wǎng)頁(yè)最常用的一個(gè)控件。在程序中吊宋，按鈕是最常用的用于觸發(fā)事件的控件纲辽，也可以開(kāi)始，中斷璃搜，結(jié)束一個(gè)進(jìn)程拖吼。按鈕接受最常用的事件為單擊事件（Click），按鈕的狀態(tài)為兩種这吻，即：原狀態(tài)和按下?tīng)顟B(tài)吊档。當(dāng)鼠標(biāo)單擊按鈕時(shí)，按鈕處于按下?tīng)顟B(tài)唾糯。
按鈕需要用戶動(dòng)作觸發(fā)怠硼，然后執(zhí)行命令。在網(wǎng)頁(yè)設(shè)計(jì)中移怯，我們常常會(huì)忘記按鈕的狀態(tài)香璃，因?yàn)辄c(diǎn)擊網(wǎng)頁(yè)上的一個(gè)按鈕后經(jīng)常會(huì)是進(jìn)入另一個(gè)界面，這個(gè)按鈕已經(jīng)看不到了舟误，比如“提交”按鈕葡秒。此類按鈕可以叫做單態(tài)按鈕，或者動(dòng)作按鈕嵌溢。動(dòng)作按鈕只有一個(gè)狀態(tài)眯牧。
在篇首給我?guī)?lái)疑惑的播放/暫停按鈕是兩態(tài)/切換按鈕(toggle button)。除了播放/暫停赖草，開(kāi)/關(guān)也是很典型的兩態(tài)按鈕炸站。此類按鈕要順利使用，需要讓用戶了解當(dāng)前的狀態(tài)疚顷，同時(shí)還要給用戶預(yù)期旱易，預(yù)示點(diǎn)擊以后的結(jié)果禁偎。音樂(lè)/視頻正在播放時(shí)，用戶能夠感知到阀坏，因此不需要在按鈕上額外表示當(dāng)前狀態(tài)如暖，只需要提供預(yù)期即可。因此在播放時(shí)忌堂，按鈕上顯示暫停圖標(biāo)預(yù)示點(diǎn)擊按鈕將暫停播放盒至，是正確且符合使用習(xí)慣的設(shè)計(jì)。燈的開(kāi)關(guān)也是如此士修。
正是因?yàn)橛脩舫３枷遂？梢栽诓恍枰~外設(shè)計(jì)的情況下就可以感知到當(dāng)前狀態(tài)，設(shè)計(jì)師也常常忘記了狀態(tài)的存在棋嘲【瓢Γ可以設(shè)想以下場(chǎng)景來(lái)證明狀態(tài)的重要性：假如一個(gè)房間沒(méi)有窗戶，關(guān)上門之后無(wú)法看見(jiàn)燈光沸移，燈光開(kāi)關(guān)設(shè)置在室外痪伦。在關(guān)門之后，要求用戶在室外開(kāi)啟或者關(guān)閉室內(nèi)燈光雹锣。因?yàn)闊o(wú)法知道燈當(dāng)前的狀態(tài)网沾，如果開(kāi)關(guān)按鈕上也不提供狀態(tài)，用戶將無(wú)法完成這個(gè)任務(wù)蕊爵。如果將開(kāi)關(guān)設(shè)計(jì)成下面這樣辉哥，用戶就能順利完成任務(wù)了：
因此，在界面設(shè)計(jì)中常常會(huì)看到運(yùn)用顏色攒射、圖形醋旦、文字、提示信息等多種方法來(lái)達(dá)到按鈕設(shè)計(jì)的目的匆篓。比如上面說(shuō)的Windows Media Player播放按鈕浑度，當(dāng)鼠標(biāo)放在按鈕上的時(shí)候寇窑，就會(huì)顯示按鈕執(zhí)行動(dòng)作的提示鸦概。而且，就算這樣用戶也可能需要反復(fù)嘗試幾次之后才能正確使用甩骏。
對(duì)于兩態(tài)按鈕窗市，目前并沒(méi)有統(tǒng)一的設(shè)計(jì)原則，從以往的設(shè)計(jì)實(shí)踐中可以總結(jié)出以下方法：
1）在當(dāng)前狀態(tài)很清楚的情況下饮笛，直接預(yù)示動(dòng)作結(jié)果咨察。比如播放/停止按鈕。
2）顯示當(dāng)前狀態(tài)福青，點(diǎn)擊后切換至另一狀態(tài)摄狱。比如手機(jī)界面常見(jiàn)的WIFI開(kāi)關(guān)脓诡。
無(wú)論采用哪一種設(shè)計(jì)方法，都要綜合考慮媒役，遵循用戶習(xí)慣祝谚、業(yè)界標(biāo)準(zhǔn)、平臺(tái)原則酣衷。
