作者: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/