提升的控件 paint()事件被遮挡_设计锦囊 | 提升产品易用性案例分享-CSDN博客

本文链接：https://blog.csdn.net/weixin_39688170/article/details/111278484

提升产品易用性

案例分享

Design Tips

设计锦囊：

产品无言，细节有声，项目管理部不定期为大家分享产品设计中的优秀案例及解读，从微小之处学习产品的设计之道，通过学习沉淀将知识其转为工作所用，逐步搭建广院设计知识库。

① Airbnb减少不必要的输入成本

「手机动态密码登录」方式切换为「使用账号密码登录」时，输入的手机号码自动带到「使用账号密码登录」，减少了11次不必要的点击输入。清除按钮保持显示，一键清除，以便用户输入邮箱地址。

②Airbnb信息遮挡／提示不恰当

1、键盘弹起时，用户必须勾选的条约信息被遮挡，iOS用户需点击键盘「完成」按钮／Android用户需点击右上角下滑键盘的按钮，才能勾选条约完成登录操作。

☑ 优化方案：条约采用跟随键盘移动的交互形式，方便用户勾选，完成注册登录动作。

2、错误信息跟随键盘和“登录信息失效，请重试”信息提示，并不能明确指示哪项填写出错。

☑ 优化方案：错误提示信息采用“行内提示”的交互方式，提高信息指示性。

Design Tips

支付宝通过键盘设计降低输入成本

支付宝「停车缴费」功能，在键盘输入的体验上做了实用的小创新：当进行输入汽车归属地的操作时，会弹出信息显示为各省、直辖市简称的特殊键盘，实现快速点击输入，巧妙地利用低成本的细节修改降低了用户的输入成本。但键盘位置与主页显示器没留出安全距离，在iPhone X会造成误触手势键。

☑ 二轮思考：每个人对自己的车牌是很熟悉的，打出省份简称只需1-2秒，从这37个简称里选有可能需要3-5秒，所以该方案是否合理需要数据沉淀后才能做出判断。

Design Tips

抖音在触发点最近的地方显示弹窗

多数产品在设计模态弹窗引导用户进行操作行为时，都会将操作控件放在固定的页面位置(一般居中或者处于页面底部)。iOS版抖音会检测用户进行操作时手指与屏幕的接触位置，并将模态弹窗的操控按钮显示在离触发手指最近的地方(android版只有居中触发)随用户手部活动区域变化而灵活变更位置的模态弹窗设计，使用户在进行手势交互的过程中操作动作能始终在手部的舒适区域内进行，是应对大屏时代十分友好的体验设计。

☑学习要点：缩短操作路径、合理利用点击热区，是提高使用效率和反馈体验的方法之一。

Design Tips

微博自动弹出评论入口，降低用户互动成本

看微博时我们常常会被大量碎片的信息冲击，无关的动态我们习惯一刷而过，感兴趣的则可能多看几眼，手动评论互动的成本变得越来越高。「微博」刷关注栏内容，如果在一条动态上停留时间超过7秒会自动弹出评论的快捷入口，以降低用户互动的成本，提高用户互动的积极性。(此方式借鉴ins的设计逻辑，很好地提高用户活跃度与互动行为)。这样鼓励评论的小细节设计，会让你忍不住留下自己的碎碎念吗？

Design Tips

QQ查看文档的同时，点右上角头像就能进行沟通