资讯频道 → Web前端
阅读更多

9顶
0踩

Web前端

转载新闻 产品细节中的情感化设计

2014-12-18 11:08 by 正式编辑 cao345657340 评论(3) 有3884人浏览
产品设计 前端开发
原研哉在他的《设计中的设计》中有介绍过这样一个案例：日本机场原来是用一个圆圈和一个方块表示出入的区别，形式简单并且好用，但设计师佐藤雅彦却用一个更“温暖”的方式来重新设计了出入境的印章：入境章是一架向左的飞机，出境章则是个向右的飞机。



通过一次次的盖章，将这种“温暖”的情绪传递给每一位进关的旅行者们。在他们的视线与印章相交的那一刻，会将这种温暖转化为小小的惊喜，而不由自主且充满善意的『啊哈』一下。一千一万次的『啊哈』就会伴随着这一千一万次对旅行者的善意与好客。这便是产品中的细节与用户直接情感化传递的结果。一兰拉面是在日本非常受欢迎的拉面店，在顾客吃完面并把汤喝完会看下碗底有这样几个字“この一滴が 最高喜びです（你最后一口是对我们最大的肯定）”，他们用这种简单的细节打通了产品与顾客感情的传递，顾客在喝完最后一口面汤是对店主的肯定，并也因为对店主的肯定同时获得了店主的感谢。产品中的情感化的细节经常会成为产品与用户之间情感传递的桥梁，这种传递情感的细节不仅可以增加用户对产品的好感度，更可以让产品更加深入人心，利于产品口碑的传播，有时候可能仅仅一句文案，一个动画，一个彩蛋都可以打动用户，使其与产品产生情感上的共鸣，这便是产品细节中的情感化设计的作用。以下便是情感化设计在网页或者App上的实际运用：

情感化设计可以加强用户对产品气质的定位

Timehop是一款让你回顾那年今日的App，它可以帮你把去年今日写过的Twitter，Facebook状态和拍过Instagram照片翻出来，帮你回顾过去的自己。Timehop为自己的产品塑造了一个蓝色小恐龙的吉祥物形象。许多小恐龙贯穿于界面之中，用吉祥物+幽默文案的方式来将品牌形象的性格特点和产品气质传达出来。 用户在打开App时就能感受到小恐龙的存在，闪屏中一个小恐龙坐在地上说了句“Let’s time travel”，立马将用户从情感上带入了App的主题——时间之旅。



有趣的地方还有很多，类似下图，在默认情况下是露出一半的恐龙在向你招手，小恐龙边上是一句不明意义的文案“My mom buys my underwear（我妈妈给我买了我的内衣）”，当你继续向上拖动时，会发现一只穿着内裤的恐龙，用户就会马上明白上面这句幽默文案的含义。



类似的地方还有下图，在设置页面顶部向下拖动会有一只摇动的小恐龙，在用户顺着他的引导不断下拉，拉到头，会发现这是一个对话的气泡，蓝色的小恐龙说了句“You made it to the top!（你拉到了最顶端！）”，产品“诙谐有趣”的气质便从这些隐秘于界面细节之中的设计传递给了用户。



一个产品能获得用户的青睐不仅要有强烈的需求、优秀的体验，更主要的是让产品与用户之间有情感上的交流，有时对细节的巧妙设计将会极大的加强用户对产品气质的定位，产品不再是一个由代码组成的冷冰冰的应用程序，拉近了与用户的情感距离。

情感化设计帮助用户化解负面的情绪

情感化设计的目标是让产品与用户在情感上产生交流从而产生积极的情绪。这种积极的情绪可以加强用户对产品的认同感甚至还可以提高用户对使用产品困难时的容忍能力。注册登录是让用户很头疼的流程，它的出现让用户不能直接的使用产品，所以在注册和登录的过程中很容易造成用户的流失。巧妙的运用情感化设计可以缓解用户的负面情绪。

