Action button 是每個 app 里不可或缺的按鈕,它有時是主要功能虾标,有時為了業(yè)務(wù)需求蔓腐。在 Material Design 里,action button 有兩種常見處理方式:放在 app bar 的右側(cè)刁品,以及 floating action button (FAB)泣特。
Icons on the right side of the app bar are app-related actions.
Material Design Guidelines (?- Layout - Structure) 中就要求 action button 放在 app bar 右側(cè)時需要使用 icon。但顯然挑随,能用 icon 就可以明確表意的功能很有限状您。
進(jìn)而考慮 FAB,因為有一種設(shè)計我們不陌生——點擊 FAB 后兜挨,更多選項被展開膏孟、并在按鈕旁邊附上文字,常見的有環(huán)聊拌汇、Facebook for Android柒桑。而這種方案必然會損失可見性(只有嘗試觸發(fā)過才知道有什么功能),B 端產(chǎn)品更為大忌噪舀。如果只有兩個優(yōu)先級相同的按鈕時魁淳,比如理財產(chǎn)品的「贖回」「購入」,金融產(chǎn)品的「轉(zhuǎn)入」「轉(zhuǎn)出」与倡,情況也較尷尬界逛。當(dāng)然還有像 Google Maps 的雙 FAB 處理方案,但依然不能解決 icon 表意困難的問題纺座,并必須給功能分出個主次息拜。
我們知道 Material Design 里還有 raised button、flat button 甚至 modal button sheet 這些樣式净响,但它們無法常駐少欺,也算不上優(yōu)雅。我和我的朋友們都不是原教旨主義者别惦。遵守 guidelines 一方面可以降低學(xué)習(xí)成本(前提是普遍開發(fā)商都遵守)狈茉,另一方面是 consistency。但面臨業(yè)務(wù)需求掸掸,guidelines 無法滿足的氯庆,就選擇不遵守(老生長談的 Android tab bar 問題這里暫不展開)。
近期在知乎上的一個問題「Material Design 設(shè)計規(guī)范是否不太適合像淘寶這樣大而全的厚重的應(yīng)用程序扰付?」頗受關(guān)注堤撵。無論如何舉反證,我始終認(rèn)為 Material Design(相比起 iOS Design)就是有更多的羽莺、更高的局限性实昨。這有文化的原因。但有人拿 B&H盐固、淘寶國際等來舉例荒给,如果梳理一遍手機淘寶的信息框架丈挟,相信不會給出這個答案。
拋開 Material Design Guidelines,我們依然能看到一些不錯的 action button 設(shè)計挑辆。例如 Spotify 的歌曲詳情頁例朱,在滾動頁面時 action button 會固定在 app bar 的位置,并且這種設(shè)計在其 iOS app 里也不違和(但沒有倡導(dǎo) Android 和 iOS 要用同一套設(shè)計的意思)鱼蝉。而 Vurb 的 icon 結(jié)合文字的方案也是折中之舉洒嗤。