Menu
Woocommerce Menu

拟人形法规,让用户的第一眼就被抓住

0 Comment


原标题:拟人形法则,让用户的第一眼就被吸引

最近又被杜蕾斯的文案刷屏了,小小感恩节,一口气调戏 13
个品牌,引发全网热议,胃口之大,手段之高,不得不让人佩服。

什么是设计的可供性?

可供性是一个很值得玩味的专业词汇。一方面,在中文语境下这个词很难翻译得准确,它包含太丰富的语义。另一方面,这个词汇又可以用在很多的设计语境中,任何一个不好的设计,你都可以说它可供性不好,因为可供性跟设计目标几乎是息息相关的。那么可供性究竟是怎么定义的?先看维基:

可供性(affordance),或称为直观功能、预设用途、可操作暗示、支应性、示能性等,指一件物品实际上用来做何用途,或被认为有什么用途。也就是说在物品的某个方面,具有让人明显知道该如何使用它的特性。例如门提供“打开”的功能,椅子提供“支撑”的功能。人们得知如何使用物品有一部分来自认知心理学,另一部分来自物品的外形。

茶杯把手意味着可以茶杯可以「拿起来」

美高梅4858官方网站 ,从维基的定义来看,可供性是产品一种不言而喻的功能隐喻,让人一眼就能看出它具有什么功能,该如何操作它。《通用设计法则》这本书则把
affordance 翻译为「功能可见性」,这样翻译似乎更通俗易懂点。书中举了 Don
Norman 这个经典的案例来说明 affordance
,门把手的功能可见性是「拉」,但「推」的标示却跟门把手互相矛盾,解决方案是右图,用平面金属板代替把手,消除「拉」的功能可见性。

门的「推」与「拉」

可供性的设计理念首先是从工业产品发端的。一件好的工业品,使用者可以不假思索地使用它。原研哉的书中经常提到可供性这个概念,强调产品应该融进使用场景,其实就是产品可供性的外延。

原研哉《设计中的设计》中的设计案例

上图的两个案例,第一个下垂的拉绳提供强烈的下拉隐喻,一个不假思索的下拉动作,音乐随即响起。第二个案例中的雨伞,设计者为了解决一手提袋子一手拿雨伞的窘境,在雨伞把手上设计出了一个凹下去的凹痕,让使用者不用思考就学会了把袋子挂把手的操作。这两个案例是对可供性这个概念的很好的诠释。通俗点讲,可供性就像是文章的上下文语境,工业产品通过造型和周边环境的映衬,来给用户足够的操作和功能隐喻。

拟人形不仅仅指的是模拟人的外形、动作、语言,还可以模拟人的情感,人对现实世界的感受。在遇到产品交互难题的时候,试试文章中提到的拟人形法则能不能帮到你美高梅线上娱乐 ,~

美高梅4858官方网站 1

UI 中的可供性

为了不使讨论过于泛化,我们可以把可供性在 UI
中可以理解为隐喻,比如常见的图标、按钮、控件就是 UI
中的隐喻要素。一个齿轮图标代表设置,一支笔的图标表示编辑功能。这种隐喻在
UI 设计中随处可见。但 UI
是二维的,它的功能可供性跟工业产品不一样,工业品可以通过触感、嗅觉、光影等等去增强可供性,UI
只能通过平面的手段去寻找办法。

比如谷歌的 material design
企图通过模拟材料本身的特性来提供界面隐喻。比如光影、质感、符合物理定律的运动等都是为了解决数字世界中的的交互隐喻,提供更有力的可供性。MD
的投影隐喻界面中的层次感,并借鉴了传统的印刷设计——排版、网格、空间、比例、配色,来构建用户熟悉的视觉世界。而这一切都建立在谷歌的理论根据之上:人对材质触感有着天然的感知,这是一切隐喻的基础。

Material Design 的理念

与谷歌截然不同的另一套界面设计理念,苹果在 iOS 7
之后提出的,俗称毛玻璃效果,则从利用玻璃质感来构建 UI 的层级关系。正如
iOS 设计指南中写到:

半透明的 UI
元素底下的内容隐约可见,这种界面的隐喻帮助用户理解当前界面的后面还隐藏着更多内容,层级感一目了然。

