這是《App產(chǎn)品設計指南》系列文章的第8篇內(nèi)容栏账,更多精彩可以點擊下方鏈接查看所计。
上篇文章介紹了一些常見的通用模塊,在本文中我們會接著了解App產(chǎn)品中的通用模塊缩宜,這次和大家介紹的是關于消息提示類的模塊不跟。
在開始正文之前,我們先了解一個概念:彈窗励堡。彈窗分為模態(tài)彈窗和非模態(tài)彈窗兩種谷丸,模態(tài)彈窗就是不能進行其他操作的彈窗,非模態(tài)彈窗則可以繼續(xù)進行操作应结。非模態(tài)彈窗通常都有時間限制刨疼,出現(xiàn)一段時間后就會自動消失。
Toast吐司
Toast吐司是我們經(jīng)常用到的一個組件鹅龄,它是一種非模態(tài)彈窗揩慕。Toast不會獲取到焦點,通常顯示一段時間之后就會自動消失扮休。
Toast可以出現(xiàn)在屏幕頂部迎卤,中央或者底部,具體如何選擇需要和平臺定義的整體規(guī)范保持一致玷坠。
Dialog對話框
Dialog屬于比較重度的場景蜗搔,而且會有很多衍生的類型。
Dialog是一種模態(tài)彈窗八堡,不會自行消失樟凄,必須用戶進行操作才會消息。由于中斷了用戶目前的操作兄渺,如果該信息不是必須的缝龄,用戶會感覺焦慮,憤怒挂谍。所以使用Dialog一定要慎重叔壤。
Snackbar消息條
Snackbar是非模態(tài)彈窗,谷歌MD規(guī)范里對Snackbar的定義是:一種針對操作的輕量級反饋機制凳兵,常以一個小的彈出框的形式百新,出現(xiàn)在手機屏幕下方或者桌面左下方。它們出現(xiàn)在屏幕所有層的最上方庐扫,包括浮動操作按鈕饭望。
Snackbar與Toast比較相似,屬于比較輕度的消息提示形庭,不會打擾用戶的正常操作铅辞。另外它可以和其他的操作進行組合,使用場景會更加廣泛萨醒。比如說文案+按鈕這種組合形式斟珊。
Snackbar目前沒有統(tǒng)一的中文叫法,有人叫做消息條富纸,有人叫做操作提示欄囤踩。Snackbar和下文中提到的Noticebar比較類型旨椒,但也存在很多不同點。下面會針對差異點重點介紹一下堵漱。
位置
Snackbar通常位于頁面底部综慎。
停留時間
Snackbar一般停留時間比較短,超過時間自動消失勤庐∈揪或者是點擊Snackbar上的操作,觸發(fā)操作的同時消失愉镰。還可以點擊Snackbar以外的區(qū)域米罚,Snackbar也會消失。
數(shù)量
Snackbar只有一個丈探。
Noticebar通告欄
Noticebar是非模態(tài)彈窗录择,通常位于頁面頂部,一般用作系統(tǒng)提醒类嗤、活動提醒等通知糊肠。
位置
Noticebar通常位于頁面頂部,比如在搜索框下面遗锣,全局導航下面货裹。
停留時間
Noticebar可以是查看后直接關閉,或者是始終顯示精偿。
數(shù)量
Noticebar可以有一個也可能有多個弧圆,但一般建議只使用一個。
Actionbar操作面板
Actionbar和Dialog比較類似笔咽,都是模態(tài)彈窗搔预,用戶需要進行操作。Actionbar組件可以放置更多的功能按鈕叶组,提供更多選擇拯田。用戶可以選擇點擊“取消”按鈕或者點擊上方的遮罩層關閉彈窗。
Actionbar的樣式比較多甩十,比如純文字船庇,圖文混排等。
無論選擇什么樣的組件都是服務于產(chǎn)品功能侣监,服務于用戶需求鸭轮,用戶場景。所以我們在產(chǎn)品設計時一定要盡可能多的挖掘橄霉、理解用戶窃爷,甚至可以自己設計出組件,交互模式。
在寫作過程中按厘,如果有意見或者想法医吊,歡迎有興趣的讀者添加我的微信一起交流探索,共同進步刻剥。