分享关于Banner布局样式的研究【UI设计师】
Banner其实对于UI设计师来说并不陌生,更多的还是在于视觉表现层,但是它的本质是关于产品设计中的布局样式分析。那么通过本文大家来一起梳理和探索!
一、视觉层表现类别
Banner 在 UI 场景中通常伴随着轮播的形式展示,所以也经常称之为轮播图,这也是导航的一种形式之一,也有轮播导航的功能。在产品中出现可以带给用户平台需要重点传播的内容,比如产品活动信息和官宣咨询、年度佳节等。
为了能引起用户更高的关注度,Banner 在视觉层的表现上面也在不断的创新。除了 Banner 设计创意、构图、配色等视觉层面发挥以外,在表现类别上面我分为静态、动态、视频、分层视差等。
1.1 静态Banner 展示
此类型的轮播图是最常见的,无论是设计效率还是对于IT技术落地都是最为便利的。此类型的画面可分为单图或多图的图片格式,单图是静态的展现形式,多图可以设置自动轮播或手动左右滑动切换。
1.2 动态 Banner 展示
动态表现的 Banner 相较于静态而言更能引起用户的关注度,因为动态的东西可以打破静态的视觉平衡,引起的视觉权重更高,更能强化信息重点,在一些重点元素和交互按钮等地方实行动态表现。
在这个万物互联的时代,产品设计师都在不断的尝试如何更快、更准地获得用户的关注度。微动效是其最有效的一种表现方式,无论是在功能交互还是视觉表现层面,都随处可见。
1.3 视频嵌入banenr展示
随着当前短视频的走热,视频形式作为信息流越来越得到重视,视频嵌入到轮播广告中逐渐增多。较多的表现形式为默认出现在首个 Banner 中,伴随着倒计时出现,也可以关闭播放。此类形式为了降低用户在未知场景中的使用干扰,通常默认为静音模式,带给用户更加友好的体验。
1.4 分层视差效果展示
分层视差效果能打破常规表现形式的广告,可以带给用户不一样的视觉呈现和互动体验,具体有轮播叠加的视差、3D翻转、元素和背景分离视差等方式。
最后:
Banner 在很多产品中是较为常见的元素存在,一个好的体验也许只是一个细节的探索,如果能在每一个功能设计的时候都能把控每一个细节,必能带给用户更好的使用体验。
END
更多干货可关注微信公众号:产品设计研究院 想学习更多关于产品、设计、职场、心理、认知等干货,可长按下方二维码,关注我们。回复【社群】一起聊!
Powered by Froala Editor