毛玻璃的效果确实更接近真实世界的视觉经验,距离 iOS 7
发布四年过去了,大众早已习惯了毛玻璃,众多安卓厂商都在竞相模仿,Material
Design
那一套为数字虚拟世界构建的隐喻体系似乎打动不了用户,这说明真实世界的映射映射是多么重要。

控制中心

美高梅4858官方网站 2

左图为杜蕾斯感恩节文案之一,右图为品牌回应杜蕾斯的文案,一来一往,非常精彩

图形化隐喻增强 UI 的可供性

在图形化界面的初期,人们对界面的认知是空白的,毫无经验的,所以软件图标基本都是拟物化的,设计者都希望用户可以借用现实经验来理解这些虚拟的数字化产品,所以容量图标画个实体硬盘,主页图标画个房子,设置画个齿轮等等,但随着用户对数字化产品的认知逐渐加深,不再需要借用现实经验来加强用户认知了,因为它本身已经自成体系。

以 iOS 的桌面图标为例,从 iOS 6 到 iOS
11,图标原有拟物化的质感被去掉,代之以抽象的色块、渐变、线条、符号,图标的历史使命,即帮助人们从真实世界跨向虚拟世界的认知跃升已完成。现在
UI
中的图标,已经基本脱离现实的隐喻,想想百度、淘宝、京东等主流应用的图标吧,完全是基于虚拟世界构建的视觉认知。

iOS 图标扁平化的过程就是在逐渐减少现实隐喻

虽然界面中的图形已经逐渐脱离现实经验的隐喻,但在一些跟实体有关联的产品中,我们还能看到很多用现实经验隐喻来增强界面的使用体验。比如音乐播放界面用唱片机的样子,读书产品的页面跳转模拟真实翻书的效果,共享单车
APP 还是用单车的形象等。UI
利用现实隐喻来增强界面功能可供性的做法会一直存在,只是随着人们虚拟世界的经验越来越丰富,会越来越少而已。

提供丰富现实隐喻的应用界面

拟人形法则指的是把事物人格化,赋予事物和人一样的特性,和我们人一样有感情、有声音、有动作。拟人能更加生动的表达出事物的特点,让人感同身受。而现在拟人在设计上的运用也日益广泛,把抽象的、用户不熟悉的元素拟人化,能让用户第一眼就知道你这个产品是什么,引起他们的关注,从而建立对产品的情感共鸣。

除了杜蕾斯惯用的借势营销,整合营销,更令琛姐感叹的是,杜蕾斯的品牌“拟人化”进程又上了一个新台阶:“杜杜”不再是一个人玩了,他有朋友了!而交朋友恰恰是品牌拟人化的重要手段之一。

最后

可供性在 UI
设计中的讨论越来越少了,可能是因为扁平化到现在,很多界面越来越多的使用文字按钮了,功能所见即所点,隐喻似乎没有必要了。在更有未来感的科幻片中,你也会发现所有的操作面板几乎都是文字按钮,这样更直观,符合人机交互的理想境界:忘记界面,自如操控。


一、模拟人的形态

拟人化的好处非常明显:

参考资料

《Universal Principle of Design》by William Lidwell、Kritina 
Holden、Gil Butler

《The Design of Design》by 原研哉

《iOS Human Interface Guideline》by Apple

《Materila Design》by Google

最基础的拟人化就是模拟人的外在形态——高矮胖瘦等,把自己的产品和人的外在形态建立联系。在
UI
界面中,我们经常会用拟人化的卡通形象来增加页面的氛围,胖胖圆圆的圆润造型可以营造轻松、活泼的联想。

澳门美高梅官网 ,1.让产品形象更生动,帮助用户了解产品。主要通过对产品外形特征的拟人化来实现,比如,Topline
Gums 口香糖以接吻来比拟口香糖的味道(表情再销魂一些就更好了):

美高梅4858官方网站 3

美高梅4858官方网站 4

二、模拟人的动作

2.促进品牌和消费者的沟通,提高品牌忠诚度。有研究表明,品牌沟通和正常人际沟通最大的区别在于内容集中度,大部分的品牌文案都是紧紧围绕产品做广告,内容集中度过高,很容易引发消费者反感,从而放弃沟通。

