404页面的情感化设计

小编:做UI行业的都应该知道404页面是非常重要的一部分设计,当页面出现错误时它是增强用户体验的很好的做法,其遵循的理念是: 提供简明的问题描述,消除访客的挫败感。提供合理的解决方案,辅助访客完成访问目标。提供个性化的友好界面,提升访问体验。今天就跟随作者@化流水躺湖底一起来谈谈404页面的情感化设计。

关于设计,关于404

申明:这篇为我在看了来自知乎、简数、站酷等平台上很多大神的文章总结而出。很多词汇并非,再次向原作者表示感谢。

文章将以下面4个问题展开,大家可以挑自己需要的着重阅读。

  • 什么是404页面?
  • 404页面存在的作用有什么?
  • 怎么设计出符合情感化的404页面?
  • 404设计误区

什么是404页面

404页面是客户端在浏览网页时服务器无法正常提供信息,或者是服务器无法回应,且不知道原因而返回的页面。

一般404页面出现在没有网络时、主页更名或搬迁地址时、输入网址错误时、以及编程人员的疏忽写错地址等原因时。

404页面存在的作用有什么?

作用1:告知用户错误所在,缓解用户焦虑;

作用2:提供错误解决方案;

作用3:影响用户对网站体验的情绪,即发生错误之后给用户留下一个是很坏的印象(可参考峰终定律);

终极作用:将访客和潜在客户留在网站上

诺贝尔奖得主,心理学家DanielKahneman经过深入研究,发现对体验的记忆由两个因素决定:高峰(无论是正向的还是负向的)时与结束时的感觉,这就是峰终定律(Peak-EndRule)。这条定律基于潜意识总结体验的特点:对一项事物的体验之后,所能记住的就只是在峰与终时的体验,而在过程中好与不好体验的比重、好与不好体验的时间长短,对记忆差不多没有影响。

怎么设计出符合情感化的404页面

世界给了我们一个酸柠檬,那我们就把酸柠檬变成柠檬水

“当404页面产生的时候,势必会让用户的心情产生落差而带来一些糟糕的体验。”

显而易见这个就是404页面最大的痛点,而解决掉这个痛点,就是我们设计出符合情感化404页面的基本准则了。

所以当用户情绪产生落差的时候,我们需要做到的是:

  • 告知用户
  • 给用户一个返回上一步,或自他的选择
  • 方便用户联系到你给予反馈
  • 给用户一个不错的建议

但这些并不足以使用户的情绪平复,为了达到情感化,针对不同类型网站的用户,一般我们可以采用下面的方法表达我们的态度:

  • 直接表示出现错误
  • 表示抱歉
  • 转移用户的注意力
  • 用诙谐幽默的方式提示用户到了一个错误的页面
  • 卖萌,讨喜

最后谈一下404设计误区

要知道一个能服务于用户的设计才是一个很好的设计,所以为了服务好用户,404设计需要遵循以下规则:

  • 404页面符合网站自身的设计风格,让用户不会觉得误点了外链;
  • 404页面不要自动跳转,让用户决定去向;
  • 文案要温柔婉转,给用户留下一个好的态度。

这就是我第一做404页面设计的总结了。

我的试水作品:

(根据以上原则,我采用了“用诙谐幽默的方式转移用户注意力”的方法来平复用户的坏情绪)

这个404页面是在用户听音乐,发现没网络的情况下设计的。

通过关键词“找”,把“网络”拟化为了物品,知识。根据这个,设计了生活中常见的拿放大镜找东西,在书本里找解答方法的小动画。并提供“打开本地音乐”和“重试”的选项为用户的下一步操作提供选择,以此来缓解用户的焦虑,并留下好印象。

共同学习,共同进步,谢谢阅读。

文章来源:UI中国

作者:化流水躺湖底

(0)

相关推荐

  • 2018界面情感化设计,拒绝冷冰冰的人机交流

    网页或App界面的情感化设计,作为用户体验和需求金字塔的最高层级,越来越多的受到设计师们的和重视.Donald Arthur Norman, 作为享誉全球的认知心理学家和尼尔森·诺曼集团的联合创办人之 ...

  • 情感化设计–暖心设计!

    小编:情感化设计是站在用户的角度思考,为用户解决问题,也就是我们常说的用户体验.你让用户开心了,那么用户就会"誓死"忠于你.这种方法能极高的触发用户"自觉性"的 ...

  • 情感化设计Ⅰ:让设计打动人

    小编:今天来为大家将一些情感化设计,非常感谢作者@海边来的设计师的分享.一个好的设计是能让用户为之感动的,戳中用户的痛点并作出合理的优化时很重要的一点.我们要知道如何让用户对产品产生认同感并真心的喜欢 ...

  • ofo小黄车是如何打造情感化设计的?

    ofo除了是一个开锁工具和代步自行车外和用户的现实生活也存在在很多关联性,用户骑车小黄车上下班出勤.和朋友爱人家人一起逛街或周末出游.ofo 对他们来说除了骑行外,也是连接情感和美好生活的一款工具.于 ...

  • 设计师必须知道的情感化设计

    情感化设计是完善产品,提升用户体验的关键,在当今移动应用泛滥的时代,只有存在情感化设计的产品才能脱颖而.如今的用户不再满足于与冰冷的机器进行互动,更希望在每次的操作中附有有情感上的互动.情感化设计在很 ...

  • 打造“右”手404页面(网页版面设计过程)

    本期为大推荐的页面设计构思非常有趣,版画设计让人有种至身死胡同一般的感觉,直指404页面错误结果无解的含义. 效果图[点击看大图] GIF过程图,要点击才显示动图?? 火花制作简略教程 原文作者:SE ...

  • UI设计中的情感化设计

    科技的发展使机器不再是一个单纯的功能性产物,它们可以被赋予情感,因此,情感化的设计在人机交互中就显得尤为重要, UI设计师也应该在设计时添加「情感化元素」. 参考书籍: <设计心理学3-情感化设 ...

  • 50个设计思路帮你解析创意404页面(上)

    做网站是系统工程.首页的内容要层次分明,导航要结构清晰,子页面要排版均衡,相对而言自由度稍高一点的,应该是404页面了.虽然404本身就是一个告知用户内容访问出错的错误代码,但是富有创意的设计师会充分 ...

  • 互联网金融APP情感化体系探索

    前言 唐纳德·A·诺曼在<情感化设计>一书中提到我们更喜欢与人交流而非机器,要让产品对用户产生足够的亲切感,产品应该是富有趣味性且易于沟通理解的.他从本能.认知.反思方面诠释了情感化设计的 ...