【交互设计】选择时间设计

作者:Mufly

对于不少手机应用来说,都有一个选择时间的功能,那么从交互体验的角度来看,这个时间选择表格应该如何去设计比较理论呢?

 

时间选择,常见的一般分:

1、具体时间点选择,这种类型侧重于具体的时间点选择,而日期一般限制在今天或明天,比如:线上电影订票,一天内会提供很多不同时间点让用户选择;

2、具体日期选择,这种类型侧重于具体日期的选择,时间点一般会固定一个。比如:线上旅游产品预定,一般每天固定一个时间点发团;

3、两者结合,先选择具体的日期,再选择具体的时间点。

 

这篇文章只探索“侧重具体时间点”的方式,至于“侧重日期选择”的方式,文章最后以一个实例来带过。

 

说到时间选择表格,也许最先联想到的是“日历”

【交互设计】选择时间设计

这种表格方式,确实很直观,也很符合我们的行为习惯,从这种常规的表格方式,我们可以演变出如下形式:

【交互设计】选择时间设计

把当天之内,可以“选择的具体时间点”直观的展示出来,让用户浏览后,直接选择想要的时间点

但是,这种方式从用户的视觉路线来说,并不是最快捷的

【交互设计】选择时间设计
我们进一步改进这个布局,得到

【交互设计】选择时间设计
视觉路线是这样的,更符合时间的叠加,用户可以更直观的滑动选择时间点

【交互设计】选择时间设计

 

这样就完了吗?还没有,上面的例子,我们只是假设每30分钟为一个单位

如果我们每15分钟一个单位呢?时间点变得更多,这种布局就不合适了,我们要如何改进呢?

【交互设计】选择时间设计

改为这种形式吗?点击上下箭头,时间单位递增或递减。

这样的体验上,是相当复杂的,因为时间点变成了每15分钟一个单位,每一小时就会有4个时间点可选

假如初始化时9:00,用户需要选择11:00的时间点,就需要跨过8个选项,对于手机用户来说,这个操作是十分繁杂的

那么怎么去优化呢,可以把时钟跟分钟分开来,变成如下图:

【交互设计】选择时间设计

这样虽然增加了用户的选择次数,但是降低了整体用户选择的成本。

 

到这就结束了吗?

其实,我们可以利用一个小小的交互动作,就可以让前面那个方案操作成本更低

【交互设计】选择时间设计

利用手机触屏的操作特性,结合视觉引导,做成手指滑动选择的“老虎机”;

这样用户通过快速滑动,可以粗略的定位时钟,在通过慢速的滑动,选定分钟的数据。

比如:初始时9:00,我需要选择14:00,那么我快速滑动“老虎机”,看到时钟靠近14点时,我转为慢速滑动,最后定位在14:00

那么这种方式就是最好的方式吗?

其实还不是,因为交互没有最好的方式,只是最合适的方式。比如初次见到这种选择时间点的方式,用户可能不知道可以滑动,这时候就需要适当的新手指导了。

这里更多的是抛砖引玉,交互设计中思考的过程才是核心。

 

  • 最后来研究一个实例——芒果旅游网app(安卓版)

文章前面探索了侧重时间点的方式,这个实例就来探索侧重日期选择的方式,例子来自“芒果旅游网app” - 酒店预订 - 时间选择页面。

【交互设计】选择时间设计

 

第一眼,好像没什么问题,常见的一个界面

仔细思考后,发现这里采用了情感化的设计,在日历中,引入了今天、明天和后天。

再深入思考,不对啊,这里的情感化设计过度了,反而导致不少问题

 

存在问题:

如果用户计划出行日期为26号,现在准备来选日期,眼睛扫了一样,没发现26号。

思路1:发现了24号和28号,通过24号或28号推算,得到了26号的位置。

思路2:记得今天是25号,推算出,26号等于明天,找到明天的位置。

这是用户寻找26号的思路过程,也许脑袋转得快的,能一下子就找到26号的位置。但是这样一个思考流程,还是存在可以优化的地方。

 

优化方案:

去掉明天和后天,保留今天就行了,设计合适就好,不需要过度。

如果用户需要寻找26号,那么一眼就能找到。

如果用户不知道今天几号,只是想明天或后天出行。那么他只需要找到今天的位置,然后就可以推出明天或后天的位置。

 

为什么这里用具体日期比用明天和后天更好呢?

明天和后天,在日历里是以相对位置存在

而具体日期,则是绝对位置存在

对于有长久计划的出行人,一般都是用具体日期来安排

对于短期临时有出行需求的人,也许忘记今天是几号,但是通过今天这个坐标,他们很容易推出明天或后天的位置来。反之通过今天、明天、后天这些词,或者通过前后具体日期来推算出行的具体日期,难度相对比较高。

 