肢体语言往往比外在形态更生动,而且通用性更强。如下图bilibili的登录页,当用户输入密码的时候,页面上方两个卡通人物会用手捂住自己的脸。

而拟人化的文案内容集中度较低,这种不集中能够创造出如同真实社交环境一般的缓和感,减少交流压力,幽默风趣的拟人化文案更是会吸引消费者积极参与,比如,上面提到的杜杜感恩节文案,就吸引了大批用户参与互动。

美高梅4858官方网站 5

那么,这么有用的拟人化营销怎么做呢?

其实这来源于生活中的场景,当你在银行取款的时候,输入密码的时候自己会用手挡住,别人也会自觉回避。当界面中运用到这一点的时候,用户看到的时候也会觉得很熟悉,会心一笑,对你的产品的好感度瞬间倍增。

品牌拟人化的实质是把品牌视作人,包括外部特征相似的有限拟人化到注入人的感知、情感乃至灵魂的完整拟人化。所以,拟人化营销可以从以下
4 个维度着手:外部特征、感知、情感、灵魂。

美高梅4858官方网站 6

外部特征拟人

三、模拟人的声音

外部特征拟人,主要是指形式上的拟人,比如,用昵称替代产品或品牌名,像杜蕾斯自称“杜杜”、麦当劳自称“麦麦”,故宫淘宝经常自称“朕”。

人的声音和动作一样,都能在短时间内引起用户的共鸣。在自己的产品中植入一段有特点的音频,也是一个不错的选择。这种在游戏类
app
里面最常见了,小孩子玩的益智类游戏也会经常出现,比如翻牌消消乐,错误的时候配合着抖动会发出
“啊哦” 的声音,有一种惋惜的意思,鼓励小孩子再接再厉。

拟人的外形。许多产品都拥有拟人化的外形,比如琛姐小时候经常吃的鬼脸嘟嘟饼干,比如很多汽车的设计,都和人脸很像。杜杜更是经常借用漫画的形式为自家产品创造人格化外形:

加入音频后会让反馈信息更加明确,因为音频本身就带有情感,正确、错误、开心与否都能通过声音体现出来。

美高梅4858官方网站 7

美高梅4858官方网站 8

拟人的动作。说到拟人动作的运用,就不得不提到长城葡萄酒的经典广告,“三毫米的旅程,一颗好葡萄要走十年”,一个“走”字,巧妙拟人,也传递了品牌脚踏实地的精神:

四、模拟人的行为

美高梅4858官方网站 9

人是一个很奇怪的物种,大多数人都认为自己做一个决定的时候,是完全出于内心的选择、绝对不会受他人影响的。但其实人作为一个社会性物种,一言一行都会受到周围环境以及习惯的影响。

百事柠檬味可乐的文案,采用柠檬打斗的画面,与文案“pepsi  with  a  touch 
of  lemon”形成呼应,很好地展现了柠檬的新鲜感:

4.1 行为会受环境的影响

美高梅4858官方网站 10

从众

外形特征拟人是品牌拟人化的初级形式,更高级的拟人化应该围绕品牌个性(品牌有
5
类基本个性,包括:真诚、刺激、野性、有教养、有能力,琛姐已在上周的文章《品牌“个性化”完全指南》中进行了分析),建立品牌感知、情感和灵魂。

社会心理学里讲过一个现象:从众心理,指的是个人的行为会受到外界人群行为的影响,而在自己的知觉、判断、认识上表现出符合于公众舆论或大多数人的行为方式。从众心理是部分个体普遍所有的心理现象。

需要注意的是,个性的确立必须具有一贯性和差异性。根据个性心理学,一个人内在的稳定因素使得一个人的行为在不同的场合表现出持续的一贯性,并与其他人在相同的情况下的行为有所差异。对品牌而言,正是用自己“在不同的场合表现出持续的一贯性和差异性”,来确立自己的个性。

美高梅4858官方网站 11

这就是为什么杜蕾斯能给大众留下“老司机”的印象,而其他模仿者却不行,因为杜蕾斯长期坚持以“老司机”的方式蹭热点,并且是首位成功塑造“老司机”个性的品牌。

