恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
移动设备表单设计建议
0.0°
2017-02-25 自译外文 规范/资料 原作者: 未知 举报 1630 4 4 0


填写各式各样的表单是我们日常上网中经常会遇到的,对于大多人来说填写这样的表单并不是我们上网的目的,但是我们又不得不去填写大量的信息,表单只是获得用户信息的工具。


作为交互设计师,如何去设计一个高效合理的表单也是最基础的一个技能,当然这是建立在美观的基础上的,这一篇文章就会介绍一些原则如何在移动设备上设计出可用性高的表单设计。


1、用分段标签菜单的场景Image title

在2-5个选项的单选场景下应该应用单行的分段标签表单,不去使用下拉菜单。因为在5个以内的选项情况下,分段标签可以一样看出所有的选项,另外只需要一次操作就可以完成,下拉菜单需要两次操作:打开菜单,选择。


2、整个多个有关联的下拉菜单到一个区域Image title

这种形式遇到的情况不多,但是一个经典的案例就是选择日期的控件。其实日期表单在实质上是“年、月、日”三个单选下拉菜单。如果分开为三个独立的单选下拉菜单无疑增加了用户的操作量,并且减少了日期之间的关联性。


3、用开关选项的场景Image title

在一些互斥的两个选项中,比如“显示”“隐藏”,一般使用勾选菜单。如果使用下拉菜单的话,用户会更加关注而外的交互方式,而不是选项自身的内容。开关与勾选是最佳的二元选择的交互方式。


4、用滑块的场景Image title

在范围内做选择的场景下,应该首先考虑的是滑块控件。它可以快速地帮助用户做出选择,而不是一味地采用单调的下拉菜单。


5、避免多列的情况Image title

特别是在一些小屏幕的移动设备上,通常用户都是通过手指的点击来选择输入框的,所以保证一个输入框占一行是非常重要的。


6、用分档器的场景Image title

在用户需要细微调整输入值的场景下,优先选择分档器。可以帮助增加或减少一个固定的细微值,避免滑块带来的错误。


7、直接指出错误的地方,而不是在最后显示一串报错信息Image title

在出现错误的地方直接显示错误信息也是十分重要的。现在很多的表单都是在最后集中显示错误的信息,很多时候这样的显示,用户不知道到底错在哪里,更有甚者,错误信息会超出一个屏幕的范围,需要用户下滑屏幕才能看到,以至于不知道错在哪。所以,当用户出错的时候就在出错的地方显示他出错的原因。


8、不要重复显示必填选项的标志Image title

按照常理来说非必填的项目应该是不用显示的,这样一来,表单就会很短,用户填写起来也更加便捷。但是出于运营和产品的各种需要,非必填项通常都会出现,所以导致了许多菜单上多了很多星号在必填项上。当这种情况出现的时候,我们可以选择把非必填项区别显示,比如通过提示字的颜色差别。


9、把有关的信息分组显示Image title

格式塔里也提出过一样的设计规则。把相关的信息做一个分组显示,可以帮助用户快速扫描找到有用的信息。同样还帮助了表单分成多个有目的的块,提高了可读性和美观程度。


10、提供舒适的点击区域

Image title

用户在移动设备上不是用鼠标,而是用手来点击相关区域的,所以不要把按钮区域设计的太小,一定要遵循每个平台的设计规范,上面都有最小的设计数值。


11、遵循平台的设计规范


在设计app的时候一定要遵循平台的设计规范,因为在不同的app中用相同的交互模式对于用户来说十分重要,可以避免用户出错,符合用户的操作期望。

更新:2017-02-25

收藏

4人已收藏

  • 7

    作品

  • 5

    粉丝

  • 7

    关注

  • 被滥用的移动体验设计模式
  • 8-Point Grid System(8像素网格设计方法)
  • 设计新人如何开始一份设计规范
  • 每个产品必不可少的3个dashboard

    猜你喜欢

      2017-02-25 自译外文 规范/资料 原作者: 未知 举报 1630 4 4 0

      移动设备表单设计建议

      0.0°

      你确定要举报移动设备表单设计建议

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年02月25日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      4
      4
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录