5种设计策略,让你的UI更加安全稳妥

安全的设计应该是清晰,简单并且能够引导用户的。


安全的设计应该是清晰,简单并且能够引导用户的。

5种设计策略,让你的UI更加安全稳妥

我们现在所面临的网络安全问题一直都很严峻。无论是更改社交媒体帐号,注册新论坛,还是下载新的APP,我们都的数字身份一直都存在各种各样的潜在安全风险。开发团队花费了大量的时间精力投入到开发和设计当中,改进流程,优化加密方案,来规避这些问题。

黑客攻击有网络安全专家和开发者来应对,而用户所面对的多数问题,则更多的需要设计师来动脑筋解决。通过流程和UI优化,设计师能够让用户尽可能地规避一些潜在的安全问题,即使这个过程中可能会产生体验上的障碍和不适。这篇文章可以和上一篇《4种障碍设计方法,改善产品用户体验》搭配起来看~

1、不同内容的交互界面应该看起来不同

每当用户要执行关键性的任务或者操作的时候,比如更改账户设置与密码,这个时候用户应该保持紧张和专注,那么设计上就应该帮助他们进入这样的状态。因此,UI 应该让用户清楚他们应该做什么。

如果用户必须在一屏上输入帐号/邮件,在另外一屏上输入密码,那么设计师应该参考 Yahoo 和 Gmail 的设计,让两屏看起来不一样。只是将“用户名”/“邮件”标签替换为“密码”是远不够的,因为两屏整体看起来几乎是完全一样的。

首先,输入框中的引导性的文本,作为整个屏幕用户交互的核心,应该看起来不一样,因为它们是最吸引用户的一部分,要表述清晰。在不影响整个品牌用色的前提下,使用不同的色彩来区分用户名和密码输入。如果要进一步改进,建议针对界面中的指引性的图标进行优化和修改,比如让两个界面在图标上进行区分。

5种设计策略,让你的UI更加安全稳妥

2、向用户展示接下来的交互

在我看来,可预测性是UI的可用性的重要组成部分,因为它和用户在产品使用时候的便捷性是关联的。如果网站或者APP 在某些流程或者细节上有太多的意外,会让整个交互显得不那么正常。但是如何用户正在做某项关键的事情,甚至会影响到账户和整个体系的安全,那么超出他预期的情况可能会导致用户关闭当前操作,重新开始流程,因为他会害怕这个操作给整个体系带来不良的影响。这样一来,整个体系的用户体验就显得很混乱了,整个交互的成本就很高昂了。

使用进度条和步骤来展示后续交互是提升可预测性的一个简单方法,很容易实现。

5种设计策略,让你的UI更加安全稳妥

当用户点击某个链接的时候,他们并不清楚这个按钮会不会被引导到另外一个网站。因此,最好的方法是当用户在点击这个按钮的时候,以弹出框提醒的方式告知用户即将跳转到新的页面,并且提供继续跳转,或者停留在当前页的按钮。这样的提示能够有效地防止用户意外离开,并且提供更多信息说明。

而对于进阶用户,他们无疑是清楚这样点击所带来的实际效果的。所以,当用户在多次点击这一按钮之后,提供一个“不再继续弹出”的选项或者按钮,让熟悉这一操作的用户,不再被骚扰,让整个用户体验得到改进。

3、强迫用户执行必须的操作

用户的惰性一直存在,无论是常规的操作,还是和安全相关的关键性操作。这一局面所带来的潜在安全风险是无法忽视的,用户在绝大多数时候保持着“这样大概不会有问题吧”这样的状态。只有当所需要的关键操作不是随手就能完成,需要用户花费几秒钟集中注意力来执行的时候,他们才会更认真一点,来搞定任务。