在Betterment的注册流程中，在用户输入完出生年月日后会在时间下面显示下次生日的日期，一个小小的关怀马上就让枯燥的注册流程有了惊喜。



在Readme的登陆页面上，当你输入密码时，上面萌萌的猫头鹰会遮住自己的眼睛，在输入密码的过程中给用户传递了安全感。让这个阻挡用户直接体验产品的“墙”变得更有关怀感，用“卖萌”的形象来减少用户在登录时的负面情绪。



Virgin America 的注册流程非常的“拟人化”，在你输入First name以后你会收到“Hey There”的打招呼，当你在把Middle name输入好后会出现“Nice name”的提示，好像有一个人在指示你完成注册步骤一样。亲切友好的文案相比冷冰冰的话语更能得到用户的好感与共鸣，人机的对话变得更加情感化。



Basecamp则运用了一个更拟人的情感化方式在注册之中，当你在表单中输入文字是正确的时候，边上的卡通人物会开心的指着输入内容，当表单中输入错误时，小人的脸将变成一脸惊讶状。



注册和登录对于一个互联网产品来说都是相当繁琐但又缺失不了的部分，这些流程阻碍的用户不能直接使用产品。对用户来说这便是在使用产品时候的“墙”，在这些枯燥的流程中赋予情感化的元素，将大大减少“墙”给用户带来的负面情绪，同时加强用户对产品的认同感，并感受到产品给用户传递的善意与友好。

情感化设计可以帮助产品引导用户的情绪

在产品的一些流程中，使用一些情感化的表现形式能对用户的操作提供鼓励、引导与帮助。用这些情感化设计抓住用户的注意，诱发那些有意识或者无意识的行为。 在Turntable.fm中的订阅模式中有一个滑块，你付多少钱决定了猴子欣喜若狂的程度。在涉及到真金白银的操作中，给用户卖个萌也许有奇效。



在Chrome浏览器的Android版中，当你打开了太多的标签卡，标签卡图标上的数字会变成一个笑脸。使用细微的变化友善的对用户的操作进行引导。



在用户将要流失前，给予用户情感化的元素也许能挽留下一部分的用户。当你想取消订阅Spotify时，Spotify会在取消订阅的网页上为用户播放Jackson 5的“Want you back”。



有趣的文案有时比醒目的视觉元素更具有引导用户作用，当你在使用InVision切换到别的标签时，标题的标签会改成“ Don’t forget to read this…”。



人类是地球上最具情感的动物，人类的行为也常常受到情感的驱动。在界面上融入情感化元素，引导用户的情绪，使其更有效的引发用户那些有意识无意思的行为，这种情感化的引导比单纯的使用视觉引导会来的更有效果。

结语

一个优秀的产品应该是有人格魅力且让人愉悦的，这种让人愉悦的积极的情绪便是由产品中那些多多少少的情感化细节来表现出的。那些让用户“啊哈”的细节，都将会成为积极的情绪所传递下去，影响的将可以能千千万万用户的体验与口碑。
  • 大小: 35.3 KB
  • 大小: 75.1 KB
  • 大小: 73.5 KB
  • 大小: 26.9 KB
  • 大小: 7.4 KB
  • 大小: 30.6 KB
  • 大小: 17.1 KB
  • 大小: 66.3 KB
  • 大小: 47.5 KB
  • 大小: 9.2 KB
  • 大小: 48.6 KB
  • 大小: 272.5 KB