其实在很多产品的设计上,都有在利用用户的从众心理,比如把产品的销量、评价数外漏展示的特别明显,仿佛在告诉用户我这个东西很受欢迎,很多人都买了,好评页很高,那么自然而然用户就会对这个产品多看一眼,而且最后很有可能也会购买。

感知拟人

回想自己在淘宝购物的时候,是不是总是会选择销量最高、好评最高,这其实就是一种从众心理——大家都买的应该差不到哪里去。

品牌的感知主要体现在对用户需求的感知,和对社会热点的感知。

美高梅4858官方网站 12

1.对用户需求的感知

攀比

如果一个品牌的文案无视用户需求,不能即时反馈,只顾自说自画,自然会给用户一种冷冰冰,缺乏人情味的感觉,所以,越来越多的品牌开始利用社交媒体和用户互动,但海尔的新媒体部门显然玩得更溜,因为他不仅和自己的用户互动,还感知到了其它品牌用户的需求,比如,故宫淘宝的粉丝建议做款名为“冷宫”的冰箱贴,海尔跑过来接茬了:

攀比也会激励人去做一件事情,各种 App
里都会有榜单排行榜,也是利用的用户的这一心理。

美高梅4858官方网站 13

美高梅4858官方网站 14

然后,概念图就出来了,紧接着 7
天内,冷宫冰箱就横空出世了,并迅速送到了用户手上,同时附上了一封信:每一个人的意见对我们都很重要。如此敏感的感知能力让用户不得不感动。

奖励

美高梅4858官方网站 15

奖励算是影响人的行为的最快的一种方式了,新手注册、邀请好友、每日签到…各种奖励方式,都在激励用户。

冷宫冰箱概念图

各个奖励方式按照目的可划分为:拉新和留存,不同的目的所采取的奖励方式也不一样。当用户不熟悉你的产品的时候,通用奖励是一种很好的方式,通用奖励指的是你所奖励的东西不仅仅局限你的平台使用,而最常见、最能被用户接受的就是现金了,这也是拉新最常用的一种方式。

支付宝对于用户需求的感知也非常敏感,比如,对于用户经常提到的“如何才能不还花呗”的问题,支付宝官方公众号多次用幽默的文案进行了回应:

美高梅4858官方网站 16

美高梅4858官方网站 17

4.2 行为会受习惯的影响

2.对社会热点的感知

俗话说三天能养成一个习惯,而且习惯养成后很难改变,每个人都会有自己的一点小癖好。

也就是俗称的蹭热点,蹭热点并不完全是为了蹭流量,另一个很重要的作用是体现品牌的感知能力,相关的成功案例非常多,就不一一列举了(文章开头提到的杜蕾斯感恩节文案就是一个),这里想强调的是,一定要从品牌个性的角度去看待热点,比如,杜蕾斯的蹭热点文案都是从一个老司机的角度来写的,因为只有这样,才能形成品牌个性。

一个吃素的人,你跟他宣传你的肉食多么多么的好吃,那也是徒劳无功,而一个天天吃肉的人你让他改吃素,这别人轻易也接受不了。

情感拟人

虽说每个人的习惯各有不同,但其中还是有些共性的,比如:按钮、卡片、头像给人感觉就是可点的、而置灰的就不可点了;点击弹窗旁边的蒙层可关闭弹窗;

情感包含浅层情感(喜、怒、哀、乐等)和深层感情(亲情、友情、爱情等)。

美高梅4858官方网站 18

1.浅层情感

所以在做设计的时候,我们可以去找找自己的目标人群有没有一些共有的行为习惯,针对这个共有的习惯去做一些针对性的设计。

浅层情感主要包括喜、怒、哀、乐等人类常见的情绪,在文案中表达此类情绪,会让产品或品牌的人格化形象更鲜明,也能让用户更有共鸣,比如王老吉的“对不起”系列文案,就表达出强烈的隐藏在歉意中的愤怒:

拟人形法则并不仅仅只是模拟人的外在形态、动作、语言等,更深层次的是模拟人的情感。

美高梅4858官方网站 19

人的形态、动作、语言只是一种我们对他的认知,比如看到全身都是妖魔鬼怪纹身的人会不由自主的害怕;经常笑的人会给人面善的感觉;同一句话不同的语气表达的意思可以截然相反…

江小白的文案则传递出浓浓的关于青春的愁绪:

