facebook对话链接_如何应用防错原则,看看 Facebook 和 Gmail 是怎么做的

91978df789fbd38326348f59ca9cead0.png欢迎来到有言有料,让思考更有张力

本文共 3873 字,预计阅读 10 分钟

作者|Siddharth Gulati

译者|张聿彤本文翻译已获得作者的正式授权(授权截图如下)dfb2c60fa37e45f4248ad1b082226e96.png

在用户界面(UI)设计中,重要的是要注意最细微的细节,以使用户的体验愉悦而难忘。在这里,你将学习如何使用防错原则来创建出色的用户体验(UX)。因此,如果你有兴趣为用户加倍努力,创建出色的用户体验,成为更好的用户体验设计师,请继续阅读。70c2059ff81edac1fe144bfc55419917.png防错原则来源于 Jakob Nielsen 提出的「尼尔森的十大可用性原则」。用 Nielsen 的话来说,防错包括以下内容:「 比好的错误提示更好的是细致的设计,这样可以在第一时间防止问题的发生。要么消除容易出错的情况,要么在用户提交操作之前向他们说明操作后果,确认是否要继续 」从本质上讲,需要在用户即将犯错时发出警报,目的是让用户在不犯错的情况下轻松地完成他们正在做的事情。防错原则之所以重要,主要是因为人类容易犯错,而且总是会犯错。从用户体验的角度来看,防错原则十分重要,原因如下。在如今信息过载的时代,用户承受着大量的信息负荷,并且很容易分心。 所以,犯错的几率变得更高。 这导致:
  • 用户难以完整阅读屏幕上的所有内容
  • 用户在进行打字、单击等操作时容易犯错误
作为负责任的用户体验设计师,我们的责任是在不打断操作流程的情况下,尽可能多地防止用户犯错。为了更好地理解这一点,让我们以美国领先的电子邮件营销服务 Mailchimp 为例,它允许用户以特定的时间间隔自动发送电子邮件。现在,Mailchimp 的服务已被全球各地的企业用来向客户传递各种信息,比如即时新闻和更新通知。由于服务的敏感性,以及 Mailchimp 不想让用户误删或发错电子邮件,因此设计了必要的保护措施。例如,我已经为网站的订阅者设置了一个特定日期发送的电子邮件,现在,我希望删除该电子邮件,系统将要求我确认这个的操作,如下图所示。0ec152729f5f44853a0152c3e374d7d7.png图1. Mailchimp 要求用户打字输入“DELETE”(删除)确认操作方式,作为错误预防从上图可以看到,除非正确输入“DELETE“的每一个字母,否则无法删除原定发送给订阅者的电子邮件。当我想向订阅者发送电子邮件时,Mailchimp 遵循类似的策略。为了防止意外出错,或是在不应该发送的时候发送电子邮件,他们采取了以下防护措施c864429e4e70376473cb18082e2d0c7d.png图2. Mailchimp 再次展示了错误预防功能,这次应用在用户发送电子邮件时从上图可以看到,在用户向订阅者发送电子邮件之前,弹出一个弹窗要求用户确认其操作。通过反复要求用户确认操作(这样做时不要过于打扰用户,不要让用户反复确认操作次数过多,这样会使用户感到厌烦),Mailchimp 很好地应用了防错原则,从而使用户感到安全,创建一个整体良好的用户体验。现在,让我们看一些在这方面很糟糕的设计(即没有错误预防),然后将它们与展示了良好设计的服务进行比较(即出色的错误预防)。

体验不佳的设计:Bitly

最近,我使用了网址缩短服务(生成短链接) Bitly。我按照流程进行注册,创建了一个新帐户。但是,当我尝试登录时,无法进行登录,并且只收到了一条错误提示,内容是“不对,再试一次”。但是,这样的错误提示没有告诉我到底哪里出了问题。我不知道输入错了什么:是用户名错了,还是密码错了,还是都错了?最重要的是,“ 不对”这个词在我看来也有些不被尊重的感觉,就像 Bitly 在嘲笑我的错误一样。可以参考稍后要介绍的 Facebook 的解决方案,一个好的防错策略可以清楚地将错误划分边界,即明确告诉用户到底是哪里出错了,是用户名,还是密码输入错误。Facebook 做得很好,甚至更进一步,如果你碰巧犯了这样的错误,它会告诉你,你的密码输入错了。c033dbeb6d04641ff4cfc6e2aeb82bee.png图3. 错误预防方面体验不佳的设计案例--不告诉我电子邮件地址/用户名或密码是否输入错误

另一个体验不佳的设计:ProtonMail