另外,对于图中的节日显示方式,在节日名称的上方,增加具体日期会更好些,方便用户快速寻找某一天的位置。

原:

【交互设计】选择时间设计

优化后:

【交互设计】选择时间设计

 

原创文章,作者:Tinadmin,如若转载,请注明出处:https://www.iamue.com/9138/

(0)
TinadminTinadmin
上一篇 2015-09-02
下一篇 2015-09-08

相关推荐

  • 【笔记干货】UCAN2017用户体验设计论坛

    作者: 阮小阮     忙忙碌碌一天这么晚还没睡是因为我在给大家编辑UCAN的干货哇~ 虽然我平常很懒,可我们真的只推干货哇~ 希望大家都能获取一些知识一些思考 互联网这么快,拥有平衡的能力真的很重要~!   董本…

    交互专题 2017-08-07
  • 「抖音」用户体验分析

    和大部分人想的不一样,我是抖音和快手的忠实用户,每天都会在上面花不少时间。在玩抖音几个月后,我开始思考和分析这两款APP的设计和技术,发现其实其中充满了很多“精巧”的设置。抛开APP的针对群体和社会影响不谈,只想说作为一个普通用户的感受。抖音的交互设计是沉浸式的。在推荐页面,你每次只能看到一个视频,系统默认自动播放。因为没有给你反应时间,我们会不由自主的盯着屏幕看,而人的注意力很容易就被当前的视频(视觉和听觉)吸引。这样的交互好处是人的...

    2018-04-02
  • 【IXD案例】国际第一时尚品牌VOGUE-iPhone端案例高保真原型-抽屉效果案例

    本次分享给大家展现依然是高保真效果的原型,上一次展现的是iPad版本的,这次是iPhone端版本的原型,和上次一样,我们依然以国际第一时尚品牌VOGUE为例:iPhone端的效果比iPad更复杂,难度更高,我们要做的是抽屉效…

    2016-02-26
  • Google如何从两方面正确简化产品?

    来源:优设网 作者:王笑Nothing编译   很多设计师同学为了适应简约的潮流,在简化产品方面绞尽脑汁,但简化不是两个不要:这个不要,那个也不要,简化是一个细心活。今天教同学们简化双板斧:重点是什么,何时简…

    2014-09-21
  • 交互设计与人类行为习惯的一些思考

    在交互设计中,利用很多的人类行为习惯作设计指引,如从左到右的阅读习惯,格式塔原则的视觉习惯等。很多的研究者对此已经深入研究,本文主要围绕习惯与交互设计的联系及相互影响的思考。好的交互设计是培养用户获得更好的行为习惯,更好地解决问题。

    2017-05-26
  • 一名交互设计师的日常思考方式

    如果有一天,当你发现自己“较真又矫情,苛求又世故,倔强还言辞凿凿”,别否定自己,也许你已经开始有点交互设计师的意思了。

    2017-05-05
  • 微信公众号哪些细节会影响用户体验?

    公众开发运营官网公众运营平台微信公众号哪些细节会影响用户体验?在微信公众号里面,哪些细节会影响大家对公众号的体验呢?下面小编就来为大家讲解一下这些细节,快来看看吧。1.无意义的自定义菜单内容第一个就是毫无意义的自定义菜单内容,很多企业公众号费心费力通过了企业认证,好像不用这个自定义菜单挺可惜的,然后就非得放些东西进去,但是并没有考虑目标用户是否需要。如果把公众号视作一个小应用的话,自定义菜单的功能可以类比App里的Tabbar,主要是实...

    2018-02-12
  • 干货推荐|40款独特的移动导航用户界面

    越是简易,你的APP/网站就越出色。移动用户的界面可以有很多种形式和风格。

    2017-05-20
  • 【用户体验工作坊】用户体验地图实践

    提升用户体验是企业信息化部本年度重点事项。为此,敏捷推进小组已经组织了两期“用户体验工作坊”,并和京东大学合作举办了“创新训练营”。同时“用户体验工作坊”也是用户体验提升计划的一部分,旨在推动部门内部所有产品进行用户体验的优化升级。参加本次“用户体验工作坊”的有来自企业信息化部各个部门的研发、产品和项目经理近50人。🔺 赵卫老师在讲授用户体验实践方法🔺刘泽鹏老师讲授“用户体验生命周期”赵卫老师首先讲解了用户体验五大原则:01不要强迫用户...

    2018-04-26
  • 如何利用动效提升用户体验

    我们不再是设计静态的屏幕,用户将会从我们的设计中看到实际的内容。

    2017-05-16