摺疊按鈕(漢堡包按鈕)
它是隱藏選單的按鈕。當您單擊或輕擊它時,選單會展開。這種選單 (以及按鈕) 之所以得名,是因為它由三條水平線組成,看起來像典型的麵包-肉-麵包式的漢堡組合形狀。如今,它是 Web 和移動佈局中廣泛使用的互動元素; 儘管如此,關於其利弊的爭論仍然很激烈。
經常訪問不同網站的活躍網際網路瀏覽者, 確切知道這個按鈕隱藏了不同類別的網站內容,所以這個技巧不需要額外的解釋和提示。好處是,這種選單預留更多頁面空間,使介面更簡約和透氣; 從功能上看,它為其他重要的佈局元素節省了大量空間。還可以更好地適配響應式和自適應式設計,隱藏導航元素,使介面在不同裝置上看起來更加和諧。
反對摺疊選單的論據是基於這樣一個事實: 對於不經常使用網站的人來說,這個設計元素可能會讓他們感到困惑,並且可能被具有高度抽象特徵的圖示誤導。它可能會對導航產生負面影響,並可能成為多使用者體驗差的原因。因此,應用漢堡包按鈕的決策應在多使用者研究和確定目標受眾的特徵和需求之後做出。
雖然漢堡包選單的使用仍然屬於現代 WordPress 網站設計和 App 設計中有爭議的話題,但它們也經常被設計者使用。
新增按鈕
透過單擊或輕擊該按鈕,多使用者可以向系統新增一些新內容。根據 App 的型別,它可以是列表中的新帖子、聯絡方式、位置、備註、條目,也可以是數字產品的新產品。有時,點選這個按鈕,多使用者會直接轉到建立內容的彈出視窗,在其他情況下,也會有一箇中間階段,在這個階段,多使用者可以選擇其他選項,並使新增內容更加準確。
滑動選項卡按鈕
單擊或輕擊後,此按鈕將開啟各種選項。這是在不過載螢幕的情況下設定適當的互動流的另一種方法,對於螢幕空間有限的移動介面尤其適用。
旅行計劃 App: 標籤欄的核心互動元素是一個加號按鈕,允許多使用者向特定的旅行新增新旅行或新專案。為了簡化體驗,將按鈕擴充套件為一組滑動選項卡按鈕,這些按鈕標記特定型別的內容,以便多使用者可以在進行選擇後,併到達必要的內容頁面。
分享按鈕
隨著社交網路、聊天和電子郵件的普及,這些按鈕簡化了將 App 或 WordPress 網站設計內容與多使用者的社交檔案連線的過程。這種型別的按鈕可以將內容或成就直接分享到社交網路帳戶。為了讓這種聯絡更清晰,它的圖示帶有特定社交網路的品牌標誌,很容易識別。現在,如果分享不是多使用者在頁面上所期望的關鍵操作,它們通常不會被標記為按鈕 (沒有額外的形狀、顏色標記、下劃線等),您只會看到社交應用圖示,但是它們是互動式的。這種展示方法支援極簡主義,並有效利用留白空間。它還讓多使用者專注於主要功能,但總是能看到快速分享到社交網路的途徑。
這是一個優雅簡約的建築公司 WordPress 企業網站。在主頁的左下角,您可以看到社交應用圖示。它們很容易被注意到,但平衡得很好,不會分散多使用者對核心導航和行動按鈕的注意力。那更多關於設計按鈕的內容,也可以結合上一文《UI 設計中,多使用者介面按鈕的幾種基本型別(一)》,詳細瞭解。
半透明按鈕
該按鈕是一個看起來是空的透明按鈕。按鈕外形看起來是空的,中空的,甚至接近透明的。其作為按鈕的視覺可識別性通常具有一個形狀,該形狀由圍繞按鈕文字的相當細的線包圍。這種按鈕有助於設定可視層次結構,以防有幾個行動按鈕元素: 核心的行動按鈕在一個填充的按鈕中顯示,而次要的 (仍然可啟用的) 在一個半透明按鈕中展示。
這是一個餐廳 App 的註冊介面。它有三種不同型別的按鈕: 核心的行動按鈕是一個填滿的按鈕,提供了最流行、最簡單的快速註冊方式; 半透明按鈕提供訪問頻率低的選項; 文字按鈕排列到下一行並將提出的問題作為行動提示,並使用顏色標記。這樣的方法有助於建立螢幕上幾個按鈕的視覺化層次結構。