美高梅4858官方网站 20

美高梅4858官方网站 21

这些认知都是我们主观上所认为的,拟人形模拟的其实是一种内在情感,一种人们对他的主观认知,是人对现实世界的看法,而拟人的“人”只是起到一个媒介作用。

故宫的卖萌文案令人忍俊不禁:

五、模拟人的情感

美高梅4858官方网站 22

我们这个时代的人在精神的诉求上比祖辈高太多了,这就要求设计师除了满足功能需求,也要去关注人们的情感需求。人性化的设计已经成为这个时代的主流了,想用户所想,为他们提供他们想要的服务,或者说让我们想推的服务被他们所喜欢。

2.深层感情

把人们对现实世界的看法嫁接到产品设计上,投其所好,就能让自己的产品更容易被大众所接受,这里说的
“好”
指的是认知习惯,是每个人对这个世界存在的一些看法,有客观存在的、也有主观的,而且这个看法也会随着时间的变化而变化。

深层情感包括亲情、友情、爱情等社会化情感。许多品牌在介绍产品的时候喜欢说“XX家族”,其实就是一种亲情的体现,比如,知乎家族的新成员“知一声”就是这样介绍自己的:

5.1 约定俗成的

“知乎家族的新成员, 
略懂产品和技术,了解知乎产品功能,不定期地将知乎的功能或产品的优化升级告知大家,欢迎大家关注和私信我。”

有一些认知习惯,是这个社会自然而然形成的,红橙色系的颜色能够给人带来食欲,因为生活中的食物大多都是这个色系的,人们就形成了固有的认知。

现在许多品牌开始组 CP
了,比如前文提到的“海尔&故宫”,以及文章开头提到的“杜蕾斯和他的朋友们”,这都是展现品牌友情的方式,通过这种品牌间互动,可以赋予品牌更立体的情感,在品牌拟人化的进程中又进一步。

美高梅4858官方网站 23

灵魂拟人

当我们在实际工作中运用拟人形法则的时候,要千万注意这一点,不要盲目去做跟大众认知相悖的设计,而是要去做跟大众认知相符的。

对于人类来说,独立思考的能力就是灵魂的体现,对于企业来说,企业的愿景就是灵魂,反映在文案中,灵魂就是企业对于生活,对于人生的思考。

美高梅4858官方网站 24

日本文具老品牌 Shachihata 为自家 50 周年生日所打造的纪念广告《不合格的
50 岁》很好地诠释了,如何为产品塑造灵魂。

而把大众固有的认知习惯和产品相结合的一个最常用、最快捷的方式就是使用动物形象,自然界中绝大多数动物在人们的心里都有固有的印象,加上动物大多和我们人一样,有手有脚,在延展的时候更好延展。

日本获奖创意广告《50岁的不合格》

比如印象笔记的大象,印象笔记作为一款多功能笔记类应用,对人们来说最重要的就是存储功能,所有记录的内容都不会丢失。而正好大象在人们的眼里属于记忆力绝佳,永远不会忘记事情的动物,与云笔记想要传达出的理念完美契合。

印章是 Shachihata
公司的拳头产品,广告很巧妙地将印章拟人化,人生的“成功”和“失败”也用印章中的“合格”与“不合格”来表现,通过讲述一位叫“伊藤”的普通职员从初入职场到
50 岁的人生经历,强化了“印章”背后的寓意。相信看过这则广告后再用
Shachihata 公司的印章,感觉会大不一样吧。

美高梅4858官方网站 25

美高梅4858官方网站 26

再比如美团外卖的袋鼠,袋鼠在哺乳动物里是跑的最快的,而美团想向用户传递“美团外卖,送啥都快”
的品牌理念,那么袋鼠就是最好不过的方式了。

宜家的企业愿景是“为大多数人创造更加美好的日常生活”,他的产品文案完美地实现了这个愿望,看完宜家的产品文案,你会深深感受到:宜家的每件家具都是有灵魂的。

美高梅4858官方网站 27

美高梅4858官方网站 28

5.2 现实世界有的

宜家抽屉文案

当找不到约定俗成的习惯与自己的产品结合的较好的时候,我们也可以从现实世界中找灵感,模拟现实世界的场景,让用户对自己的界面有一种天然的熟悉感。

