【學習筆記】模態(tài)與非模態(tài)彈窗1

一. 彈窗的定義


1. 彈窗作用

彈窗是為了讓用戶回應,需要用戶與之交互的窗口。

非模態(tài)彈窗一般被設計成用來告訴用戶信息內容,而模態(tài)彈窗除了告訴用戶信息內容外還需要用戶進行功能操作。


彈窗分類


2. 模態(tài)彈窗

會打斷用戶的操作行為,強制用戶必須進行操作,否則不可以進行其他操作。

(Alerts/dialog,Actionbar,Popover)


3. 非模態(tài)彈窗

不會影響用戶操作,用戶可以不與回應,通常有時間限制,出現(xiàn)一段時間就會自動消失。

(Toast/HUD,Snackbar)

二. 彈窗分類


1. Alerts/Dialog:警告框與對話框

含義:英文意為警告、對話,跟彈窗屬性非常吻合,就是緊急狀況,打擾用戶的行為。

剖析:iOS中警告框稱之為Alerts,作用是用來傳達重要信息,并伴隨著需要用戶進行操作。

iOS規(guī)范中,警告框包含的元素如下:標題(必選)、描述信息(可選)、輸入框(可選)、按鈕(必選)。

必須包含標題、包含一個或多個按鈕。

Android規(guī)范中,彈窗交互按鈕需結合實際情況,不用「是/否」原則進行設計。


作用:告知用戶當前發(fā)生的狀況,讓用戶主動選擇回應。

適用:重要性較高的操作時,如退出、刪除、清空等。


2. Actionbar(Sheets、Acitivity View):操作欄、操作列表、活動視圖

含義:英譯為工具欄、操作欄。

剖析:當用戶激發(fā)一個操作的時候,出現(xiàn)此窗口。

一般會給用戶提供更多的功能選擇,一般可采用官方控件。

一般都設計有一個默認的「取消」按鈕,點擊取消可以關閉彈窗。

Aciton Sheets和Activity Views是iOS上特有的交互形式。

特性是用戶觸發(fā)、包含兩個或以上的按鈕。


以上為今日頭條、iOS系統(tǒng)相冊

作用:操作列表提供一系列在當前情景下可以完成當前任務的操作,而這樣的形式不會永久占用頁面UI的空間。

適用:如分享功能。


3. Popover/Popup:浮出框/浮層彈窗

含義:英意為彈出窗口,浮動于頂層窗口,氣泡。


以上為微博、qq、微信

剖析:當用戶點擊某個控件或者某個區(qū)域時浮出的半透明或者不透明的彈窗窗口。

不會對用戶所在位置進行跳轉。

作用:可以在當前頁面進行更多的操作行為,顯示/隱藏頁面中的折疊信息。

適用:首頁位置呈現(xiàn)一些常用操作的快捷入口。


4. Toast/HUD:提示框(iOS沒有Toast,只有HUD)

含義:Toast也被稱為吐司提示,Toast是安卓系統(tǒng)的一個控件名詞,現(xiàn)也應用于iOS系統(tǒng)中。


剖析:提示框屬于一種輕量級的彈窗反饋形式,常以小彈框的形式出現(xiàn),持續(xù)1-2秒自動消失,可以出現(xiàn)在屏幕任意位置,但是建議同一款產品盡量使用相同位置,讓用戶產生統(tǒng)一認知,成為習慣。

提示信息能給予用戶及時反饋,確保用戶知曉自己所處的狀態(tài),并可以做出相應的措施。

iOS用戶更習慣于在頂部感知反饋信息,不干擾用戶瀏覽主體內容。Toast出現(xiàn)在屏幕頂部不會遮擋主體內容。(如花瓣、有道云筆記)

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

相關閱讀更多精彩內容

友情鏈接更多精彩內容