数极客首页

移动产品中的旋转木马模式

 

  移动

产品设计中,图片传达的信息比文字更直白、美观、容易吸收
用户留意
,所以在产品中引入大量图片资源也成为设计师喜欢
的方式之一。

今天我们在文中要引见
一种高效的缩略图阅读
方式——旋转木马方式

(Carousel)。

  1.什么是旋转木马(Carousel)方式

?

旋转木马由来已久,在西方的游乐场中经常能够

见到,早期的胶片电影灵感即来源于此,将一张张静止的画面快速转动投射到荧幕上,在中国古代也有相似

的方式
——“跑马灯”,在节日供百姓观赏

文娱

在移动

产品交互设计中,旋转木马方式

能够

在一条目内同时呈现多张图片,引导用户经过
滑动屏幕阅读
更多内容。这种方式

的优点在于能够

在有限的屏幕空间内,高效的呈现大量图像内容,带给用户更好的聚焦、阅读
体验,让原本

静止的图片有如播放电影般精彩纷呈。

移动产品中的旋转木马方式

  1)屏幕中只呈现部分

内容

旋转木马方式

中通常会展示

大量的图片内容,但在手机屏幕的一屏内不会呈现过多图片(依据

图片尺寸普通
在3-5张)。

移动产品中的旋转木马方式

需求
显然
的视觉引导,让用户知道

能够

经过
滑动中止

阅读
,并明白
滚动的方向。能够

提供滚动条、按钮,或在屏幕恣意
一侧显现
部分

额外条目。

移动产品中的旋转木马方式

能够

经过
进度条、百分比等方式
让用户知道

阅读
的当前位置,并为中途退出的用户保管

查看进度。

移动产品中的旋转木马方式

被选中的图片与其他图片要从视觉上显然
辨别

,能够

提供边框或将选中图片置于高亮。

移动产品中的旋转木马方式

当阅读
到最终
一张图片时,能够

提供“更多”按钮,让用户知道

图集阅读
完成,能够

点击阅读
更多信息或下一图集。

移动产品中的旋转木马方式

旋转木马方式

在提供大图阅读
的同时,也提供阅读
导航,并能够

呈现更多相关内容。比起传统的瀑布流、缩略图列表,旋转木马方式

为用户带来更流利
的图片阅读
效果,是一个更高效、易于辨认

的图片查看方式。该方式

普遍
应用于以下产品:

  1)照片阅读
类产品

用户经过
它来对照片、视频中止

阅读
,选择感兴味
的内容中止

查看。大图的运用
比起缩略图列表更容易让用户取得

良好的体验,旋转木马能够

在用户阅读
大图的同时提供导航,便当
用户在众多图片中切换。

例如:优酷,人人网…

移动产品中的旋转木马方式

旋转木马方式

也是电子商务类网站中经常用到的交互方式
,产品详情页经常运用
旋转木马为用户呈现全方位的产品展示

例如:淘宝、京东…

移动产品中的旋转木马方式

新闻图片最容易吸收
用户的留意
力, 随着视频新闻、图片新闻等多媒体元素更多的应用在新闻阅读类产品中,更多媒体选择运用
旋转木马呈现新闻列表,辅以适量文章摘要,为用户带来更高效、直观的阅读体验。

例如:BBC、华盛顿邮报…

移动产品中的旋转木马方式

  1)减少认知担负

iTunes的媒体封面流由一张处于屏幕中心的大图和罗列在两侧的缩略图组成,这种组成方式

要注企图
片滚动的速度。由于这些图片不时
变换着,用户或许
无法在快速切换的图片中聚焦对象,从而尝试及时中止
滚动来取得

焦点。因而

,在设计旋转木马时要谨慎

处置
图片的滚动速度、滑动时的加速度,以及滑动中止
的减速,不要添加过多动画效果增加用户的认知担负

移动产品中的旋转木马方式

开端
滚动的方向经常让用户产生疑惑:“旋转木马是循环播放吗?”,“我能否
曾经
看过某些内容?” Android 4.0运用
“blue parallax”视觉元素提示用户滚动的方向和终点。

移动产品中的旋转木马方式

长时间的阅读
会运用
户感到无聊和疲倦,所以在设计时要留意
旋转木马承载图片的数据量
,普通
控制在20张以内,减少用户持续阅读
产生的疲倦
。假定

希望用户继续阅读
,能够

在内容阅读
终了

后增加“查看更多”,让用户在阅读
完成后经过
点击跳转到其他内容。

移动产品中的旋转木马方式

在网站设计中,旋转木马方式

已普遍
应用于众多网站。在移动

互联网时期
,随着移动

设备的高端化、多元化展开

,设计师能够

经过
应用旋转木马方式

为用户发明

更好的阅读
体验,怎样
应用
该方式

分别

更多交互手势、怎样合理应用
平台特性,为设计师留下了宽广
的想象空间。

移动产品中的旋转木马方式

[1] Greg Nudelman. A Definitive Guide To The Android Carousel Design Paern. February 1st, 2013

[2] http://developer.yahoo.com/ypaerns/selection/carousel.html

VIA:百度MUX

给大家举荐

我国新一代大数据用户行为剖析

与数据智能平台:数极客(https://www.shujike.com),是支持无埋点、前端埋点、后端埋点、API导入四种混合数据采集方式,整合剖析

用户行为数据和业务数据,能够

自动监测网站、APP、小程序等多种渠道推行
效果剖析

,是增长黑客们必备的互联网数据剖析

软件。数极客支持实时多维剖析

、漏斗剖析

、留存剖析

、途径
剖析

等十大数据剖析

办法

以及APP数据剖析

网站统计网站剖析

小程序数据统计用户画像等应用场景,业内首创了六种提升转化率的数据剖析

模型,是用户行为剖析

范畴
首款应用定量剖析

与定性剖析

办法

数据剖析

产品

发表评论

评论已关闭。

相关文章