来自: 腾讯ISUX
9
顶
0
踩
评论 共 3 条 请登录后发表评论
3 楼 fengzhaoyang 2014-12-21 10:53
Good design,Warm feel
2 楼 骨之灵魂 2014-12-18 17:12
1 楼 jerry1985 2014-12-18 13:00
好文章！！！

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 情感化设计的组成要素及实践案例

    文中所指的情感化设计，目标是在人格层面与用户建立关联，使用户在与产品互动的过程中产生积极正面的情绪。从案例中介绍了让用户更好的使用产品，展现如何使用户获得更愉悦的体验，这些都是为了让用户主动向他人分享...

  • 设计心理学3-情感化设计【读书笔记】

    总结：本书主要讲解了 情感元素在设计领域扮演的角色，情感元素的三个层面：本能 行为 反思 并提出不同层面的设计原则。 第一部分：物品的意义 一：情感的作用 1，情感改变人脑解决问题的方式 -- 改变着认知系统...

  • 电子商务搜索引擎的细节设计

    针对suggestion的情感化设计细节处理:EBAY.COM当用户觉得不想使用suggestion,或认为suggestion会给他带来干扰的时候,用户可以选择关闭suggestion.(suggestion有的时候可能会切断用户的心流,对用户的心智模型造成影响...

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

    Donald Arthur Norman， 作为享誉全球的认知心理学家和尼尔森·诺曼集团的联合创办人之一，也在其名为《情感化设计》的书籍中，从本能，行为和反思三个设计维度，讲述 了情感在界面设计的重要地位和作用，强调web或...

  • 产品场景化设计

    本文围绕什么是场景化设计，有哪些场景化设计的例子，为什么要进行场景化设计和场景化设计的具体方法，展开解读。 什么是场景化设计 生活中，场景就像戏剧、电影中的场面，泛指情景。在戏剧或影视剧里，场景由人物，...

  • 为产品赋予人格 - 情感化设计的组成要素及实践案例

    又一个宁静的周日。周末的娱乐活动无非就是这些，做做博客，看看书，捣鼓点儿小代码，玩玩琴。最近在准备一些软硬件设备(见我的微博)以及素材段子，接...一个个在情感化设计方面具有代表性的产品罗列在一起，看着这些又

  • 互联网产品设计思路参考

    互联网产品设计思路参考 产品开发流程 产品开发流程 产品研发产物 主要分为五个阶段：项目启动，需求阶段，产品设计，开发上线，版本迭代 立项 启动 评估 立项：确定要做一个什么产品 启动：确定项目相关人员，项目...

  • python实现中文情感分析与可视化

    目录 一、导入原始数据 二、结巴分词/绘制词云图 三、计算情感值，情感分析 # 方法一、SnowNLP计算情感得分 # 方法二、使用字典计算情感得分 四、# 数据可视化展示 五、绘制相关系数热力图 一、导入原始数据 #导入...

  • 用情感化交互为你的产品注入灵魂

    它们是有灵性的，它们的用户体验中被置入了情感化智能，并且这种情感化智能通过交互设计和反馈机制得以体现。 　这些要素将“个性”赋予了网站或 app 产品，并让产品最终在用户心中留下深刻的印象。不得不说，在...

  • 产品设计 | App功能设计的21条注意事项

    1、不要在没有流程图之就前开始设计或者画线框图 即便一个简单的 APP 也要有一个思虑周全的流程图，以确保在 APP 有合乎逻辑的、合理的导航结构。另一点值得关注的是确保核心功能...设计师创建的每一个细节都要经过...

  • 读书笔记-情感化设计

    1. “美观的物品更好用” 这是一句不那么好理解的大白话——一眼看过去好像没有办法反驳，但是一下子又想不清楚为什么。...人的情感、行为和认知是相互影响的，上面的两句话这应该是心理学领域一个很直白

  • 产品读书《交互设计沉思录》

    交互设计是人与产品、系统、服务之间创建的一系列对话。对话随着第四维度（时间）而推进，因此要针对对话进行设计，就要理解自然对话的易变性和流动性。同时，可用性并不是衡量交互设计的唯一重要指标，其内核更应是...

  • 数据可视化设计规范与应用

    5. 可视化云服务：如IBM Watson Studio、Microsoft Azure、Google Cloud Platform等，它们是基于云计算的数据处理和数据可视化服务，需求可弹性调整，更有弹性的数据隔离、数据存储和可视化自定义性。3. 可视化软件...

  • Weka.jar包文件

    Weka.jar包文件

  • 基于Java+Springboot的OA办公自动化人事管理系统

    本系统分为员工、部门经理、人事、管理员四种角色(角色菜单可以自行分配) ### 用户： 登录、考勤管理、申请管理、任务管理、日程管理、工作计划管理、文件管理、笔记管理、邮件管理、通讯录、个人信息修改。 ### 管理员： - 类型管理、菜单管理、角色管理、用户管理、职位管理、考勤管理、考勤报表管理、流程管理、公告管理、邮件管理、 - 任务管理、日程管理、工作计划管理、文件管理、笔记管理、通讯录、讨论区、个人信息修改。 ## 二、所用技术 后端技术栈： - Springboot - SpringMvc - Jpa - mybatis - mysql 前端技术栈： - Bootstrap - Jquery

  • 图像处理领域Retinex算法的新进展-基于全局与局部光照估计的图像增强

    内容概要：本文提出了一种新的 Retinex 图像增强算法，它解决了经典算法中的不足之处，尤其是光照分量估计准确性的问题。新算法通过分解全局光照和局部光照，使处理后的图像亮度和细节表现更加优异，色彩保真度显著提升，适用于高动态范围图像及雾天退化图像的处理。 适合人群：从事图像处理、机器视觉相关研究和技术开发的专业人士及研究人员。 使用场景及目标：用于图像增强处理场合，特别是在需要恢复图像真实色彩、提高图像亮度、增加对比度的情况下。主要应用包括但不限于：医学图像处理、安防监控视频、户外摄影等领域。通过对不同条件下的图片进行测试证明，该算法能够提供更自然的色彩再现和更高的视觉质量。 其他说明：相较于传统Retinex算法和其他改进算法（如MSRCR），新方法通过精准估计照明组件，克服了色彩失真和饱和度下降的问题。同时，文中给出了具体的算法实现步骤及其参数选择方法，具有很高的实用价值。此外，通过实验对比展示了该算法与其他现有技术相比的优势所在。

  • 基于springboot的IT技术交流和分享平台的设计与实现源码（java毕业设计完整源码+LW）.zip

    用户进入本系统可查看系统信息，包括首页、笔记分享，注册登录后主要功能模块包括个人中心、笔记分享管理、笔记类型管理以及我的收藏管理。 管理员登录后可对系统进行全面管理，管理员主要实现的功能模块包括个人中心、用户管理、笔记分享管理、笔记类型管理以及系统管理五大部分。 项目包含完整前后端源码和数据库文件 环境说明： 开发语言：Java 框架：springboot，mybatis JDK版本：JDK1.8 数据库：mysql 5.7 数据库工具：Navicat11 开发软件：eclipse/idea Maven包：Maven3.3

  • Labview 用DBC文件解析CAN报文以及DBC格式发送CAN，调用的dll有说明文档 2013，2016，2019版本 参考程序后续可以自己改动

    Labview 用DBC文件解析CAN报文以及DBC格式发送CAN，调用的dll有说明文档。 2013，2016，2019版本。 参考程序后续可以自己改动。

  • Java源码ssm框架人事工资管理系统-毕业设计论文-期末大作业.rar

    本项目是一个基于Java源码的SSM框架人事工资管理系统，旨在为企事业单位提供一个高效、便捷的人事与工资管理解决方案。系统采用了Spring、Spring MVC和MyBatis三大框架技术，实现了前后端的分离与高效交互，确保了系统的稳定性和扩展性。主要功能包括员工信息管理、薪资计算与发放、考勤管理、部门管理等，涵盖了人事工资管理的各个环节。通过该系统，管理员可以轻松处理员工入职、离职、转岗等人事变动，同时系统能根据员工的考勤记录和职位信息自动计算薪资，大大减少了人工计算的错误和工作量。此外，系统还提供了丰富的数据统计和分析功能，帮助企业更好地掌握人力资源状况。项目为完整毕设源码，先看项目演示，希望对需要的同学有帮助。

Global site tag (gtag.js) - Google Analytics