如何设计防止数据丢失的破坏性操作

三分设

共 4309字,需浏览 9分钟

 ·

2022-06-26 21:34

点击 ▲ 三分设 关注,和 6 万设计师一起学习进步

译客 2019 · 第 14 


数据丢失是用户在使用计算机过程中遇到的最沮丧的事之一。他们不仅仅是丢失电脑的数据,也损失了投入的时间和金钱。对于企业而言,这意味着员工工时的浪费和公司资金的损失。不要让这种情况发生在你的用户身上。

一项研究发现,30% 的数据丢失是人为造成的。这就意味着,好的用户体验设计能够有效的防止这类灾难性问题的发生。下面是一些技巧,可以防止你的用户遇到这种问题。


在确认过程中使用红色警示信号

当用户点击具有破坏性的按钮时,不要立即执行这个操作。因为很有可能是用户误触了按钮。此时你应该做的是提示用户,使用确认对话框核实是否执行该操作。

请勿将此类具有破坏性的按钮设计成常规色,比如蓝色。相反,按钮最好设计成红色,来提示用户,他们可能在进行具有危险性的操作。红色是警示的强视觉信号,因为红色能够很轻易的引起我们的注意力。
    

避免在具有引导性的常规操作时使用红色按钮,因为红色有警示用户的意思。因此我们只能在可能出现破坏性操作的时候使用。相比于红色,冷色系的按钮能更好的引导用户操作,因为冷色系不带有警示的含义。

虽然红色按钮对大多数的用户能起到警示的作用,但是仍有部分用户无视这种警示。因此我们需要增加额外的视觉提示来警示用户。这对于那些难以区分色差的色盲用户和视觉障碍用户来说更加友好。
     

要想使你的警示信号更加强烈,我们可以在确认对话框中增加具有破坏性操作含义的图标。比如说,删除图标使用的就是用户熟悉的垃圾桶图像。当用户看到这个图标时,他们就会将当前的操作与删除动作联系起来。

同时,可以通过在页面顶部添加红色条纹的方式增强警示信号。现在,当用户看到这个确认对话框时,他们将会接收到三个红色警示信号,以提示目前正处于一个严重的状况,并且即将做出危险性的操作。使得用户更加注意自己的操作,停下思考,以此避免误操作。

设计带来的好处 -- 打破习惯性点击
随着用户使用某个 App 次数的增加,用户更容易培养出习惯性的点击操作。习惯性的点击使用户无需思考就能更容易、更快捷的完成操作。但是,也容易产生对破坏性按钮的误操作。红色警示信号能够使用户摆脱这种心不在焉而导致的误操作。

       

红色与“警告”和“危险”有着普遍的联系,并带有消极的含义 。我们可以看到很多警示和危险的信号都是通过红色来传达的。在设计中,红色的按钮能够唤起用户对伤害和丢失的恐惧感,从而能够帮助用户阻止错误的发生。这很容易奏效,因为人都有躲避危险保护自己的本能。

研究表明,红色的物体能够吸引注意力,并且能够促进一致的运动反应。这就意味着用户在看到用于警示破坏性操作的红色按钮时能够更快、更准确的做出反应。用户对一项任务投入的注意力越多,就能更好的完成这项任务。


使对话文本简洁

红色警示信号能够阻止破坏性操作,但这不是我们唯一需要考虑的内容。我们必须用简洁的格式来编写文本,从而确保用户能够更加容易阅读和识别。


“你确定想要 XXX 吗?”,在对话标题的末尾打上问号。例如,使用标题“删除帐户”来代替“你确定要删除你的账户吗?”,这样更易于理解。

不仅如此,同时请勿使用冗长的的文本来解释确认后会有什么样的后果。例如“你如果删除你的账户,你会丢失你的个人资料、信息和照片”。我们可以用列表方式罗列出操作后会丢失的信息来替代上述的方式,以便用户能够快速浏览。

在这个事例中,将文本单词从 25 个减少到 9 个使得对话框更加简洁。这样也使得对话框更容易被浏览与理解。

设计带来的好处 -- 更好的理解操作后果
确认对话框的目的是描述破坏性误操作的后果。用户需要阅读并理解这些细节,否则他们可能会得到无法预计的结果,一个冗长的对话会让用户难以理解。

大多数用户会选择跳过冗长的文字,因为阅读会花费他们很多的时间和精力。简洁的文字能够防止用户跳过阅读,同时能够帮助用户更快的完成操作任务并且减少犯错。当对话简洁时,用户可以更好地理解其行为的后果,并做出正确的决定。


居中对齐布局

简洁的文本使对话更容易浏览。但是,还可以进一步优化,通过中心对齐布局使整个确认对话框更容易浏览。中心对齐布局将图标与文本对齐,以便用户可以一起浏览它们。同时这种布局方式还使屏幕显得对称,图标更加突出,以防止图标被忽视。
        

