优秀的设计就是带给用户惊喜!

Recommanded by editor
杭州/UI设计师/1年前/3222浏览
优秀的设计就是带给用户惊喜!Recommanded by editor
优秀的产品设计是能带给用户惊喜的,在不经意间让用户感受到温度,也是提升用户体验的关键。
随着行业的进步,产品设计师也在不断优化体验,输出一个一个优秀的解决方案。近期黑马哥也发现了一些比较惊喜的设计,来和大家一起欣赏一下吧!
优秀的设计就是带给用户惊喜!
Collect
体验目录
一、降落伞带来的营销广告
二、动效反馈商家备餐过程
三、这个广告惊不惊喜意不意外
四、Banner 广告的视觉沉浸感
五、待机状态下的实时动态
六、小图标里的细节反思
七、轮播式的悬浮设计
八、氛围热烈的底部标签栏
九、收缩式交互设计
十、形象化的进度设计
一、降落伞带来的营销广告
在这个广告满天飞的年代,用户已经逐步开启广告免疫模式,如何提高用户对广告的关注度至关重要。
近期在体验饿了么时,等待送餐界面中空降一个降落伞,从左上角飘到右侧悬浮,弹出红包悬浮广告。降落伞飘浮的动态过程吸引了用户的关注度,进而提高了营销广告的点击率,虽然广告大家都比较反感,但是一个伴随着惊喜的广告也会让你放下戒备心理。
优秀的设计就是带给用户惊喜!
Collect
二、动效反馈商家备餐过程
提升等待过程对于用户体验来说尤为重要,降低用户等待过程中的焦虑感,才能让用户愿意为此停留。
通过饿了么点餐之后,商家需要一定的时间完成餐饮的制作,必然需要用户等待一些时间。在这个备餐过程中,当前界面以一个翻炒动效表达,情感化的动效不仅提示用户当前状态,也提升了设计表达的感官体验。
优秀的设计就是带给用户惊喜!
Collect
三、这个广告惊不惊喜意不意外
意料之外的广告是带给你惊喜还是反感呢?平台为了提高变现能力,各种层出不穷的广告玩法也让你猝不及防。
之前在体验腾讯视频 App 时,从闪屏广告过度到 Banner 图的过程中,经历了多个广告新花样。首先从闪屏切换到自动轮播的弹窗模式,再演变到放大版的多个广告切片(占 Banner 位呈现),最后再恢复到 Banner 的正常布局中。这个过程无疑是把广告的存在感拉满了,让你对广告的记忆形成硬性要求。
无论这个广告设计方案是否让用户反感,但是这个呈现的互动方式还是比较新颖的,相信广告的点击率必然有所提升。
优秀的设计就是带给用户惊喜!
Collect
 
四、Banner 广告的视觉沉浸感
Banner 图在产品中是非常普及的,各类形式的演变也层出不穷,产品设计师都在探索更多可能性。
在腾讯视频 App 动漫栏目中,发现一例很有想法的 Banner 表现。Banner 上面新增了一个悬浮的火焰燃烧的动效,提升了整体的氛围感,动效与 Banner 画面完美贴合,视觉沉浸感十足。
优秀的设计就是带给用户惊喜!
Collect
五、待机状态下的实时动态
随时让用户感受到你的存在,才能让人感到安心,服务过程中状态实时可见至关重要。
通过饿了么点餐之后,就算处于待机状态时,只要点亮屏幕即可看到当前出餐状态。可视化的图形结合时间提醒,让状态一目了然,使得点餐到用餐之间的过程更有用户可控性。
优秀的设计就是带给用户惊喜!
Collect
六、小图标里的细节反思
产品中有很多辅助功能/信息等表达的图标,既要能准确表达主题,也要让用户易于理解。
在汽车之家 App 发现了一个值得反思的图标案例,在扫一扫的图标中结合了汽车外形轮廓,不仅不会影响扫描的功能表达,也进一步表达了该功能的差异。和别的产品扫描功能不同,这个是对准汽车进行扫描,体现出了业务的差异化。一枚小小的图标体现出了设计师的能力,用最简单的方式表现自身产品的差异,以此提升用户的操作体验。
优秀的设计就是带给用户惊喜!
Collect
七、轮播式的悬浮设计
悬浮设计非常普及,因为占比小和滑动页面会隐藏,对用户的干扰比较小。
最近在芒果 TV 首页发现了悬浮窗口的轮播式表达,芒果卡和活动中心会自动轮播显示(也能手动切换)。让我们对悬浮窗口的设计又多了一种设计理解,可以呈现更多不同内容的表达,提升了窗口的利用率。
优秀的设计就是带给用户惊喜!
Collect
八、氛围热烈的底部标签栏
底部标签栏的设计在图标创意层面发挥较多,各类风格的图标让该栏目更加丰富多彩,除此之外也有在背景层渲染氛围的案例。
近期恰逢芒果 TV 十周年之际,在底部标签栏背景层也加强了氛围感。丰富多彩的元素和配色,结合主题化的图标设计,使得整体氛围感拉满。
优秀的设计就是带给用户惊喜!
Collect
九、收缩式交互设计
通过交互方式应对用户操作过程,特别是在滑动界面时,交互方式的优化可以降低干扰,提高当前界面的利用率。
在 Blurrr App 创作界面,默认以 3D 动态图标展示“开始创作”按钮,当滑动界面时按钮会收缩展示。通过收缩式的交互设计,让界面可以展示更多内容,也不会影响用户点击按钮进行创作。即通过 3D 动效加强了功能的曝光度,又通过收缩式交互提高了内容的展示空间,可谓是一举多得的设计解决方案。
优秀的设计就是带给用户惊喜!
Collect
十、形象化的进度设计
进度设计是反馈状态变化的关键,通过可视化的表达让用户一目了然,提高用户对服务过程的把控。
当用户通过携程旅行 App 订票后,在行程订单界面可以看到列车行驶状态的进度提示。通过可视化的列车形象的表达了行驶状态,让用户清晰的看到行驶方向和抵达站点示意。不仅信息传递高效,形象的表达也使得感官体验更佳。
优秀的设计就是带给用户惊喜!
Collect
小结
优秀的产品总能在细微之处带给你惊喜,让你感受到产品服务的情感化和温度。本文观点仅代表个人体会,希望可以和大家一起共勉。
作者:黑马青年
本文由 @黑马青年 原创发布。未经许可,禁止转载。
77
阅读原文
|
Report
|
98
Share
相关推荐
大厂 UI 设计细节很到位
Recommanded by editor
文章
文章
文章
文章
文章
作品收藏夹
这些 UI 设计案例很有想法
Homepage recommendation
文章
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
2025电商视觉集
Homepage recommendation
相关收藏夹
文章
文章
文章
文章
作品收藏夹
学习/科普
学习/科普
学习/科普
学习/科普
作品收藏夹
冠军
冠军
冠军
冠军
作品收藏夹
UI
UI
UI
UI
作品收藏夹
参考
参考
参考
参考
作品收藏夹
读书笔记
读书笔记
读书笔记
读书笔记
作品收藏夹
大家都在看
Log in