按鈕是互動設計的基本元素。它們在用戶與系統之間的對話中起主要作用。在本文中，我將回顧創建有效按鈕所需了解的七個基本原則。
1.使按鈕看起來像按鈕
與用戶介面進行交互時，用戶需要立即知道什麼是「可點擊的」和什麼不是。設計中的每個項目都需要用戶努力解碼。通常，用戶解碼UI所需的時間越長，對他們的可用性就越差。
但是用戶如何理解某個元素是否是交互式的？他們使用以前的經驗和視覺指示符來闡明UI對象的含義。這就是為什麼使用適當的視覺指示符（例如大小，形狀，顏色，陰影等）以使元素看起來像按鈕如此重要的原因。視覺能指持有必要的信息價值-他們協助創造適宜性的介面。
不幸的是，在許多接口中，交互性的指示性很弱並且需要交互作用。結果，它們有效地降低了可發現性。
如果缺少清晰的交互功能，並且用戶在「可點擊」和「不可點擊」之間掙扎，那麼設計的出色程度將無關緊要。如果他們發現它很難使用，他們會發現它令人沮喪並且最終不是很有用。
對於移動用戶而言，符號不足是一個更為嚴重的問題。為了了解單個元素是否是交互式的，桌面用戶可以在元素上移動光標並檢查光標是否更改了其狀態。移動用戶沒有這樣的機會。要了解某個元素是否是交互式的，用戶是否必須點擊它-沒有其他方法可以檢查交互性。
不要以為用戶介面中的東西對您的用戶是顯而易見的
在許多情況下，設計人員有意不將按鈕標識為交互元素，因為他們認為交互元素對用戶是顯而易見的。在設計接口時，應始終牢記以下規則：
您解釋可點擊性指示符的能力與用戶的理解能力不同，因為您知道自己設計中的每個元素打算做什麼。
使用熟悉的按鈕設計
以下是大多數用戶熟悉的一些按鈕示例：
- 帶有方形邊框的填充按鈕
- 圓角填充 按鈕
- 陰影填充按鈕
- 幽靈按鈕
在所有這些示例中，「帶陰影的填充按鈕」設計對於用戶來說是最清晰的。當用戶看到物體的尺寸時，他們立即知道可以按下物體。
不要忘記空白
不僅按鈕本身的視覺屬性很重要。按鈕附近的空白量使用戶更容易（或更難）理解它是否是交互式元素。在此示例中，下面的某些用戶可能會將重影按鈕與信息框混淆。
作為用戶，您無法分辨它是盒子還是按鈕。
2.將按鈕放在用戶希望找到它們的位置
按鈕應位於用戶可以輕鬆找到或期望看到的位置。不要讓用戶尋找按鈕。如果用戶找不到按鈕，他們將不知道該按鈕存在。
儘可能使用傳統布局和標準UI模式
常規的按鈕放置可提高發現性。使用標準布局，用戶可以輕鬆理解每個元素的用途，即使它是沒有強符號的按鈕。將標準布局與清晰的視覺設計和充足的空白相結合，可使布局更易於理解。
不要與您的用戶一起玩尋寶遊戲
提示：測試設計的可發現性。當用戶首次導航到包含您希望他們執行的某些操作的頁面時，應該很容易為用戶找到合適的按鈕。
3. 標記按鈕的功能
具有通用標籤或誤導性標籤的按鈕可能會使您的用戶感到沮喪。寫下按鈕標籤，清楚地說明每個按鈕的功能。理想情況下，按鈕的標籤應清楚地描述其動作。
用戶應該清楚地了解單擊按鈕時會發生什麼。讓我舉一個簡單的例子。想像一下，您不小心觸發了刪除操作，現在您看到以下錯誤消息。
含糊不清的標籤「確定」並沒有過多說明操作按鈕。
目前尚不清楚「確定」和「取消」在此對話框中代表什麼。大多數用戶會問自己「當我單擊「取消」時會發生什麼？」
永遠不要設計僅由「確定」和「取消」兩個按鈕組成的對話框或表單。
與其使用「確定」標籤，不如使用「刪除」。這將使該按鈕對用戶的作用變得清晰。另外，如果「刪除」操作有潛在危險，您可以使用紅色說明這一事實。
4.適當調整按鈕大小
按鈕大小應反映此元素在螢幕上的優先級。大按鈕表示更重要的動作。
優先按鈕
使最重要的按鈕看起來像是最重要的按鈕。始終嘗試使主要操作按鈕更加突出。增大其尺寸（通過增大按鈕的大小，可以使它對用戶顯得更重要），並使用對比色吸引用戶的注意力。
Dropbox使用尺寸和顏色對比將用戶的注意力集中在「免費試用Dropbox Business」 CTA按鈕上。
使按鈕對移動用戶友好
在許多移動應用中，按鈕太小。這通常會導致用戶輸入錯誤的情況。
左：適當大小的按鈕。右：按鈕太小。圖片：蘋果
麻省理工學院觸摸實驗室的研究發現，指墊的平均值在10-14mm之間，指尖的平均值在8-10mm之間。這使得10mm x 10mm成為最小的觸摸目標尺寸。
5.注意順序
按鈕的順序應反映用戶與系統之間對話的性質。問問自己，用戶期望在此螢幕上擁有什麼順序並進行相應的設計。
用戶介面是與用戶的對話
例如，如何在分頁中對「上一個/下一個」按鈕進行排序？邏輯上，使您向前移動的按鈕應位於右側，而使您向後移動的按鈕應位於左側。
6.避免使用太多按鈕
這是許多應用程式和網站的常見問題。當您提供太多選項時，您的用戶最終無能為力。在應用或網站中設計頁面時，請考慮您要用戶採取的最重要的操作。
7.提供互動的視覺或聽覺反饋
當用戶單擊或點擊按鈕時，他們期望用戶介面將響應並提供適當的反饋。根據操作類型，這可能是視覺或音頻反饋。當用戶沒有任何反饋時，他們可能會認為系統未收到命令，因此將重複執行該操作。這種行為通常會導致多個不必要的操作。
為什麼會這樣呢？作為人類，我們期望在與物體互動後得到一些反饋。它可能是視覺，聽覺或觸覺反饋，任何承認交互已被註冊的事實。
用戶介面提供印刷機已註冊的視覺反饋。
對於某些操作，例如下載，不僅值得確認用戶輸入，而且還需要顯示進程的當前狀態。
此按鈕轉換為進度指示器，以演示操作的當前狀態。
結論
儘管按鈕是互動設計的普通元素，但值得一提的是使按鈕儘可能好。按鈕UX設計應始終圍繞識別性和清晰度。
文章來源: https://twgreatdaily.com/KPaKiHIBnkjnB-0z6h0x.html