我习惯使用 ProtonMail,这是一家注重隐私的瑞士电子邮件服务商。总的来说,我对他们的服务感到满意,现在也一直是。但是,最近我观察到 ProtonMail 在防错方面也出现了体验不佳的设计。发送电子邮件时,如果我在电子邮件的主体中写了“附件”,但忘记实际添加附件,它仍然允许我发送电子邮件,并且不会弹出任何确认对话框来警告我忘记了添加附件。下文中我们将看到,Gmail 针对这一问题是如何设计解决方案的。2c5be7e7bb9200a5ad36b638f8099d1a.gif图4. 使用 ProtonMail 编辑邮件时,如果只写了文字“附件“,却忘记上传附件内容,邮件仍然可以成功发送这个操作将会带来什么问题?假设你正在通过电子邮件申请一份工作。你已经花费了数小时来整理自己的想法,以撰写出完美的求职信息,并竭尽全力让自己成为最合适的候选人。但是,由于你所有的精力都集中在邮件的编辑中,因此,你按下“发送”按钮后没有注意到忘记添加附件了……直到后来才意识到实际上并没有附上简历。现在,你处于尴尬的境地,必须决定是否应该发送尴尬的解释邮件(这次附有简历),或者继续找其他的工作……或者寄希望于这封电子邮件能成功地吸引 HR,请你发送简历(不太可能)。你可能会因为这个错误而自责,这个也是用户体验设计中关于防错原则的反面案例。

思考防错原则的重要性

用一个类比来解释防错原则在用户体验设计中的重要性。假设你在咖啡店里点咖啡, 你问服务员:“你好,我可以喝杯咖啡吗?” 服务员的回答很简单:“没有。”你很困惑地问他:“你确定吗?我闻到咖啡的香味了,看到其他人在餐厅喝咖啡。” 这次,他根本没有回应。在邻桌人点单后,你发现必须告诉服务员你想要哪种咖啡,否则,无法下单购买咖啡。因此,你只有具体说明要点“ 拿铁咖啡“,他才会为你提供服务。如果在餐厅的某个地方张挂一个牌子,上面写着“请告诉我们您想要什么咖啡,以便我们完成您的订单”,这不是很好吗?经历了这样的购物体验之后,你还会再去那家咖啡店吗?

优秀的设计:Facebook

还记得吗,上文中给出过 Bitly 的案例 —— 登录界面不会告诉用户是否输入了错误的用户名或密码。相反,Facebook 会告诉我到底犯了什么错误。例如,Facebook 通过明显地警告我输入了错误的密码,来确切地说明我所犯的错误。这样的实时反馈不仅减轻了我的认知负担,而且还帮助我创建了一个整体良好的用户体验,因为我知道,系统会清楚的告知我犯了什么错误,从而可以轻松地纠正它们。0cc4614ccbb98a1a13c563c7fb9e4885.png图5. Facebook 确切告诉用户在哪里犯了错误,帮助用户快速纠正错误,用醒目的提示说明输入了错误的密码Facebook 甚至更进一步,还提醒我是否输入了旧密码。例如,请看下面的图片,我错误地输入了旧密码,Facebook 提醒了我这一点。这种通过温和地引导我的错误来预防错误的方法,为我在使用 Facebook 时创建了一个整体良好的用户体验。f899df87adbe587baece6156be95cb84.png图6. Facebook 通过温和地引导用户知晓错误来预防错误的方法,为用户在使用 Facebook 时创建了一个整体良好的用户体验

另一个优质的设计:Gmail

上文中提到了 ProtonMail 作为错误预防方面的体验不佳的案例,因为它在用户犯错时不会进行提醒。相反,Gmail 在这一点上提供了优质的解决方案。如果我在电子邮件的主体中写了一个带有“ 附件”字样的信息,却忘记了添加附件,Gmail 会为此提供一个确认对话框,再次检查我的操作。对话框如下图所示,Gmail 提示我没有添加附件。通过提供此功能,Gmail 不仅让我在使用该系统时感到更安全、更有信心,还对系统的可用性产生了积极的影响。7869add522ccf32cbc7ebee0942a7cfc.png图7. Gmail 通过提醒我忘记添加附加文件,展示了在错误预防方面的出色设计。

我们可以从中学到什么?

