不到萬不得已時,請勿輕易使用下拉菜單

移動端表格常常使用下拉菜單來進行輸入控制。今天給大家介紹幾個在設(shè)計中用來代替下拉菜單的控制器,并簡述其理由。

預(yù)期會影響用戶轉(zhuǎn)化率

沒有人喜歡填表格,而且一個表格看上去越長越復(fù)雜,用戶就越不愿意點擊進去填空,尤其是在小屏幕上進行不精確輸入。


在上圖的兩種類型的手機頁面中我們會發(fā)現(xiàn),兩者最基本的不同在于他們詢問問題的方式。一個是利用下拉菜單幾乎把所有問題問了個遍,而另一個則針對每個問題采用了最合適的輸入控制。


在手機屏幕上或者桌面上與下拉菜單進行交互是一個多步驟的過程,常常比必要的更費力:點擊?滾動(常常不止一次)?搜尋&選擇目標(biāo)?最后繼續(xù)。其實,我們可以做得更簡潔更好。

步進器

步進器控制以一個常量來增加或減少數(shù)值,這在進行細微的調(diào)整時非常有用。在測試手機機票預(yù)訂表格時,我們發(fā)現(xiàn)用戶更喜歡使用步進器來選擇乘客人數(shù)。這個時候就不需要下拉菜單,尤其是當(dāng)最大可選人數(shù)為8,而且絕大部分購票者只會選擇1-2名乘客數(shù)的時候。


當(dāng)使用步進器進行填表時,越簡單越好。對步進器的基本設(shè)計改動越多,其功能就越模糊。對于任何輸入控制都是這樣的,真的。


選項按鈕組

選項按鈕組,或者也叫分段控制器,是一組密切相關(guān)但又彼此獨立的選項。在比較手機機票預(yù)訂表格時,我們發(fā)現(xiàn)選線按鈕組對于選擇機艙類型非常方便。


附加控制器

并不是只有步進器和選線按鈕組可以用來代替下拉菜單。切換按鈕對于兩個截然相對的選項非常適用?;瑝K兒使你能夠選擇值域范圍內(nèi)的精細數(shù)值。當(dāng)你打算使用下拉菜單來處理繁冗的表格時,請先針對每個問題考慮一下是否以上這些控制器能夠更好地解決這一問題。


按鈕輸入將那些原本會隱藏于下拉菜單之后的選項顯示出來,從而使得用戶只需輕輕一點就可以選擇,而不需要多次點擊。


在有些情形下,下拉菜單可以被精煉為一次輸入控制。例如我在第一張圖片里提到的那個令人頭疼的機票預(yù)訂表格中使用了六個下拉菜單來手機乘客的出行日期。


在手機機票預(yù)訂研究中,我們發(fā)現(xiàn)一個單獨的輸入控制器對于用戶選擇出行日期來說非常適用。從六個下拉菜單變?yōu)橐粋€單獨日期選擇器,這就是進步。


最后一根稻草

所有這些下拉菜單的替代方式并不意味著我們在UI設(shè)計中不要使用下拉菜單。好的設(shè)計表格會采用最合適的輸入控制來處理他們需要詢問的每一個問題。有時需要一個步進器,有時需要一個選線按鈕組,而有時則需要一個下拉菜單。但是,由于下拉菜單不便于導(dǎo)航,默認情況下隱藏導(dǎo)航,不支持分層,只使用于不需編輯的選項,因此下拉菜單不應(yīng)該是你追求的首選UI設(shè)計控制器。然而,在今天的軟件設(shè)計中,設(shè)計師們卻恰恰是這樣做的。

所以呢,先考慮其他的輸入控制方式,把下拉菜單作為最后一根救命的稻草。


注:本文原作者Luke Wroblewski,2015-7-17發(fā)表于Lukew,譯者荷籽記憶

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,036評論 4 61
  • 內(nèi)容抽屜菜單ListViewWebViewSwitchButton按鈕點贊按鈕進度條TabLayout圖標(biāo)下拉刷新...
    皇小弟閱讀 47,133評論 22 665
  • 爺爺奶奶是上個世紀(jì)二、三十年代出生的人,爺爺比奶奶大七歲。他們并不是原配的夫妻。爺爺因為之前的配偶不能生育,...
    童心未泯_d6f1閱讀 270評論 0 0
  • http://www.eislcn.com/ 關(guān)鍵詞定位搜索 觸控水龍頭 百度首頁 360首頁 觸控恒溫水龍...
    預(yù)言谷殼閱讀 468評論 0 0
  • 我低頭看著我的小白鞋,從裙子底下,一步一步的冒出來,裙子隨之?dāng)[動。我曾經(jīng)設(shè)想過很多次,穿著長裙,一雙美美的鞋,然后...
    臭丑丑八怪閱讀 287評論 0 0

友情鏈接更多精彩內(nèi)容