| 看看你的手机键盘隐藏了多少设计细节 | |
| 【返回本版】 【发表帖子】 【回复帖子】 | 浏览量 1102 回帖数 0 |
 |
lanlan123 等级 ☆ 楼主 发表于 2019/12/31 10:13:19 编 辑 |
|
|
手机键盘，可以干嘛？无疑是打字、信息输入，也是用户体验产品最常用、最直接的方式之一。 我们每天都在使用键盘，但是偶尔会遇到一些体验上的不足，如键盘挡住操作入口、很难控制键盘光标的移动...所以今天想梳理一下手机键盘里的要点、细节点，日后遇到有涉及到键盘输入的地方，可以有更多的思路去解决各种产品/设计问题。 一、键盘与命令类型：先简单说下键盘与命令词类型，对键盘有个全局的认识，方便在工作中知道每种键盘的用途。 1.键盘类型 从技术角度上看，市面上所有的键盘产品可分为：系统键盘（手机默认键盘）、第三方键盘（功能丰富，输入效率高）、自定义键盘（安全性高，有一定开发成本）。 从可提供类型看上，iOS一共提供了12种的键盘类型：其中8种是常用的：默认（中英）键盘、邮件键盘、字符与数字键盘、带小数点的数字键盘、存数字键盘、拨号键盘、网址键盘、外国产品键盘。 而Android系统键盘只提供了9种，但大部分和iOS的键盘类型一样。因此需要我们在交互稿中，标明对应的键盘类型。 2.命令词类型 而键盘命令词的类型上，iOS提供的也很丰富，多达11种。而安卓则少些，但基本能覆盖所有场景了。 3.H5里的插件 iOS自带有“上一项”和“下一项”的键盘插件，因而在一些H5表单中可以灵活选择上/下一个文本框或选择器。而Android在H5是没有“下一项”命令的（无论第三方还是系统键盘）。因而在H5页面中的表单中，往往需要提供一个外部插件来辅助用户输入。 二、设计要点：盘点了键盘与命令词类型后，接下来梳理一些设计要点，避免今后工作中踩坑，完善产品设计细节。 1.“删除”不完全是“清除” 键盘上的“删除”按钮可以逐一删除输入结果，界面上的“清除”icon也能做到。但二者间在特定的技术环境下，会存在交互上的差异。 2.键盘可以附带功能入口 产品设计时总有一个固有思维：一定要将某个按钮/功能/操作放在某个界面上，因此有时会受到“视觉布局怪异、功能关系不搭”等的困惑。遇到这种情况时，可以试着将功能和键盘绑定在一起，依附在键盘上才出现。让功能和内容间的关系更加独立开来，释放页面压力。但是有个提前：这些功能/内容尽量是和用户的输入行为有关联的，不要把所有功能都添加上去。 3.注意键盘的遮盖区域 在一些表单设计时，应该注意键盘弹出后对界面布局、用户操作的影响。一些重要信息、操作按钮要尽量放在键盘的遮盖区外，避免用户‘要收起键盘才能操作/看到’的尴尬局面。 4.“隐私数据”尽量用随机键盘 对于个人财产、身份信息等敏感数据的输入时，用户对该类型信息的重视程度，明显高于其他类型的信息输入。 所以产品设计时可优先考虑 “自定义随机键盘”（指键盘上的字母/数字等随机排布），以保护用户财务和隐私安全。 5.命令按钮位置的不同 在手机键盘里输入文字时，iOS由于系统的限制，对文字的发送指令只能在键盘上来完成，因此iOS用户的交互操作都全部集中在键盘右下角。而Android端就灵活很多，不仅可以在键盘上执行发送指令，也可以在输入栏/搜索栏周边新增操作入口。即使大部分产品都这么做，但还是有部分产品做到了‘两端对齐’ 6.预判用户的行为 用户行为的预判，指的是当我们明确知道用户目的、能推测出用户下一步操作时，可以做一些减少用户操作步骤、提升输入效率的设计，如：自动调起键盘在一些表单输入的流程中，当能预知到用户的下一步操作时，完全可以帮助用户自动调起键盘的（尤其是需要跳转页面才能输入的表单）。 三、有意思的交互：最后盘点一下，在一些第三方和系统自带的键盘上，都有哪些有意思的交互细节？ 1.更准确地移动光标 在输入过程中，想将“光标”移动在某个文字附近是一件比较麻烦的事，尤其是在小屏幕手机里。 2.长按的彩蛋 除了长按键盘外可以移动光标外，在一些第三方键盘上也隐藏了“长按”的彩蛋。更多文章就在蓝蓝设计每日一贴。您可以直接联系优秀的软件ui设计提供者北京蓝蓝设计,北京蓝蓝设计为您提供最好的设计服务。 欢迎访问,开始愉快的合作! 网站：www.lanlanwork.com 全国统一客服热线：400-608-6026 公司邮箱:weibaobei@163.com |
||
| 1 |