我们的设计涉及到人们吃、喝、住、行、购、娱、医疗、教育、工作等各个方面,每个需求场景都是由事件触发的,对于事件的设计离不开时间选择。
比如什么时候就餐;什么时候出行;什么时候去看电影;什么时候参加会议;什么时候去就医;什么时候安排下一步计划,等等。
系统自带的可能难以满足设计需要,自定义其交互形式与样式可以实现更多的可能性。
一.选择到天(DAY)
排查设计的时候需要考虑以下几点:
a.标识出当天日期
b.标识出特殊日期
c.禁用不能选择的日期
d.是否有默认选中日期:比如预定车票时,默认选中今天 是否需要提供帮助用户选择的信。
e.明确表达当前已选的日期
f.一个清晰、明确的提交按钮或者点击即选中
1.采用弹出层的形式
这样做的好处是不用跳转新的页面,在当前环境下选择日期(比如说当前环境下有些内容是影响用户做出选择的);同时,可以点击弹层遮罩区域快速退出选择。如果没有特殊需求,仅仅是选择日期这种形式基本上够用了。
如果需要用户从某个月中选择某天,并且用户是需要参考星期几还是周末时,是需要展示一个月的日期面板的。如下图,“图标+日期”本身也是一个触发弹出层的按钮,用户点击某个日期即为选中,并收起弹出层。
2.打开新页面选择日期
打开新页面选择日期,毋庸置疑,新页面可扩展的空间比较大。更适合当前页面是为了表达一个整体独立事件,比如签到,设置行程、预约等,也就是说,除了要选择日期外,用户可能还需要设置事件的其他内容。总的来说时间是规划事情的首要元素,把选择时间放在突出位置更符合用户的心理模型。
3.多选
可设置多个日期,每点击一个日期即代表选中,一般适用于不同日期设定的是同一事件(突然想到本人生活中的一个场景,我会为工作日早上的闹钟设置为7:30,7:45,7:59三个档)。需要列出已选择的日期,用户可以选择取消,如下图。
二.选择到时、分(TIME)
排查设计的时候需要考虑以下几点:
a.上午与下午的区分:可以通过显示状态做出区分,比如8:30与20:30;或者通过AM与PM进行区分,比如8:30 AM与8:30 PM。
b. 是否有默认选中时刻:比如默认选中当前时刻。
c.明确表达当前已选的时刻
d. 一个清晰、明确的提交按钮或者点击即选中
如下图,对时、分的选择,从左往右,依次点击。好处是选择效率很高,缺点是,一旦某次选择错误,需要用户点击返回。如果选择完成后,才发现错选了,还需要从头点击选择一遍。
如下图,有明确的提交按钮,用户通过滑屏滚动点选,好处是选择时与分是单独进行的。