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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
如何为用户提供正确键盘输入类型?来看高手总结|北京蓝蓝 设计
0.0°
2023-08-31 好文转载 经验/观点 原作者: 张楚 举报 466 0 0 0

Android 和 iOS 系统都设计了针对特定表单字段的指定键盘输入类型。但大多数开发人员未能在他们的代码中指定正确的键盘输入类型。这会导致移动设备上的表单完成效率变慢。本文以 Android 平台为例。


一、输入类型并不总是 “文本”



大多数开发人员错误地将每个表单字段的输入类型设置为 “文本”。这存在问题,因为每个表单字段的输入并不总是纯文本。通常都有一些字段要求输入带有数字或字母和数字组合的信息。当用户尝试填写这些字段时,他们应该看到一个数字或字母和数字组合的键盘。



不幸的是,当每个字段的输入类型都设置为 “文本” 时,它会强制用户使用文本键盘来输入数字或字母和数字组合,输入时举步维艰,不是误点,就是需要频繁切换,输入体验十分糟糕。



因此,请务必为每个表单字段指定输入类型,以便系统能够显示相应的键盘。除了指定输入类型,我们还应指定相关行为,例如输入法是否提供拼写建议、是否将句子的首字母大写,以及是否使用 “完成” 或 “下一项” 等操作键替换 “回车”。



输入类型、行为、操作键整理如下:


 

 


1. 邮箱地址字段



表单要求用户提供他们的邮箱地址是很常见的。当我们将输入类型设置为 “邮箱地址” 时,它会为用户提供一个针对邮箱地址输入的键盘。这个键盘不仅显示字母,还可以显示 “@” 和 “.”,用户可以轻松地输入他们的邮箱地址。


 


2. 姓名字段



姓名是专有名词,英语中专有名词的第一个字母要大写。我们将输入类型设置为 “人名”,并且设置单词首字母大写。用户无需对英文字母进行大小写切换。


 


二、每个键盘对输入类型的反应可能不同



虽然每个输入法应用在所有键盘上基本都具有相同的功能,但每个键盘对输入类型的反应可能不同,有些显示额外的键,有些则不显示,使得输入体验受到不同程度的影响。



案例一:登录页面的密码输入



钉钉将密码框输入类型设置为 “密码”。假定密码为 z0h0a0n0g。



  1. 百度输入法显示密码键盘,完成密码输入仅需点击 9 次。

  2. 搜狗输入法显示文本键盘,用户需在字母和数字之间切换,完成输入需点击 17 次。也支持长按第一行的字母输入数字。

  3. 微信输入法显示文本键盘,完成密码输入需点击 17 次。不支持长按字母输入数字。



案例二:登录页面的手机号输入



钉钉设置电话号码键盘右下角为 “下一项” 按钮。



  1. 百度输入法的键盘右下角显示 “回车”,用户完成手机号输入后需手动获取密码文本框焦点。

  2. 搜狗输入法的键盘右下角显示 “下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。

  3. 微信输入法的键盘右下角显示 “下一项”,用户完成手机号输入点击下一项,密码文本框自动获取焦点。


 


Input Type 助力产品输入体验的提升



通过应用 Input Type 你可以正确的为每个文本字段设置特定的输入类型,以及看到每个输入类型(以及输入类型的组合)如何影响键盘。



我最初开发此应用是为了促进工作中跨部门高效协同,但我希望通过此应用能够赋能给更多的人,提升协同效率的同时更好的提升产品输入体验。你可以在这里免费下载:https://www.pgyer.com/vT29



感谢阅读,以上就是本次分享的全部内容,希望你能从这篇文章中有所收获,记得点赞 / 收藏 / 分享 / 关注,后续将会持续更新。



蓝蓝未来将会持续在平台上分享关于设计行业的文章。此外蓝蓝设计建立了 UI 设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,添加 vx 蓝小助 ben_lanlan,报下信息,蓝小助会请您入群。同时添加蓝小助我们将会为您提供优秀的设计案例和设计素材等,欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。



蓝蓝设计 (www.lanlanwork.com) 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的 UI 界面设计、BS 界面设计 、 cs 界面设计 、 ipad 界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI 设计公司、界面设计公司、UI 设计服务公司、数据可视化设计公司、UI 交互设计公司、高端网站设计公司、UI 咨询、用户体验公司、软件界面设计公司



文章来源:优设网 作者:张楚



分享此文一切功德,皆悉回向给文章原作者及众读者.



免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。


Powered by Froala Editor

更新:2023-08-31

收藏

0人已收藏

UI设计兰亭妙微

www.lanlanwork.com

  • 838

    作品

  • 374

    粉丝

  • 6

    关注

  • 兰亭妙微实际案例欣赏-音乐教育网站UI项目
  • 兰亭妙微:智能工业系统 UI 设计
  • UI 设计革新:看兰亭妙智能制造如何重塑人机交互,引领产业未
  • 《UI 设计:点亮大数据可视化的智慧之光》

    猜你喜欢

      2023-08-31 好文转载 经验/观点 原作者: 张楚 举报 466 0 0 0

      如何为用户提供正确键盘输入类型?来看高手总结|北京蓝蓝 设计

      0.0°

      你确定要举报如何为用户提供正确键盘输入类型?来看高手总结|北京蓝蓝 设计

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2023年08月31日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      0
      0
      0

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

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

      登录

      手机号

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

      登录
      第三方账号登录