15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > UI设计-弹出窗口怎么做?

UI设计-弹出窗口怎么做?

时间:2023-07-22 12:42:02 | 来源:网站运营

时间:2023-07-22 12:42:02 来源:网站运营

UI设计-弹出窗口怎么做?:#杭州UI培训#优途UI教育

前言

弹出窗口我们经常看到,但弹出窗口有哪些类型,设计时应该注意什么呢?就很多UI设计师不清楚了,今天和大家分享UI设计弹出窗口类型。

弹窗的分类

一般根据是否打断用户操作,把弹窗分类为模态弹窗(重提示)、非模态弹窗(轻提示)

模态弹窗:打断用户的操作行为,用户必须对弹窗进行操作,否则不能进行其他操作。

优点:可以很好的获取用户的视觉焦点。

缺点:就是会导致用户当前的操作流程中断。

非模态弹窗

不会限制用户操作,通常会有时间限制,出现几秒会自动消失

优点:不会打断用户操作

缺点:容易被用户忽略

我们常见的类型有信息选择确定运营活动信息输入选择这几种类型的。

信息选择确定又分为四种

第一种:系统功能授权,如百度地图,它上面就弹出“是否允许访问麦克风”,还有网上厨房“是否允许访问位置”的弹窗,这里的话就是系统自带的授权弹窗。

第二种:版本更新,升级的弹窗通常会弱化不升级的按钮,突出升级的按钮,像案例展示的有两个,大家可以看一看,像升级的话颜色做的比较亮一些,这个按钮不升级的话就是比较弱化,权重没有那么高。

第三种:消息通知弹窗,像高德地图与和饿了么的消息提醒弹窗都属于,后期APP为了推送消息,主动提示你开启某些消息的一个通知。

第四种:重要提示/信息的二次确认,同程汽车购票的这个弹窗属于消息提示,告知用户相关信息,百度网盘的弹窗属于信息确认,询问用户选择哪种方式下载。

第五运营弹窗,通常是一些活动广告领优惠券等,它主要吸引用户去点击参加一些活动,像这类弹窗的话在视觉设计上是比较吸引人的,它的颜色都是比较丰富一些的,造型很多样,它会根据运营的内容,突出“领取、参与、查看”等一些按钮强化,弱化关闭按钮,案例是连续签到领取红包,像“马上参与”按钮是比较强化的,颜色比较鲜亮,但它的关闭按钮下面的一个叉号的话是比较灰色的,就比较不明显。

一个618的活动,20元无门槛券,它下面“点击速抢”按钮就做的比较大,让客户一眼就看到了。

第六:信息输入,像这类弹窗的话,通常是一些比较简单的信息选择或者内容填写,通常只有确定和取消两个按钮,像微博对于关注的人,分组及备注,操作简单,设置备注是直接调出键盘即可输入方便快捷。

第七:浮层,一般是指用户点击某个浮层就会出现一个临时的气泡,对其功能进行一些补充,用户需要点击功能区域操作或者点击空白处取消才能进入下一步操作。

浮层的话分为指向浮层,像这类浮层的话,一般是伴随有个小三角指向,有强调归属气泡,里面的功能通常是以单一的文字或文字加图片的形式来结合,大家可以看一下下图,支付宝和微信的顶部加号补充浮层,展现形式差不多,只是UI形式不一样,支付宝是白色气泡黑色半透明遮罩,微信是深灰色的气泡。

最右边那张图片的话,在复制文字很常见,比如说我们复制一些文字的时候会出现一个弹窗,就是一个拷贝查询之类的。




以上就是分享的就是弹窗类型,希望对大家有帮助,优途UI教育专注互联网高端UI培训。

关键词:窗口,设计

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