中文字幕一区二区三区在线中文-日本中文字幕 在线观看-欧美日韩国产亚洲综合-性色AV一二三天美传媒

廣州總部電話:020-85564311
廣州總部電話:020-85564311
20年
互聯網應用服務商
請輸入搜索關鍵詞
知識庫 知識庫

優(yōu)網知識庫

探索行業(yè)前沿,共享知識寶庫

B端產品設計中的模態(tài)彈框和非模態(tài)彈框

發(fā)布日期:2025-05-14 11:07:38 瀏覽次數: 945 來源:婉寧交互設計

弹窗

一般来说,弹窗承载当前操作的补充说明,或承载独立的即时性任务。弹窗作为产品与用户沟通的核心枢纽,其样式千变万化,但是万变不离其宗。在交互形式上,弹窗分为模态弹窗与非模态弹窗。

一般来讲,模态弹窗分为对话框弹窗、半层弹窗和气泡弹窗,非模态弹窗分为Toast/HUD、Tips提示栏和Snackbar。

模态弹框

模态弹窗会将用户视线聚焦在当前信息,并且需要用户做出反馈,模态弹框具有一定的强制性,会打断用户当前工作流程,用户必须在弹框上进行一定的操作反馈才能进行下一步和回到父级页面,并且操作过程中将无法使用其他功能。

对话框Dialog/Alert

对话框弹窗是使用频次最多、使用场景最多、视觉样式最多的弹窗形式。

它通常出现在屏幕正中心,底部有半透明遮罩,必须进行操作,让人想不注意都难,因此,它的视觉层级最高的。

场景:用于运营活动和广告宣发、警告弹窗、二次确认、规则说明、版本更新...

行动栏Action Sheet/Activity View

动作栏在我看来可以看成是对话框的一个加强版,因为无论是alert还是dialog一般都只有两个按钮。而动作栏可以提供多个功能按钮,而且展示的样式比较多变。

场景:动作列表、做出选择、二次确认

气泡弹窗

气泡弹窗通常在用户点击某一功能控件后出现,有时会伴随半透明遮罩衬底,用户点击弹窗区域或弹窗外空白处即可进行下一步操作。

场景:用做下拉菜单,汇集功能入口。

非模态弹框

非模态弹窗是一种轻量型的信息反馈机制。在B端产品中,常见的非模态弹框有警告提示、全局提示、通知提醒框等,这些弹框停留一段时间后会自己消失。相对模态弹框来说,非模态弹框属于轻量级操作反馈,不会对用户的工作流程有太大的干扰。

非模态-Toast/HUD

在非模态弹窗中,Toast/HUD是最常见的形式,Toast是Android的控件,HUD是iOS的控件。

Toast是用户操作后的即时反馈,确保用户自己所处的状态,并且做出相应的措施。

toast是可以出现在屏幕的任何位置的,而且可以加icon,甚至连背景层颜色都能变

非模态-Snackbar

Snackbar一般是由文字和功能按钮组成的,通常出现在页面底部,一般可进行交互,短暂停留或滑动页面之后会自行消失。

Snackbar本来是Android里的控件,不过现在也通用于iOS系统中。Snackbar同样是针对用户操作的轻量反馈机制。

非模态-Tips提示栏

Tips提示栏在严格意义上并不属于弹窗,因为弹窗属于一个单独浮层,而状态栏属于内嵌在当前页面的一个组件。

tips提示栏通常常驻于页面顶部或底部,不阻断用户的当前操作,甚至有些可以进行简单交互。

優(yōu)網科技,優(yōu)秀企業(yè)首選的互聯網供應服務商

優(yōu)網科技秉承"專業(yè)團隊、品質服務" 的經營理念,誠信務實的服務了近萬家客戶,成為眾多世界500強、集團和上市公司的長期合作伙伴!

優(yōu)網科技成立于2001年,擅長網站建設、網站與各類業(yè)務系統(tǒng)深度整合,致力于提供完善的企業(yè)互聯網解決方案。優(yōu)網科技提供PC端網站建設(品牌展示型、官方門戶型、營銷商務型、電子商務型、信息門戶型、微信小程序定制開發(fā)、移動端應用(手機站APP開發(fā))、微信定制開發(fā)(微信官網、微信商城、企業(yè)微信)等一系列互聯網應用服務。


我要投稿

姓名

文章鏈接

提交即表示你已閱讀并同意《個人信息保護聲明》

專屬顧問 專屬顧問
掃碼咨詢您的優(yōu)網專屬顧問!
專屬顧問
馬上咨詢
掃一掃馬上咨詢
掃一掃馬上咨詢

掃一掃馬上咨詢