需要记住的重点是用户始终都会犯错误。因此,一个好的用户体验策略应该是:1)通过提供建议来防止无意识的错误,因为用户通常会分心于手头的任务2)使用设计模式向用户传达他们的工作方式,鼓励用户仔细检查其操作(尤其是在删除之前),并在犯错误之前发出警告。这些简单的指导原则可以帮助降低用户出错率,并最终提高可用性认真细致地进行设计时,可以领先于用户,证明你的产品对用户和用户每天所面对的现实具备同理心 —— 在这个世界里,人们一边申请工作,一边查看最新消息,同时还在担心他们关心的人和事,以及作为一个人所包含的一切(信息负荷,容易分心,容易出错)。原文:https://uxdesign.cc/error-prevention-in-ux-design-how-facebook-and-gmail-get-it-right-ee9df267268f注:感谢阅读,以上内容由 TCC 翻译情报局提供,如有收获,还望各位设友动动手指点下广告和在看,也可分享到你的朋友圈!
- 知识拓展 -f136d4fe1259a251b41d74d0db7cf4e3.png关于文中提到的通过防错原则提升用户体验的方法,之前 Seven 在一次公开分享中进行了详细的分析,有图有真相,小编已经为大家准备好了。除此之外,小编还整理了 防错十原则 和 缺陷控制方法 的详细表格说明~想要了解更多关于防错原则知识点的小伙伴们,可在有言有料公众号后台回复 「防错」,即可获得完整版 PPT 和防错原则学习资料~- 有言有料 -有言有料是一个充满魅力的组织,是一群不安分的用户体验师和产品经理发起的分享交流学习平台,目前聚集了 20000 多位来自世界各地的互联人,相互学习成长,我们正在改变自己,改变世界。如果你也是在互联网不断寻求突破的小伙伴,想和志同道合的同伴一起交流,共同成长,添加群主微信:dool_e,备注「入群」,等待群主带领你和我们相见~88f85e22649033ac27e3803acb0809d9.png关注收藏公众号,获取最新咨询和知识有言|有料|有课|有物给有言来一套“素质四连“吧a4d49bafef95e11c0ec5151e11f8f1ce.gif

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/529132.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux 7 定时任务设置,centos7 配置crontab定时任务

1. 启动cron服务# 查看服务状态systemctl status crond# 启动systemctl start crond# 停止systemctl stop crond# 重启systemctl restart crond# 重新加载systemctl reload crond2. 开机自动启动cron服务systemctl start crond.service3. 通过crontab命令管理定时任务crontab命…

模拟灰度传感器循迹的程序_PLC编程,实例讲解西门子PLC模拟量编程

给大伙分享的是关于西门子S7-300PLC模拟量方面的实例,包含了以下几个方面的要点:1、对变送器进行取值,并进行控制2、对模数功能块 FC105 进行调用3、对 AI 模块进行设置4、对 AI 量程块进行选择这个实例, 调试的是一个流量调节回路…

linux mint 17 输入法,LinuxMint17.1 Rebecca中安装设置输入法

LinuxMint14使用了几年一直未更新,突然想去更新一下去发现源已经不支持了,所以就直接安装了最新版本。安装好以后发现还是跟以前一样的毛病,没有中文输入法,直接sudo aptitude install fcitx* 发现仍然不行。运行im-config设定FCI…

python组成不重复的三位数是多少_Python输出由1,2,3,4组成的互不相同且无重复的三位数...

题目:有四个数字:1、2、3、4,能组成多少个互不相同且无重复数字的三位数?各是多少? 程序分析:可填在百位、十位、个位的数字都是1、2、3、4。组成所有的排列后再去 掉不满足条件的排列。 程序源代码 方法1&…

作业调度C语言编写,【作业调度方案】 (C语言代码)

解题思路:如图所示,对于第一组样例输入,按照总工序提供的顺序,对于每个工件的工序从小到大,每次寻找有空闲机器的“空档”插入,就能让总加工时间最短。注意事项:按照约定,最短方案有且只有一种。参考代码:#…

python判断能否组成三角形_python三角形判定怎么做

