大喜

北京小赛车直播网站:解析App中的2大时间选择器

大喜 APP设计 4298浏览

pk10技巧 冠亚和稳赚 www.581n8.cn App中常使用的时间(日期)选择组件有滚轮式与日历式2种。同样都可以实现具体时间或时间段选择的功能,实际应用中该如何取舍呢?今天我们就来看看这两种方式各自的优势与使用场景。

一、滚轮式时间选择器

交互方式

1. 点击btn呼出选择器

①从屏幕底部呼出弹层,如滴滴

②从菜单栏下方呼出弹层,如网易有钱

③在当前屏幕展开,如TIM

2. 上划滑动滚轮进行选择

3. 点击确定按钮进行提交

 

优势

1. 取材于用户现实中熟悉的密码锁、记分牌样式、用户熟悉上下滑动的操作方式,学习门槛低

2. 体积小,节约空间,多种页面位置,方便与多种情景进行配合3. 对用户的操作干扰性较小?

劣势

1. 滚动选择方式较枯燥,在滚轮选项很多时,用户可能会在多次滚动选择中产生不耐烦情绪

2. 除了数字外没有其他信息进行核实确认

3. 视觉表现不够生动

 

适用场景

1. 用户对自己要选择的具体时间节点非常明确,例如生日、纪念日、预约服务、待办事项

2. 不同的用户选择的时间节点跨度很广,例如生日的年份会从1900-2018

 

使用建议

1. 选项数量一般为2~3项,最多5项;

2. 为用户设置合理的默认选项,减少操作次数,提升效率,例如:

3. 选择合适的展开位置,把滚轮选择器放到控件触发区域附近,方便用户操作
4. 用“今天”、“昨天”等相对概念,更快的激发人对时间的感知,例如上图滴滴、TIM
5. 不显示不可选时间,暗示用户可选日期,降低用户误操作可能性
6. 若有选项为非必填项,可提供忽略该选项操作,如下图生日管家,可选择不填写年份,点击忽略按钮后,年份收起。

二、日历式时间选择器

交互方式

1. 点击btn打开选择器,通常为新开页面(如上图飞猪)或全屏弹层(如去哪儿)

2. 点击或者滑动选择某一具体时间或时间段

3. 点击确定按钮进行提交

 

优势

1. 取材于用户现实中熟悉的日历样式,用户学习成本低。

取材于用户现实中熟悉的密码锁、记分牌样式、用户熟悉上下滑动的操作方式,学习门槛低?

优势

1. 取材于用户现实中熟悉的密码锁、记分牌样式、用户熟悉上下滑动的操作方式,学习门槛低

 

劣势

1. 占用面积大,新开页面或全屏弹层对用户操作的连续性干扰较大

2. 单页展示的时间选项较少,不便于选择时间跨度较大的时间段

 

适用场景

1. 用户不能明确具体时间,只有大致范围,例如这个月的某一天

2. 用户需要对自己选择的时间进行二次确认,例如通过星期确定时间有没有记错

3. 不同用户选择的时间主要集中在一个范围内,如预定火车票主要集中在未来一个月内

 

使用建议

1. 设置合理的默认页面,减少操作次数,提升效率。通常采用日历式选择器的场景都是选择近期时间,所以默认页面为当前月,如本章节顶部示例,都默认展示当前月。

2. 提供返回默认页的按钮,方便用户进行选择;如下图生日管家、大姨妈,在查看日历时,当日历显示页为非当前页时,出现返回当前日期按钮

3. 当选择时间范围跨度较大时提供快速跳转的方式,可以与滚轮式选择器配合使用
4. 将不可选择的时间置灰,暗示用户可选日期,降低用户误操作可能性

总结

综上所述,滚轮式时间选择器和日历式时间选择器各有所长,设计师要根据实际场景对分析需求并灵活判断该用哪种交互方式更合理。
当然,没有最好只有更好,今天分析的两种方式只是较为常见的选择方式,可以用于大部分场景下。在这之外也有其他特别的方式,例如:
货拉拉:弹层外区域显示已选中内容自如:表格式选择滴答清单:可自定义选择日历的排布方式详细情况就不在这里唠叨啦,如果你感兴趣的话,百看不如一见,不妨亲自去试一试~也许会有新收获哦。?

 

原文地址:海盐社(公众号)
作者: 阿肆Stella

 

转载请注明:pk10技巧 冠亚和稳赚 » 解析App中的2大时间选择器

登录收藏

学UI就上学UI网!越努力,越幸运!

“学UI网pk10技巧 冠亚和稳赚 www.581n8.cn?”最值得关注的UI学习平台! 每天发布高质量的设计教程和分享设计经验,服务于20万UI设计师,帮助初学者快速转型。每周六晚上免费YY公开课(36013311),给大家提供更多免费学习的机会。想成为设计师的你快来关注吧!

【特色推荐】

APP截图站app.www.581n8.cn” 海量APP截图,让你灵感爆发!国内最好的APP截图站。

UI作业网 zuoye.www.581n8.cn” 每一个作业题都尽量配有教程,交作业就有大神免费帮你点评作业,爽歪歪!

UI设计导航站 hao.www.581n8.cn” 专为UI设计学习者打造的资源+学习,双用途的网址导航站。亲爱的,你收藏了吗?

 
你可能喜欢的:
让用户赞叹不止的信息录入技巧让用户赞叹不止的信息录入技巧
【干货贴】关于提示框的那些事儿【干货贴】关于提示框的那些事儿
需求拆解秘诀——兵分三路进攻法需求拆解秘诀——兵分三路进攻法
Dropbox设计师总结,如何让界面信息更加聚焦Dropbox设计师总结,如何让界面信息更加聚焦
分享功能,你可能了解的还不够多分享功能,你可能了解的还不够多
“功能性与使用性取舍”原则在界面中的应用“功能性与使用性取舍”原则在界面中的应用
移动端中的 “预期设计”有哪些?移动端中的 “预期设计”有哪些?
快速掌握列表导航的布局快速掌握列表导航的布局
完美像素入门指南,魔鬼都在细节里。完美像素入门指南,魔鬼都在细节里。
Atomic Design 原子设计理论精华总结Atomic Design 原子设计理论精华总结
?
  • 端午节湖北接待游客1558万多人次 实现旅游总收入61亿元 2018-11-21
  • 自家车给自家店拉货咋就成“非法营运”了? 2018-11-21
  • (两会受权发布)中华人民共和国副主席简历 2018-11-20
  • 远离闹市喧嚣 亲子携手感受特色小镇的生活美学 2018-11-20
  • 租购并举渐入佳境 构建楼市阶梯型消费 2018-11-19
  • 向德荣寓言:农夫、青蛙与苍蝇(原创首发) 2018-11-19
  • 2018首届“中新广州知识城杯”绘画摄影作文大賽·奥一网 2018-11-18
  • 任何时候,国家安全都是老百姓最"稳"的幸福 2018-11-17
  • 别扯没用的,土地事实上属于地方政府才是关键。粮食更重要,咋不炒粮食? 2018-11-16
  • 中考科目改革催热高价冲刺班 2018-11-16
  • 因滑门存隐患 现代汽车召回2339辆起亚嘉华汽车 2018-11-15
  • 异类非人思维。如一尼安德特人从2万年前发出的声音。 2018-11-15
  • 【专题】王学义教授做客长城网燕赵名医大讲堂 2018-11-14
  • 广州市从化区人民法院公告专栏 2018-11-14
  • 美媒:中国歼10改进型能力强悍,已成美空军强大威胁 2018-11-13
  • 690| 599| 650| 589| 698| 613| 640| 796| 962| 630|