前段时间参加各种校招，在网上填写过n+1次简历,每次填写顺利的话二十分钟搞定，麻烦的话可能要将近一个小时以上，有时候鼓捣了一晚上才投了12个职位，因此对填写简历这件事已经深恶痛绝。我一共有两段教育经历和两段实习经历，“时间”是每段经历必不可少都要填写的，因此每份简历至少要填四次，在填写时遇到过各种各样的时间表单的设计，有的操作繁琐，有的容易让人出错，有的甚至bug重重，只有极少的在填写时感到方便顺手。体验好的时间按表单在填写时，会让用户感觉到“每个我要选的年份都刚刚好在那里，不用不停地翻页寻找” 用起来特别爽。
那么如何才能让时间表单的填写体验更好呢？作为设计师我觉得有必要对填写时间的表单做一个整理与分析，用户的痛点，用户的使用习惯等等。根据不同的情景提出合理的设计建议，希望为大家在设计时间填写的表单时提供更多的思路。
1.使用场景和需求
除了填写简历，无论是web端还是移动端，时间表单的应用是非常广泛的。我通过平时的生活经验和相关的产品收集，对目前时间表单的填写的使用情景和用户常遇到的任务类型进行了大致的分类：
-
填写简历、个人资料、查询账单历史等
年/月为主，部分要求年/月/日 -
填写出行往返时间，保险购买等
要精确到具体的日期 -
购物时选择配送时间
精确到一天中的各时间段，如15号10:00-12:00
可以发现具体研究不同的使用场景和任务时，时间精确度的获取需求不同，可以分为年/月为主和以月/日和“日/时”这三种，用户的任务不同，界面的展现和交互方式都各有特点。
2.用户主体操作流程和特点
首先时间表单的填写主要的任务流程大致可以分为两大部分：
- 开始时间填写-确认；
- 结束时间填写-确认；
一般时间表单的填写大部分是基于选择的输入，有的同时提供文字直接键入和选择输入两种方式，只有文字键入的时间表单设计对于用户操作负担过重，而且用户还要担心格式的问题，因此已经逐渐被淘汰。
| 第一步 | 第二步 | |
|---|---|---|
| 1 | 开始年份 | 结束年份 |
| 2 | 开始年份/月份 | 结束年份/月份 |
| 3 | 开始年份/月份 /日 | 开始年份/月份 /日 |
| 确认/取消, 或自动跳到第二步 | 确认或取消 |
交互复杂
不同的场景对时间的精确值要求不同，有的可能只需要年份，有的要精确到日期，使得这两项任务有衍生出了多种细分任务，弹窗或下拉选择框的交互复杂度大大增加,操作方式更多样。
不同平台的操作方式不同
从操作终端上来看，web端和移动端也各有特点，移动端界面有限，选择时间时会使用弹窗或界面的切换效果，因此为了简化步骤，很多设计中开始时间和结束时间的填写在同一个弹窗内完成，使操作更加流畅。而一般web端的表单会采用下拉选择框的方式分别填写两个时间。
案例分析
根据以上每个使用场景的特点，挑选一些好的设计案例进行分析，看看我们的设计师是如何打破传统的交互方式，考虑结合用户场景思考的。
具体到某一日期时，待选的日期选项有30个，往往会通过月份日历的形式展现，例如下图12306的订票日期选择页，
选择具体日期的主流界面
交互设计师应该深入分析用户所处的场景有针对行的设计，尽量减少用户在填写时间表单时遇到困难，减少出错，提升效率。
移动端时间选择
甚至年份和月份进一步分为四步
年份/月份共四次操作
精确到月份日期
对比以上两种方式，第一种只有两个选择框，每个里面要进行年和月两种选择操作，而且还需要横向切换年份的操作，多种操作方式糅杂在一起，不同的信息排在一个界面上，不利于用户处理，容易发生错误，后一种在每个选择框中只进行一种操作，虽然增加了操作的次数，但操作简单重复性高，填写起来会更方便，但占用的宽度较大，开始时间与结束时间区别不清晰
简历日期的填写
移动端一般通过弹窗+滑动操作
一般需要填写到具体的日期
操作区域略小，手指滑动
去哪儿酒店住宿日期选择
用户在选择酒店的住宿时间时需要明确入住和离店两个时间，因此在设计上无论是web端还是移动端都要在同一界面中表示出这两个日期。
默认值显示，默认选择入住日期为当天，点击跳转日期选择页，整屏显示方便操作，下方有提示用户“选择入住日期”第一次点击后选择入住日期，点击时上方有提示，避免手指挡住，重新选择入住日期后，之前默认的离店日期数据清除，等待用户点击选择离店日期，选择离店日期完成后无需确认直接退出日期界面，显示已选定的日期，用户想要修改可再次点击进入
酒店入住离店时间
即使是智联，中华英才等可以保存简历的招聘网站，在应聘一个新的公司的时候，由于每个公司的简历定制模板不同，从后台取得的原始数据自动填充时会导致内容混乱，实习经历和教育背景顺序，时间等都会出错。
网友评论