2023-7-28 博博
使用轮播图对于在有限空间来提升用户阅读效率是很有用的,但现有大部分情况轮播图设计得并不好用。
遵守本文中提到的 10 条轮播图设计原则,可以提使用高轮播图的用户体验,在这篇文章中,作者首先会通过实例来过一遍 10 条轮播图设计原则,然后说明为什么以及怎样区别对待桌面端和移动端的轮播图,在文章最后,列举出一种相比于轮播图更好更易用的展示方式。
一、实际运用中的轮播图
在美国一份针对 50 家顶级零售电商网站的统计中,发现轮播图被广泛运用于电商网站:PC 端 52%的电商网站使用轮播图,而与此同时移动端 56%的电商网站使用轮播图。(以下图表是译者个人为方便大家理解制作的)
来百度APP畅享高清图片
这篇文章的重点旨在讲如何通过设计和交互细节,使首页轮播图更易用,而不是关注于轮播图本身应该放那些内容。此时,我们轮播图的内容应该注意以下几点:
如果轮播图的内容与网站本身不相关,且没有经过精心设计和使用高质量的图片,那么用户体验会很糟糕 —— 轮播内容应与网站主题相关
如果轮播图的内容看起来太像广告,那么用户会直接忽视它,即使轮播图的内容与用户所需相关 —— 轮播图内容不能过于商业化
轮播图的一个主要优势就是可以放专门设计过的图片,那些经过设计的图片会降低首页的退出率并且会对网站和品牌产生积极效果,因为那些经过设计的高清大图能在首页给用户留下一个好印象,在用户快速决定停留或者离开之前增加用户在首页的驻足时间 —— 轮播图片要精心设计
二、轮播图设计十原则
那么,怎样在实际运用中做好轮播图设计呢,作者将 10 原则分成了四个部分来进行阐述:
除了传统的设计样式像是用来感知位置的小点和前后切换的箭头,“table of contents”这种设计样式同样也能起到一样的效果 。
首先,它结合了位置感知和手动切换的控件为一个整体的 UI 组件;
其次,它能为用户提供了一定的轮播信息线索,让用户知道接下来会看到什么,因而可以让用户更有效的进行跨帧的切换。
文章来源:优设网 作者:LHJ
分享此文一切功德,皆悉回向给文章原作者及众读者
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。
蓝蓝未来将会持续在平台上分享关于设计行业的文章。此外蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,添加vx蓝小助ben_lanlan,报下信息,蓝小助会请您入群。同时添加蓝小助我们将会为您提供优秀的设计案例和设计素材等,欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司