设计带来的好处 -- 减轻眼睛的工作量
当使用眼动追踪仪追踪观察一个繁琐的左对齐布局对话框时,它将产生更多的注视时间和更长的扫视轨迹。简洁的对话框和中心对齐的布局则需要相对较少的视觉动作。通过更少的注视时间和更短的扫视,用户可以提高浏览屏幕的效率,做出明智的决定。
       

中心对齐布局还允许用户以单一视觉方向(从上到下)浏览屏幕。他们不需要在屏幕上移动他们的眼睛,只需要专注于屏幕的中心。使用左对齐布局,用户需要以两个可视方向(从左到右和从右到左)浏览屏幕。他们的眼睛需要做更多的动作,这会减慢他们的任务完成速度。


为确认操作保留红色警告信号

当具有破坏性的操作出现在确认对话框上时,你希望用户能够充分关注它,认真思考是否要执行操作。相反,当破坏性操作不在确认对话框上时,你不希望它引起用户的注意,视觉上的突出处理可能会让用户在无意识的情况下触发它。
       

如果不在确认对话框上,请勿在破坏性操作上使用红色警告信号。例如,设置页面可能会有一个“删除帐户”的按钮,但它不应该像一个引导操作的按钮,会吸引不必要的注意。

最好将破坏性操作设计为仅带有红色文本标签的独立按钮。使用更多的红色,会导致用户将其误认为是页面上的主操作按钮。

设计带来的好处 -- 使误操作更难发生
具有破坏性操作的确认对话框出现的次数越多,用户按错按钮的可能性就越大。通过减少页面上的破坏性操作,就能减少用户意外打开确认对话框的次数,这使他们远离误操作。
在页面上将破坏性操作与正常操作区分开,也可以使用户远离误操作。用户不会将破坏性操作按钮误认为是正常操作按钮,并按下它。
 
 
在确认后提供一个撤销按钮

即使在确认对话框,误操作仍然可能发生。有些用户可能误读了对话框内容或按错了按钮。以防万一,在确认操作之后,给用户提供撤消操作的按钮,并告知用户已执行的消息。
       

将撤消按钮和操作完成的消息放在页面底部的通知横幅中。可以根据破坏性操作带来的结果的严重程度,来决定撤销按钮是临时存在,还是永久存在。

如果撤消按钮是临时的,横幅和按钮将在几秒钟后自动消失。如果撤销按钮是永久的,直到用户按下“关闭”按钮才可将包含撤销按钮的横幅关闭。请注意,永久性撤消操作的技术实现难度比临时性撤消操作更复杂。

设计带来的好处 -- 允许用户从事故中恢复
撤消破坏性操作的选项允许用户从误操作中恢复,以防止数据丢失。数据丢失对企业和用户的生活造成严重后果。撤销按钮不仅可以挽回用户的数据,还能使用户的工作不受影响。


要求输入操作名称,加强用户关注度

如果撤销按钮不是可行的设计方案,则可以提示用户,在确认对话框中输入破坏性操作的名称进行确认。提示他们打字确认,使他们意识到这种破坏性的行为。虽然不小心按错按钮很容易,但是不小心输入错误的动作却很难发生,因为它需要很多步骤。
     

对于经常需要使用到破坏性操作的用户来说,这种操作方式影响效率。例如,删除帖子是社交媒体应用上的常见操作。要求用户每次都输入文字来确认,将使该过程效率低下,所以只在罕见的破坏性操作中使用这种类型的确认方式。

UX效益 | 确保用户清楚自己的行为
无意识地按下按钮要比输入文字容易得多。当用户键入文字时,他们必须考虑他们正在输入什么,并按下正确的按钮。与仅仅点击按钮相比,出错的空间更大。这使用户注意到自己的行为,以防止意外按下按钮。


数据丢失的灾难后果

当用户进入确认对话框时,他们很可能处于“灾难”的边缘。如果设计师没有采取措施防止用户按错按钮,很可能导致数据被破坏。将这些设计方案应用到你的设计中,将避免用户遭受数据丢失的灾难。


原文标题:How to Design Destructive Actions That Prevent Data Loss
文章来源:uxmovement
原创作者:anthony
原文链接:https://uxmovement.com/buttons/how-to-design-destructive-actions-that-prevent-data-loss/
翻译作者:择默
授权获取:张聿彤
文章审核:王翎旭
文章编辑:王翎旭
该译文并非完整原文,内容已做部分调整。如在阅读过程中发现错误与疏漏之处,欢迎不吝指出。如需转载,请注明来自 三分设 


热门文章推荐

译客专栏 2022 · 第 10 篇


共创成长训练营

三分设·星火会员


我们一起聊设计

三分设·微信读者群/城市群

欢迎添加 ⭐️  星标,获取每日好文推荐,每天早上 8 点,准时充电。加入设计微信交流群 三分设读者 5 群,期待与更多优秀用户体验设计师一起成长, 添加 益达 微信号【 Lil_Bug or【 Red-boy2020,备注【 三分设读者 】加入读者群!

分享设计心得,定期直播,零距离连麦,答疑解惑





点开『阅读原文』,欢迎你的加入星球

浏览 5
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报