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

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

相关推荐

  • APP UI动效设计中六个基本原则与最高原则

    app动效设计,现在已是各位APP设计师学习和临摹的方向。大家也会收集一些好看的APP动效设计作品。学习app动效设计,不是盲目的让界面动起来那么简单,一定不能滥用。要学会克制。

    2017-05-14
  • 用户体验要素,商品介绍,它们两竟发生了这种关系!

    有人去电影院是为了看电影,而有些人……上次我们讲到,网络课程的课程介绍的工作流程问题。广泛来说可以是网购中任何商品或服务的介绍的撰写或制作过程,这个工作流程和用户体验要素十分相似 ▼这一次我们来探讨用户体验要素具体对商品介绍的指导作用,先来看看一下详细的用户体验要素 ▼关于上图的模型,在《用户体验要素》一书中有详细的阐述,这里只讲与本文内容有关的部分。先来看到这个模型的右上方,有功能型和信息型两种分类。基于我当时的工作任务是商品介绍,那...

    2018-03-20
  • UI交互设计只需掌握这3点

    说到交互设计,就不能不提需求,因为所有的交互设计的工作都是基于需求,这也是交互设计的第一个着力点。因此,只有深刻理解需求以后,才有可能做出好的交互设计。举一个饱含血泪的例子:在做一个项目的过程中,有一个需求是要将一个应用的数据展示做一下调整,使之能够查看在三个月之内的该数据。当时,自以为已经很了解需求,只是将时间限制放开到三个月,同时,数据的展示限制在一个月内。也就是说,可以查看三个月内任意小于三十天的时间段。优点是:1)满足了需求;2...

    2018-02-27
  • 这场UED界的大会堪比最近最火爆的雄安楼市

    2011年,阿里UED委员会的几位童鞋一商量,想给互联网的UED们一个搭交流学习的场子,就发起了第一届UCAN。如今,UCAN已经从阿里的UED的大团建发展成了国内最热门的设计大会之一。2017届的UCAN今天在阿里巴巴西溪园区召开,小编在现场看到走道都坐着人,800多人的场子,10000人报名,快赶上抢房摇号的阵仗了。报名的观众不但专业齐全,视觉、交互、用研、工程师、产品经理一个不拉,而且来自的公司阵容也很强大,腾讯、百度、亚马逊……...

    2018-02-01
  • 移动APP:2015 UI/UX 趋势,Material design布局未来!

    移动APP:2015 UI/UX 趋势,Material design布局未来! 在国内,移动端的发展远远超过网页,初创公司们想拓展品牌都会首选手机App。那么你知道近期App设计风格的趋势么,想要做出不土、高逼格的App,以下的趋势你是…

    2015-08-04
  • 按钮体验设计:最佳的感受,形式和状态

      按钮体验设计:最佳的感受,形式和状态 按钮是一个普通的,几乎我们每天都要接触的设计元素.除了这个,由于按钮是一个在网页或者app上创造流畅的会话流体验的必不可少的元素,所以它值得我们为按钮这样最基本的元…

    2016-03-24
  • 腾讯MXD:资讯app为什么都长一个样?

    作者: Celine Wang@腾讯MXD   打开手机,国内的资讯 app 除了品牌 logo 外,几乎都长一个样。就如你敲开不同的门,发现房间不光装修风格一样,还住着品味雷同的主人。是什么造就了它们? 资讯产品的本质是连接内容…

    交互专题 2023-03-03
  • 当交互设计师承担视觉设计

    有人说,工科背景出身的交互设计师 跟视觉出身的交互设计 是的区别之一是,前者设计的东西会不够有美感,也就是很Low。虽然逻辑架构,特别是做大型管理系统的时候,可以很快把信息和功能模块归类,但是视觉知识和审美积淀,对我们这种工科生来说, 却是天生的Bug。

    2017-05-28
  • 同样是券商,为什么你家APP用户体验不好?原来还有这一招...

    券业新力量 | 服务所有券业人的梦想当前浏览器不支持播放音乐或语音,请在微信或其他浏览器中播放As Long As You Love MeBackstreet Boys - Backstreet's Back导言洞察用户喜好,吸引用户,留住用户,让用户满意,是所有服务业的本质。本文以行为数据切入,从三大方面、两个案例,全方位解析如何利用行为数据提升证券App用户体验。用户体验(User Experience)最早被广泛认知和提及,是在上...

    2018-03-30
  • 越碎片化的时代,越需要完整的用户体验

    用户体验是引领,而不是跟随。美学之上,预见未来。我发明了这个词,因为我觉得人性化界面和易用性太狭隘。我希望能用一个系统涵盖人类体验的方方面面,包括工业设计、平面、界面、人机交互和指南。
    ——唐·诺曼  1998

    2017-05-14