因此,解决这一问题,有两个解决方案:

  1. 让每个操作尽可能简单。设计师的职责是简化数字产品的使用,对于产品中很少使用的部分同样要这样优化处理,比如设置。
  2. 要求用户完成他们必须执行的部分。如果开发者要求用户进行完整的安全校验,出于责任和安全上的要求,必须让用户配合工程师完成这些环节的正确操作。

5种设计策略,让你的UI更加安全稳妥

而基于Javascript 来实现的校验和检查程序就是这两者结合之下完成的功能,它不仅简单易用,而且为用户提供了安全上的保障。

4、只显示必要的信息

如果你呈现的信息太多,那么不仅需要为用户解释其中必要的信息,而用户还得区分其中必要的和不必要的信息。

要展示足够多的内容确实很容易,但是并非信息越多越有用。当涉及到安全相关的设计的时候,有必要同开发者和安全策略相关的专家进行紧密深入的合作,他们能够帮你区分哪些信息是需要为用户展示的,而哪些不需要呈现。呈现有限的信息让绝大多数用户不会信息过载,相应的,这会限制进阶用户,但是这是有必要的。

额外的信息可以隐藏在“更多选项”的菜单中,而Apple Music 就是这么做的。这允许一部分进阶用户执行更深入的设置,但是又不会让普通用户信息过载。

5、清晰比漂亮更重要

外观的设计应该围绕着功能来进行。对于安全性而言,功能比漂亮的设计来的更加重要,所以,你的设置界面的可用性比起美观是更需要优先考虑的事情,牺牲功能而追求美观无疑是亏本的设计策略。

黑客对于每个应用的危险是同样巨大的,这就是为什么要进行合理地设置,使用遵循安全策略的交互。

结语

考虑到安全性的设计是一项艰巨的任务,所以设计师和开发者以及安全专家都应该通力合作,才能最终实现目标。而商业产品在这方面的需求尤其明显,给进阶用户的权限,边界要谨慎设置。

安全的设计应该是清晰,简单并且能够引导用户的。

 

原文作者:Bastian Heinlein

原文地址:Uxplanet

译者:@陈子木

译文地址:优设网

本文由 @陈子木 授权发布于人人都是产品经理,未经作者许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/20360/

(0)
CatherineCatherine
上一篇 2017-08-04 12:58
下一篇 2017-08-04 13:39

