禁用按鈕應該怎麼用？

最近收到的一則問題，大概是：在做設計的時候，經常會遇到一個問題，就是一個按鈕，在同一頁麵的不同情況下，有時可用，有時不可用，我們到底是顯示不可用時的禁用狀態呢？還是直接隱藏這個按鈕呢？禁用按鈕應該怎麼用？

大家還是喜歡提這種通用性問題，希望有一個說法，可以概括所有情況。但我多次說過，不存在這樣的好事，一定是具體問題具體分析的。

尤其是這個問題，想要聊透徹，得用不少例子來舉證說明，不過也可以通過總結的方式長話短說了。

禁用按鈕的使用，可以從兩個維度來分析，分別是：「無效的禁用狀態」和「有效的禁用狀態」。

無效的禁用狀態

有一種情況是，在一個頁麵裏，一個按鈕，可能會有幾種不同的情況存在。那人要問了，既然是一個頁麵，為什麼會有多種狀態同時存在的情況呢？

比如，在出行場景中，普通乘客發起訂單，司機接單後是可以發送消息的（左圖）。但是從第三方渠道來的乘客，司機是無法發送站內消息的，隻能通過電話聯係乘客（右圖）。

不同渠道來的用戶，司機端的頁麵會呈現不同的按鈕狀態。相同的頁麵，第三方渠道來的乘客，在司機端就不需要露出消息按鈕了，這樣可以減少無效信息對司機的幹擾，還可以避免司機習慣性操作帶來的無效反饋，比如點擊消息，顯示「無法發送消息」。或者顯示禁用，也會影響司機的操作判斷。

從這個案例中我們可以看出，當一個按鈕在某種情況下始終無法被觸發時，就會選擇讓它直接消失，而不是呈現禁用狀態。

很多人在這類設計裏會給按鈕提供一個禁用狀態，以免按鈕消失而打亂頁麵布局。但是要知道，在某種情況下，按鈕無用時，無意義的展示反而會產生幹擾信息，就像上麵說到的那樣。

所以這裏有一個結論是：禁用按鈕需要可觸發的時機，如果沒有這個時機，禁用狀態就沒有存在的必要。如果存在，那它也是一個無效的狀態。

既然是無效的，最好就不要出現了。

有效的禁用狀態

在上麵的例子裏，有一個前提不可忽略，那就是司機是否可以理解我們不顯示的原因。當然，司機會接受相關培訓，產品中也會有渠道標識，所以司機能夠明白頁麵中存在的差異。

但在其他產品中，當狀態不同，按鈕變化無法自洽的時候，又怎麼去處理呢？我們就需要通過合理的解釋來消除用戶潛在的困惑。

對於這點，比較典型的案例是在線上購物時，一件商品會有多個類型供消費者選擇，比如不同的尺寸、型號等，當其中一種類型被搶光時，這個商品依然是可見的，隻是無法選擇，展示出了禁用狀態。

在這種場景中，我們不能一下子把其他無法購買的類型隱藏，因為用戶需要知道我們所有的商品類別，了解商品的全部屬性，盡管當下無法購買，但有上新的可能，用戶依然可以選擇等待，並將其加入收藏，還是會有機會促成這筆交易。而且當可選類型變多的時候，隻是禁用沒有庫存的類型，可以使其他可選項保持固定的位置，有利於我們二次搜索和加購。這種場景的禁用也是暫時的，直到商品下架或者上新。

但就像我以前說過的，常常我們見多了的東西，就認為是正常的，但它並不一定好的。禁用也是這種情況。

雖然我們現在還是會在各個地方看到禁用操作，但是禁用的原由始終沒有給到用戶合理的解釋，以至於許多人見到類似的操作都是一頭霧水。所以在設計過程中，尤其要謹慎對待，盡可能的避免出現無法解釋的禁用操作。

好比淘寶的商品選擇頁麵，如今也將原來的商品純禁用按鈕，替換成了「缺貨」。選擇缺貨的商品之後，按鈕會變成「提醒掌櫃補貨」。

從原來的用戶單方麵接收無法點擊的按鈕，到現在直觀顯示缺貨，點擊後同時提醒到商家，這樣的操作從功能角度來說是一個升級。

這就是我說的，有效與無效的禁用按鈕之間的區別。禁用不該是真的禁止使用，而是告知用戶，它如何可被使用。

小結

如果一個按鈕在不同的階段有禁用和可用的狀態顯示，那麼意圖是很明顯的。比如一些活動頁麵，某個按鈕的禁用狀態是倒計時，就像電影的前期宣傳，為電影的上線製造話題和熱度，來鼓勵更多人的觀看一樣。

對於按鈕來說，顯示禁用則代表它在滿足一定條件後即可擁有可點擊性，讓我們明確地了解它就在這裏，未來是可操作的。按鈕也有很多的設計空間來為未來的使用做好鋪墊，特別是營銷類的活動，像是「明日 8 點可搶」、「提醒商家補貨」的按鈕文案，無一不在傳達「可用性」的信息，引導用戶持續性的關注。

但是還有一類禁用狀態隻是靜默地提示，多出現在表單中，當用戶沒有完成輸入的時候則無法點擊，因為看的多了，我們就以為這是正常的。但我們都知道它仍可優化，比如，在它以禁用狀態出現時，用更為友好的方式去提醒用戶應如何激活，而不是漆黑一片，且完全不知道它所存在的意圖。

我們要知道的是，禁用按鈕本身不是一個特殊的對象，隻是禁用狀態在頁麵中是一個特殊的存在，它是產品設計中的一種規則。為什麼按鈕不可用，或者說一定場景下為什麼功能不可用，當無法依靠用戶直覺理解的時候，是需要作出解釋的，也就是怎麼禁的問題。

但是最開始設計時就應該去想的是，禁用狀態對用戶和產品的意義在哪裏，這和我們設計方案時腦海中湧出的無數目標一樣，是一個基礎的出發點。而後，一切迎刃而解。

按鈕在產品界麵中是非常重要的元件之一，按鈕作為用戶引流和行動觸發來說都是至關重要的。如何把按鈕設計做到最好，是設計師需要不斷探索的問題，把控好每一個細節才能讓每一個元件更精致。

文章來源：微信公眾號：「呆呆U理」