python三角形判定怎么做?下面给大家带来具体的例子: 相关推荐:《Python视频教程》 例子:a int(input("The length of the side a ")) b int(input("The length of the side b ")) c int(input("The…

文件的记录c语言程序,c语言程序学生籍贯信息记录簿设计.docx

c 语言程序学生籍贯信息记录簿设计学生籍贯信息记录簿课程设计报告书班 级: 方 0909-1 学 号:姓 名: 苑 小 叶 指导教师 : 康 亚 男 石家庄铁道大学四方学院2010年 07月 14日1课程设计报告内容1. 选择题目题目: 学生籍贯信息记录簿设计 2. 内容摘要摘要:学生籍贯信息管理系统是…

如何修改linux的java路径_修改桌面文件默认存储位置的正确方式及注意事项

之前写了篇关于如何修改桌面文件默认存储位置,许多人在修改后出现各种问题,今天重新来讲解一下关于修改桌面文件默认存储位置的正确方式及注意事项。第一步、在E盘下创建一个文件夹,随便取个名字,或者默认为【新建文件夹】&#x…

secp256r1 c语言程序,rust代码阅读 之 libsecp256k1 (1)

在密码学的运算中, 数字通常是非常大的. 以 ECDSA 椭圆曲线为例, 私钥是 256 位的.所以在 libsecp256k1 这个库里, 定义了计算的元素 Field. 其中 n 为 320 位.pub struct Field {pub(crate) n: [u32; 10],pub(crate) magnitude: u32,pub(crate) normalized: bool,}为其实现加法…

python位运算符_详细介绍Python语言中的按位运算符

按位运算符是把数字看作二进制来进行计算的。Python中的按位运算法则如下: 按位与 ( bitwise and of x and y ) & 举例: 5&3 1 解释: 101 11 相同位仅为个位1 ,故结果为 1 按位或 ( bitwise or of x and y ) | 举例&…

c语言代码测试电脑性能,【图片】今天写几个性能测试,为什么C语言跑得这么慢呢??【c语言吧】_百度贴吧...

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼易言版本……跑100000万成绩不如PHP。。。。.版本 2.程序集 程序集1.子程序 _启动子程序, 整数型, , 本子程序在程序启动后最先执行.局部变量 参数, 文本型, , "0".局部变量 to, 整数型.局部变量 fr, 整数型.局部变量 n,…

python find函数 和index的区别_使用带有find和index的map时Python2和Python3之间的区别...

给定一个模式和一个字符串str,找到str是否遵循相同的模式. 以下是完全匹配,使得在模式中的字母和str中的非空字之间存在双射. 例子: pattern “abba”,str “dog cat cat dog”应该返回true;狗是一只猫,猫是b,而这些词形成了abba模式. pattern “abba”,str “dog c…

c语言3368题目,电大《C语言程序设计课程》期末考试复习资料

0993C 评议程序设计A 第 1 页 共 31 页C 语言程序设计课程期末复习练习一、单选题 1.在每个C 语言程序中都必须包含有这样一个函数,该函数的函数名为( )。A. main 2.每个C 语言程序文件的编译错误分为( )类。B. 2 3. 字符串"ab12\n"…

【LeetCode】链表精选12题

目录 快慢指针: 1. 相交链表(简单) 2. 环形链表(简单) 3. 快乐数(简单) 4. 环形链表 II(中等) 5. 删除链表的倒数第 N 个节点(中等) 递归迭…

python类的属性和对象属性_python 类属性、对象属性-阿里云开发者社区

类的普通属性:  dir(Myclass), 返回一个key列表; Myclass.__dir__,返回一个字典; 1、类的数据属性; 2、类的方法; 类的特殊属性: 1、Myclass.__name__  类的名字 2、Myclass.__doc__   类的文档字符串 3、Mycla…

击鼓传花c语言编程题,c语言-第5章 循环程序设计.ppt

《c语言-第5章 循环程序设计.ppt》由会员分享,可在线阅读,更多相关《c语言-第5章 循环程序设计.ppt(83页珍藏版)》请在人人文库网上搜索。1、第5章 循环程序设计,管理学院 电子商务系,2,第5章 循环程序设计,5.1 概述 5.2 while和do while循环 5.3 for循环…

python快速检测视频跳过帧_python实现视频分帧效果

本文实例为大家分享了python实现视频分帧的具体代码,供大家参考,具体内容如下 import cv2 vidcap cv2.VideoCapture(005.avi) success,image vidcap.read() count 0 success True while success: success,image vidcap.read() cv2.imwrite("fr…

最大素数c语言,for语句计算输出10000以内最大素数怎么搞最简单??各位大神们...

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼#include #include int* pt NULL; // primes_tableint pt_size 0; // primes_table 数量大小int init_primes_table(void){FILE* pFile;pFile fopen("primes_table.bin", "rb");if (pFile NULL) {fputs(&q…

python去重保留唯一一个值_Python DataFrame使用drop_duplicates()函数去重(保留重复值,取重复值)...

摘要 在进行数据分析时,我们经常需要对DataFrame去重,但有时候也会需要只保留重复值。 这里就简单的介绍一下对于DataFrame去重和取重复值的操作。 创建DataFrame 这里首先创建一个包含一行重复值的DataFrame。2.DataFrame去重,可以选择是否保…

自定义日历控android,Android 一个日历控件的实现小记

先看几张动态的效果图吧!这里主要记录一下在编写日历控件过程中一些主要的点:一、主要功能1、支持农历、节气、常用节假日2、日期范围设置,默认支持的最大日期范围[1900.1~2049.12]3、禁用日期范围设置4、初始化选中单个或多个日期5、单选、多…