相关推荐

  • 物联网产品用户体验设计的5个关键

    来源:物联之家网编译:冬夜物联网智库 整理发布转载请注明来源和出处------【导读】------创建物联网产品良好用户体验的5个关键:简化入门、顺畅的跨平台设计和交互、个性化和背景、一体化体验、创新体验方式。设计一个伟大的、用户体验极佳的物联网产品说起来容易做起来很难。仅仅为一个新应用程序构建直观的用户体验就极具挑战,而物联网系统通常由多个设备、多个具有不同功能的应用程序和接口、输入输出数据流和用户权限分配组成,因此,为如此复杂的系统...

    2018-04-10
  • 『设计|交互设计』2018年交互设计趋势解析

    本文转载自:设计前沿2018年交互设计趋势解析2018视觉趋势Pantone 2018流行色:紫外光色Pantone 官方翻译为「紫外光色」,紫外光色是强烈挑动思绪与深思的紫色调,传达独创性、创造力及前瞻性思维,为我们指向未来。彩通:18-3838 紫外光色颜色代码:#5f4b8bRGB:R 95,G 75,B 139CMYK:C 71,M 73,Y 7,K 8从2017年下半年开始,紫色配色的作品开始很多,所以2018年这个色也是一个...

    2018-04-25
  • 【用户体验.春节特辑】一本相册(总第269期)

    亦可访问www.koushutianxia.com了解详情编家谱   修家史   留视频建祠堂   亲互动   传万代总第269期我的发小蔡廷是我们这座江南古镇的一位”达人”,这并非他有什么才气,而是他的行为举止与这座千年古镇淳朴温和的民风相违和。天气刚有点热他便剃了个秃瓢,赤裸着上身,永远穿着条军裤,再热也不换装。腹部有两条贯腹的伤疤,象两条粗大赤红的蜈蚣僵卧其上。他从不拉帮结派,依附于任何人,不欺行霸市,不欺凌老弱,但是蛮不讲理。他...

    2018-02-20
  • web表格设计攻略

    在后台管理系统、数据类产品等的设计中,表格作为一种常见的信息组织整理手段,甚至是web页面的基础设施之一,其重要性不言自明。结合最近做的几个项目和相关设计经验总结,特此整理出这样一篇设计攻略,希望能够对你的设计有所帮助。

    2017-04-28
  • 从逻辑层、感官层与知觉层,讲述体验设计的表和里

    什么是合格靠谱的体验设计?在逻辑层讲一个通顺的故事。什么是触动人心的体验设计?在感官层唤起人的体感记忆。什么是经典不衰的体验设计?在知觉层建立起认同和反思。你的设计逻辑性和方法运用很强大,很擅长做工具型的产品设计,但在设计的创新性和情感体验上还需要进一步加强。任何游戏化的设计都必须认识到:外在奖励会显著降低玩家的内在动机。游戏化的经验很简单:不要盲目地将外在动机附着在内在动机上。

    2017-05-13
  • 网易云音乐交互负责人|从一次活动设计,聊聊交互设计师的3个阶段

    交互设计师的三阶段:有美感、有逻辑、有sense

    2017-05-18
  • UED专访 | 众建筑:未来城的边缘

    📌 编辑 | 裴盛📌 采访| 杨紫惺 李思远 李佳琪📌 视频 | 裴盛EXCLUSIVE INTERVIEWUED × 众建筑玻璃框景中,映出木构的筋骨红砖青瓦间,闪烁金属的光芒古老与现代在这座“新生”四合院中交织年轻的的思想碰撞出新时代的活力观察生活、测试构想、生产建造踏进“众建筑”,寻觅空间的更多可能点击观看专访视频UED × 众建筑专访视频 ©UED1“三人成“众”“众建筑”,既是对其由三位合伙人共同创立的直观描绘,更符号化地表达...

    2018-02-07
  • 演示|一个交互设计师从接收需求到产出的过程

    从接收需求到产出?这过程中到底经历了什么?不妨来阅读本文作者的文字,一起来了解了解吧~【需求概述】
    商品,增加商品类型,分为普通、赠品两种。赠品可下单购买,也可根据订单金额及对应代理级别配赠率赠送。可按照代理级别,设置对应级别的配赠率。当代理下单购买普通类型或赠品类型商品,配赠条件满足时,在支付订单前提供选择赠品操作,代理可选择配赠金额范围内的任意赠品,也可不选择;选择赠品,并支付成功后,对应订单增加配赠商品信息。
    注:配赠金额=订单面价金额×对应等级配赠率。目标用户:某护肤品牌微商代理
    年龄:18-40占绝大多数
    性别:女性占98%
    职业:微商
    设备:iphone及以上
    场景描述:某天,代理a在清点仓库库存的时候,发现最近热销的某品牌商品库存都不多了,想着,到时候缺货会影响自己的销售及客户的满意度,暗想着,要再进些货才行,于是她对库存不足的商品进行了一下盘点,盘点完毕后,她拿出手机,将需要订货的商品一一加入购物车,加入完毕后,她核对了一下商品的金额,正准备点“支付“按钮进行付款,忽然看到付款按钮上方有一条提示,说”还差500元就可获得免费赠品“,她心一动,反正要买,只要加500块钱,就能免费获得赠品,有何不可?于是她当即便在某一商品下面增加了数量,满额后,提示文字就变成了”可获得免费赠品“,确认金额后,她立即点了支付按钮,来到确认订单的页面,快速浏览了一下自己的收获地址及信息,便赶紧看获得什么样的赠品,果然,在支付的上方又看到了配赠说明的提示,提示我”选择赠品“(这里说明一下,之所以将提示语都放在同一位置,是为了让前面界面的视觉路径在同一水平点上,使页面结构更整洁),点击进入”选择赠品“界面,参照页面给出的赠品金额提示,选择了想要的赠品,由于选择的赠品太多,从上下拉到下浏览起来效率太低,于是她又点击了按钮”已选赠品“进行复核了一遍,确定完毕后,回到确认下单的页面,便满意的点击了”支付“按钮,发现金额与未选赠品前的金额一致,便放心的提交了订单,订单支付完毕后,引导代理来到了订单列表页面,上面还特意标明了”含赠品“字样提示,a点击进去再次看了一下所购的商品及赠品,准确无误会,抱着愉悦的心情关闭了应用与手机。
    ”1、商品列表及商品详情,赠品类型的商品须显示对应图标;
    2、赠品类型商品同普通商品一样可正常下单购买;
    3、购物车,根据代理当前所选商品的总面价金额及当前代理对应配赠率,如果配赠金额不为0,则显示相应配赠金额及提示信息(若当前配赠金额暂不足以购买系统当前上架的任意赠品,则显示提示信息:“还差××就可获得免费赠品”;若当前配赠金额可购买系统当前所有上架赠品中的任一赠品时,则显示提示信息“可获得免费赠品”);如果配赠金额为0,则不显示相应配赠金额及提示信息。
    4、确认订单界面,若当前配赠金额可购买系统当前所有上架赠品中的任一赠品时,则提供选择赠品操作项。未选择赠品时,操作项显示配赠金额、及“选择赠品”文案。已选择赠品时,若配赠金额-已选择赠品的总面价>0,操作项显示“已选择××元赠品,还可选择××元”;若配赠金额-已选择赠品的总面价=0,操作项显示“已选择赠品”。点击操作项进入选择赠品列表。
    若当前配赠金额暂不足以购买系统当前上架的任意赠品,则不提供选择赠品操作项;
    5、选择赠品列表,列表显示当前配赠金额可购买的所有已上架的且库存不为0的赠品类型商品,用户可点击选择,也可取消选择,当前选择的赠品总面价金额=配赠金额时,不可再继续选择更多(若再点击选择赠品,则提示“不能再选择更多了”);提供显示选择提示信息“还可选择××元赠品”(××为配赠金额-已选配赠商品总面价)、“查看已选赠品”操作、“确认”操作。
    点击“查看已选赠品操作”,可弹出浮框列表显示当前已选择的赠品信息。浮框提供关闭按钮,可点击关闭浮框;
    点击“确认”操作,确认当前已选择的赠品信息,返回确认订单界面。
    6、个人中心,增加显示当前代理的配赠率信息。
    7、订单列表,若对应订单含有配赠商品信息(注:如果只是正常下单购买的赠品类型的商品,则同普通商品订单。此处指的是确认订单时根据配赠金额范围免费选择的配赠商品),则显示“含免费赠品”标签;
    8、订单详情,若对应订单还有配赠商品信息(同7),则列表显示用户选择的免费获赠的商品信息(注:正常下单购买的赠品类型商品,显示在同普通商品位置。这里只显示确认订单时选择的免费配赠商品),并显示总的免费配赠金额信息。

    2017-05-07
  • Android界面设计视觉规范

    当你拿到Android的设计需求后,开始着手进行界面的设计,却不知道如何设计才能让用户对界面感到满意,设计出来的界面差强人意,返稿无数以至于一遍遍的修改?如果这就是你现在的状况,那么先别急着重新进行界面的设计,因为你首先得静下心来看一看这篇Android的界面设计规范。

    2017-05-31
  • 贴心的产品交互应该有什么特征呢?

     这句话可以理解成男朋友总是需要记住女朋友的生日,爱好,习惯,好的交互也是一样,需要记住用户的个人信息。

    2017-05-27