美高梅4858官方网站 29

引导性界面

宜家高脚杯文案

模拟现实世界超市、图书馆、机场等的指示牌。在现实世界我们到达一个陌生的地方首先会去看的就是指示信息,每一层有什么,要去的地方在哪里。

小结

美高梅4858官方网站 30

拟人化营销的好处非常明显:1.让产品形象更生动,帮助用户了解产品;2.促进品牌和消费者的沟通,提高品牌忠
 诚度。

而在UI界面中也是一样,用户第一次进入,对于页面功能的放置不是很清楚,这就需要一些提示信息,特别是你的交互比较特殊,用户没有习惯的时候。

品牌拟人化的实质是把品牌视作人,包括外部特征相似的有限拟人化到注入人的感知、情感乃至灵魂的完整拟人化。所以,拟人化营销可以从以下
4
个维度着手:外部特征(昵称、外形、动作)、感知(用户需求,社会热点)、情感(浅层情感、深层情感)、灵魂。

美高梅4858官方网站 31


界面与用户互动,即时给予反馈

PS:琛姐是大学新媒体教师。每周三,分享一个“写完了可以直接放进书里”的新媒体思考。

在现实世界里,我们和别人交谈的时候都希望是一问一答式的,更好的是我问一句别人能把我想知道的都告诉我。而在
app
中,我们也需要营造这样一种氛围,在用户进行一个操作的时候,即时给予反馈,比如支付订单的时候,即时告诉他支付的结果,成功或者失败;在他做下一步操作的时候,提前设想他可能要做的事情,比如客服中心页面,会把一些用户常问的问题诺列出来。

PPS:我已委托“维权骑士”为我的文章进行维权行动。如需转载,请联系琛姐进行授权,抄袭必纠。

美高梅4858官方网站 32

在他做下一步操作的时候,提前设想他可能要做的事情,比如客服中心页面,会把一些用户常问的问题诺列出来。

美高梅4858官方网站 33

当然不是所有的互动都要是一本正经的,适当的时候来点不一样的回馈会有意外惊喜,比如当我们给自己发的内容点赞的时候,会显示一个坏笑的表情。

美高梅4858官方网站 34

空白页插画、走心文案

人是群居物种,内心都是害怕孤独,渴望有人关爱的,所以我们可以为产品里那些平淡无奇的地方配上一点人文关怀,比如走心的文案、可爱的插画,减轻用户的烦躁心里,让用户能够感受到亲切。而这些细节能够成为产品与用户之间情感传递的桥梁,不仅能够增加用户对产品的好感度,还可以让产品更加深入人心。

美高梅4858官方网站 35

六、举例实操

写到最后我们来举一个例子,来具体说明一下实际工作中可以怎么运用拟人形法则。

如下图,当你想要用户知道对图1的区域进行操作的时候,会出现2、3、4的功能,那么怎么样能够让用户清楚明白的知道这一点呢?

美高梅4858官方网站 36

首先我们可以从我们日常生活中找这种例子,比如降国旗、卷纸、抽屉等等,都能让人知道这一区域是可操作的,操作后会出现新的内容,所以我们就可以将这一认知结合到界面中。

比如:

  1. 在页面放置一个小的拉绳(降国旗);
  2. 将图1区域图形的边缘做成卷纸的形式;

……

将现实中用户熟悉的场景转移嫁接到产品中,这样的交互方式在第一眼就知道怎么操作,而微信理财通用的就是第一个方法,降国旗,用户看到这个小标志,不用任何引导他都知道下方会有内容。

美高梅4858官方网站 37

总结

运用拟人形的方法能够快速引起用户的注意,建立积极正面的互动。拟人形不仅仅指的是模拟人的外形、动作、语言,还可以模拟人的情感,人对现实世界的感受,在遇到产品交互难题的时候,可以从生活中找例子,然后把它合理嫁接到产品设计上。

作者:橙子的橙子 公众号:海盐社

本文由 @橙子的橙子 原创发布于人人都是产品经理。未经许可,禁止转载。

题图来自 Pexels ,基于 CC0 协议返回搜狐,查看更多

责任编辑:

发表评论

电子邮件地址不会被公开。 必填项已用*标注

相关文章

网站地图xml地图