UI设计素材|弹窗设计技巧,快get

弹窗是App中一种常见的交互方式,主要具有“传递信息”和“获取反馈”两大功能。按类别划分,可分为“模态弹窗”和“非模态弹窗”两大类。

模态弹窗:

强制打断用户当前操作行为,传递给用户信息,同时用户必须进行操作回应,否则无法使用其他功能。

包含:Dialog/Alerts(警告框、对话框); Actionbar、Action Sheets、Acitivity View(动作栏、操作列表、活动视图); Popover/Popup(弹出框、浮层)

非模态弹窗:

不影响用户当前操作行为,传递给用户信息,用户不用对其进行回应,一般出现几秒后消失。

包含:Toast / HUD(提示框);Snackbar(底部弹窗)

弹窗设计原则

(1)精简文案

(2)直接了当

常见使用误区:

1、Dialog(警告框) 和 Action Sheets(操作列表)

(1)Dialog侧重于传达信息,因此文案内容的优先级较高。Action Sheets侧重于功能选项,因此表示不同功能选项的按钮优先级较高。

(2)按钮为2个或以内时,一般使用Dialog。按钮超过2个时,一般使用Action Sheets。(仅指一般情况,特殊场景特殊对待)

(3)需要强行打断的场景,使用Dialog。如:没有网络,版本升级。

搜UI (SOOUI) 带来的弹窗设计范例,一定能让你灵感爆表。

全屏弹出式设计

弹出模板设计

弹出/覆盖 - 每日UI 016

女佣雷达UI弹出窗口

选择变

邮件弹出的【免费赠品]

猜你喜欢

转载自blog.csdn.net/awayaya1/article/details/108448489