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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
如何更好的设计表单
0.0°
2016-10-26 自译外文 规范/资料 原作者: Andrew Coyle 举报 1809 23 14 3

Image title


无论是注册流程还是数据录入界面,表单都是最重要的产品设计的组成部分。下面着重于常见的表单设计的注意事项。请谨记,这些指导方针和规则也是有例外的。


表单应该是一列的

Image title

                多列的违反了用户的垂直视觉习惯


顶部对齐标签

Image title

        用户对顶部对齐标签比左对齐标签反应更迅速。顶部对齐标签也可以应用在移动端。然而,考虑到左对齐标签更易一起扫描,在大型资料处理系统时都是用左对齐标签,他们降低了高度,比顶部对齐标签考虑更多。


分组与输入

Image title

        现在的标签与输入框很近,并确保了足够的高度,因此用户不会感到困惑。


避免全部大写

Image title

        全部大写使之不易于阅读


选项少于6个则显示所有

Image title

        放置在下面选择下拉选项需要两次点击,还需要隐藏选项。如果超过5个选项则使用输入器选择。如果超过25个选项,在上下文进行搜索。


禁止使用占位符作为标签

Image title

        用占位符最为标签很容易有话空间。但也导致了许多可用性的问题,Nielsen Norma团队的Katie Sherwin做了总结。


复选框要可扩展的依次向下排列

Image title


行为召唤要具有描述性

Image title

        行为召唤的状态必须是有意义的。


明确的指明错误

Image title

        显示用户发生的错误,并提供一个原因。


在用户填完表格后再验证(除非是在过程中帮助他们)

Image title


不要隐藏基本的辅助文本

Image title

        尽可能公开基本的辅助文本。对于复杂的辅助文本,考虑把它放在输入状态的旁边。


区分主要和次要动作

Image title

        有一个更大的哲学理论在争论是否把第二个选项也包括在内。


使用足够的字段长度

Image title

        字段的长度是提供给答案的。使用字符定义好的字段长度,如电话号码、邮政编码等。


标*和指明可选项

Image title

        用户并不能总是明确的知道做标记的含义(例如 *)。指明可选项会更好些。


相关信息分组

Image title

        用户会分组进行思考,太长的表单可能会让人不知所措。通过创建逻辑分组让用户更快的完成表单。


为什么提问?

可以省略可选字体或其他方法来收集数据。经常问自己这个问题能否被推断出、推迟或者完全排除在外。


数据条目越来越自动化。例如,移动端和可穿戴设备在用户毫无意识的情况下收集大量数据。考虑如何利用社交、对话UI、短信、邮件、语音、OCR、定位、指纹、生物等。


变得有趣些

生命短暂。没有人想去填表格。变得口语化些,有趣些,逐步完成,做到意想不到。这是设计师在表达公司的品牌所引发的情绪反应。如果做的对,它将提高完成率。只要你不违反上述规则。



原文地址:https://uxdesign.cc/design-better-forms-96fadca0f49c#.1zadjimur

作者地址:https://uxdesign.cc/@CoyleAndrew

更新:2016-10-26

收藏

23人已收藏

  • 75

    作品

  • 2695

    粉丝

  • 65

    关注

  • 11个表单设计小Tips
  • 产品设计的期望与现实
  • 七个设计的基本原则
  • 为什么大团队失败反而小团队取胜

    猜你喜欢

      2016-10-26 自译外文 规范/资料 原作者: Andrew Coyle 举报 1809 23 14 3

      如何更好的设计表单

      0.0°

      你确定要举报如何更好的设计表单

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2016年10月26日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      14
      23
      3

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

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

      登录

      手机号

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

      登录
      第三方账号登录