时间选择器是我们在设计APP时常见的一种控件,用来帮助用户快速高效的选择/录入时间信息。虽然很常见,但若让你针对产品的时间选择功能来设计一款日期选择器,你头脑里是否对它有清晰明确的概念,快速输出合适的设计方案呢?如果没有的话,那么我们接下来就一起讨论一下,那看似简单的日期选择器背后的设计依据和设计要点。
用来选择一个很具体的时间,比如说出生年月,出发时间等。要快速精准的确定选择的日期,就需要将日期进行维度划分,通常情况下的时间维度有以下几个方面:某年、某月、某日、某时、某分、某秒。具体的展示形式如下:
可以用今天、明天、后天这种时间表述形式(比如滴滴),减少用户理解的成本,辅助用户快速定位。
可以在具体日期后面增加星期几,辅助对时间的理解和记忆。因为对于上学/上班族的我们来说,我们对周的概念会比日期更。当然不是所有的时间选择都适合增加周的概念来辅助,一般预约类的日期选择需要增加,比如会议日程安排、预约专车等等;而特定日期选择的就不需要了,比如生日的选择。
如果是日程安排可以增加上/下午,这样可以将时间选择范围进一步缩小,提升整体时间选择的操作效率。
没有的时间段不展示出来。比如滴滴的预约用车,是不能预约此刻之前时间段的,所以在此之前的时间就可以不显示,这样可以防止用户犯错。
时间维度不能超过5个,考虑到屏幕宽度,太度的话视觉上比较拥挤,操作起来也会很费劲,所以在选择时间维度的时候需要克制。
这个主要出现在日程安排的功能界面里,为的是方便在当下及时快速的操作,比如TIM和IOS原生日历的日程安排
日历选择器就是将时间以日历的形式进行排布,这种形式可以让用户对时间有清晰的概念,帮助用户选择需要的日期。它的使用场景下有两个大类,一种是单纯的时间选择,一种是对选择的时间做记录。它俩的外表基本相似,交互细节和设计要点有所不同,下面我们分开来介绍一下。
基本形式跟纸质的日历是一样的,不同的是只用在日历的最上方展示周(日、一、二、三、四、五、六),下方以月为单位进杨玉环容貌复原图行排布,可以进行上下滑动。
选择的时间段会局限在一个范围内,比如马蜂窝入住时间选择范围在1年内,12306时间选择范围在1个月内。
不能选择的日期会显示出来,但是会与可选择的日期做明显的区分,一般会降低文字灰度,且用户不能选中。
选择时间段时,在选择确认附近展示选择的时间段和选择的,帮助用户确认选择的内容,辅助用户校验。
如果你所设计的产品,承载了时间段的选择,承载了辅助信息,记录数据等功能,这种情况下日历的功能操作会比较复杂,界面内容也比较多,就需要这种承载力度大的单独页面来能满足功能复杂性的要求。
常用在轻量化的日程安排功能里面,用户在做日程安排的时候,需要对时间有清晰的概念,同时日期又只是一个轻量化的选择,所以这种就会选择这种弹层的日历形式。
在做产品设计的时候,首先分析自己所设计的产品的功能属性是什么样的,再根据实际的需求选择合适的时间选择器,希望本片文章对你有所帮助,如有任何疑问,欢迎留言一起探讨~~