提示信息情感化设计，打造有故事的淘宝

未来的发展或许会将情感化设计的应用范围扩展至普通场景，而不仅限于异常情况，进而贯穿整个淘宝平台，使得淘宝成为一个充满故事的购物环境。

如今，消费者对产品的追求已从高性价比转向了高品质。尽管手机本质上只是一台机器，但用户与产品之间确实可以建立情感联系。若产品不能在用户体验和互动过程中带给用户愉悦，那么它的发展前景将受限。

淘宝不仅仅是一个商品交易的场所，它更是一个充满生机与创造力的生态系统。随着用户群体的日益年轻化，淘宝自然也应当拥有自己的独特故事和情感色彩。通过讲述这些有趣的故事，淘宝能够为用户营造更佳的购物氛围和体验。

情感化的价值“用户的情绪诉求”

产品对用户的第一印象至关重要，人类天生倾向于视觉感知，初次接触某物时，我们往往会不自觉地对其是否触动内心产生判断。很多时候，哪怕是一个微不足道的细节，也可能在一瞬间吸引人们的注意，并激发他们的喜爱之情。

产品亦然，如同顾客在商场中购物，若在逛的过程中心情逐渐变差，又怎会愿意继续前行呢？因此，我们追求的不仅仅是产品“可用”，更要确保用户在使用前后都能体验到愉悦的过程与心情。

“人性化的产品更受欢迎”

人们倾向于与人沟通，而非与机器互动，这一观点源自唐纳德·诺曼所著的《情感化设计》。其内涵实则易于理解，那些注重人性化的产品，摒弃了机械的冷漠感，因而显得不再那么生硬。

在人机交互领域，人性化设计占据着核心地位，设计师们深入洞察用户的心理体验，将产品塑造得如同一个拥有独特个性和情绪的角色，相较于冷漠的机械装置，这样的设计更能赢得用户的喜爱和情感上的认同。

现实生活中以及工业设计领域，此类案例比比皆是。通过将机械赋予拟人化与情感化特征，使其显得更加生动和有趣，从而被消费者牢记并持续使用，脱颖而出，这正是给物品注入额外情感价值的结果。

人性化的产品更受欢迎

故事的由来淘宝异常信息提示情感化现状梳理

如图所示，手淘当前面临业务众多、场景复杂及底层架构等多重因素影响，其异常情况，诸如空场景、网络故障以及限流等，不仅在布局结构上存在较大改进空间，而且在设计风格上并未充分体现淘宝品牌理念，缺乏横向一致性，甚至在某些大促期间，还会出现用户视为BUG的弹层弹出等尴尬问题。

首先，用户对于同一产品中出现的异常情况在心理上的理解并不一致，再者，这种情况还可能引起用户的烦躁情绪，而这并非我们所追求的理想状态。

由此引申的设计目标：

视觉吸引力：能够触动用户心弦，有效缓解用户在特殊场景下的情绪波动，进而间接增加用户的停留时长和点击转化率。结构一致性：确保异常组件的布局保持一致，使得横向业务对同一形式的提示内容有统一的理解。品牌认知度：淘宝的主力新增用户群体逐渐年轻化，对2017年淘宝新品牌的认知度逐渐提高，展现出亲切、活力和鲜明的特点。

设计目标引申

故事的序章

“这是一个亲和、活力和鲜明的故事”

淘宝的氛围应当是轻松愉悦的，与用户之间建立更紧密的联系，通过多层次、个性化的展示，使淘宝显得更加年轻和充满活力。

基于此品牌，我们必须摒弃以往ICOFONTS的视觉惯例，编织一系列以第三人称视角为主角，因特殊场景触发而展开的奇幻故事。

脑暴风格元素绘制草图

淘宝将品牌图形化元素进行抽象化提炼，其结果呈现为圆形；2017年推出的新品牌元素，圆形亦占据关键地位；此形状象征着品牌对用户及商品独特性的全面占有，并在众多业务场景中得以广泛应用。

在确定了整体风格和基本形态的基调之后，接下来便需要在脑海中对不同场景进行构思，并设想出各式各样的故事情节。

在初期阶段情感诉求，不妨大胆尝试涂鸦勾勒草图，即便不够美观也无妨，重要的是要将你的创意明确地展现出来，同时确保在简单说明后，他人能够领会你的构思。随后，将所有灵感逐一记录，诸如“海洋、草原、沙漠、星空”等场景均不遗漏。当思维发散至一定程度后，逐步聚焦，细致打磨细节，并集体讨论确定。以下为部分草图图案示例：

初期绘制草图

“众里寻他千百度”—故事传递情感

构思故事的时候，可以比较大胆地天马行空地去想象。在特殊情境下，比如遇到许多404页面的空白页面，我们可以思考如何通过故事来传达“空”的概念。在构思过程中，我们会发现，一个物体并非只有“数量为零”这一种方式来体现“空”。诸如“沉睡”、“躲藏”、“被夺走”等表达也能让用户感受到这种“空”的感觉。这样一来，故事的发展空间就变得更为宽广了。

例如，针对“订单为空”这一情形，我们构思了“订单仿佛乘着竹筏悠然飘逝”、“你的订单似乎在山谷深处悄然入梦”等两个富有创意的故事，既增添了趣味性，又能够积极且精确地传达“为空”的含义。

构思订单为空的两个故事

文案的情感化表达

我们不仅借助图形与色彩编织故事、传递情感，而且致力于对某些界面的文字内容进行精心设计。我们的目标纯粹而直接，那就是让这些界面的文字内容更具趣味性。用户在浏览这些文案时，或许能会心一笑，亦或是忍不住发表一番评论。

在界面布局中，文案策划往往容易被忽略。通常情况下，设计师对文案的看法仅限于“这是用来展示的示例文字，最多只能显示18个汉字”。

用户与一款应用互动，宛如人际交往的初识阶段。在现实生活中，我们通过观察一个人的外表、着装、行为举止和言谈来了解他。同理，在界面设计中，“图形”与“色彩”如同人的外在形象与服饰，“动效”则反映了人的举止神态，“文案”则相当于一个人的言辞，是他向他人表达的话语。

直播风头正劲，不少男性观众或许都有过这样的感受：那些封面设计得令人心动的女主播，一旦开谈，便足以让人对生活产生怀疑。同样备受瞩目的高晓松老师，有多少女性粉丝因为他的口才而放弃了原本的审美标准，渴望与他共度良宵。由此可以看出广州私人调查事务所，一个人所说的话具有多么重大的影响力。

文案设计过程中，我们需要考虑两个点：

两人间的亲密程度影响着他们交谈的内容和方式。

在讨论“加班”这一话题时，与上司交流的情景，相较于与朋友或家人间的对话，你或许会感到更加难以启齿，也难以全然坦露心扉。

我们期望手机淘宝与用户之间能建立起如同朋友或闺蜜般的亲密关系，彼此间能够畅谈心事、互相吐槽、分享正能量。在用户感到失落时，我们愿意表达我们的关心，在用户遇到难题时，我们乐意伸出援手，而当用户达成某个目标时，我们也会送上诚挚的祝贺。

2. 不同性格的人，面对同一件事情，说的话也不一样

例如，当遭遇“需求调整”的难题时，性情温和的设计师轻描淡写地回应道：“好的，亲爱的！”随即毫不犹豫地投入到修改稿件的工作中；而脾气暴躁的设计师则从衣兜中掏出一把长达两米的西瓜刀，反复擦拭后大声宣称：“我修改一份稿件，你就得承受一刀，这有何不可！”

我们期望手机淘宝能成为一位多才多艺的“良友”或“密友”，它能根据不同的情境展现出热情、温馨、关怀的一面，亦能以幽默、轻松、尖酸的风格存在，不经意间给用户带来惊喜和意外的快乐。

以下是部分场景的文案设计：

故事的发展颜色应用规范

2017年，淘宝的品牌色彩依旧沿用了橙色系列，但与往年不同的是，今年引入了微渐变效果，以增强视觉上的丰富感，使其显得更加年轻和充满活力。这一设计理念在故事叙述中同样需要得到延续。主体色彩依旧保持橙色系列，大面积的色彩运用了微渐变技术，而小面积则采用了纯色，以免画面过度渐变导致视觉疲劳。以下为手淘基本链路色彩应用的详细拆解图示：

故事性，趣味性以及共同设计元素

依据上述所讨论的思维方式，针对不同关键异常情况，我们逐一设计出了相应的信息提示界面。在这些界面中，不仅实现了组件布局的统一性，还通过视觉手段生动展现了故事内容和风格特点。

通用设计元素：

光源设置在左上方位，观察角度通常为正面或俯视角度。在特殊场景中，背景整体呈现圆形，未来或许会加入更多形状。设计沿用旧版的小人形象，但其主要功能仅为装饰和展示场景中物体的大小对比。设计元素不使用轮廓线，采用纯色与微弱渐变相结合，通常分为远、中、近三层，主体元素带有阴影效果，从而营造出丰富的层次感。

故事一：太空网络遗迹

在探讨普遍存在的“网络异常”情境时，我们讲述了一位宇航员在浩瀚的宇宙中探寻网络遗迹的传奇故事。宇宙的广阔空间本身就带有一种神秘感提示信息情感化设计，打造有故事的淘宝，而将网络以夸张的拟人手法呈现，使得其意义更加鲜明。最终，画面以一个正面俯瞰的视角定格，给人以美好的视觉享受。

网络异常场景

故事二：大漠足印

在“足迹为空”的情景中，讲述了一位考古学家在浩瀚大漠中寻觅巨人之迹的故事。这位在沙漠中孜孜不倦的学者，偶然发现了一枚疑似巨人的脚印，然而，那脚印的主人却已消失得无影无踪。

足迹为空场景

故事三：拥挤的传送带

在普遍的流量控制情境中，将货物比作人，它们在输送带的起始处相互挤压，形成一幅生动的画面，巧妙地展现了拥堵的氛围。

限流场景

其他场景集合（部分）：

异常场景组件和结构的统一

手淘的业务场景众多且复杂，其中部分场景包含多层信息指引，部分场景设有二级内容，更有甚者在某些场景中可能出现异常状况。这些因素导致目前各业务在异常场景的结构上存在差异，因此，统一对这些认知是必要的。

此处针对日常频繁出现的通用情境，以及含有特定内容的其他场景，如购物车使用和评价环节等，进行了全面性的横向规范。我们首先对二级内容的尺寸标准进行了统一，接着对二级内容为空等特殊情况进行了规范，以便为其他业务设计师提供参考。

1. 通用布局

手淘平台在遇到网络故障、流量限制等普遍性异常状况时，遵循统一的通用场景规范。在这些特定场景下，用户界面仅显示异常提示信息，不包含其他内容。同时，提示文案可以进行个性化配置，确保相同异常场景下使用的文案保持一致。

2. 一级内容为空

在特定场景中，若第一级内容呈现为空白或出现异常状况，同时仅存在第一级的标题栏，例如遇到购物车内容为空的情况。

3. 次级内容为空

由于一级内容的高度难以把握，因此设计师仍需与各链路开发者协作，共同调整适配组件的布局，比如在评论详情、店铺详情、消息等不同场景中。图示中提供了相应的场景示例。

架构组同学构建的统一组件，应用于图文信息内部结构，便于其他业务开发进行复用。此举显著减少了未来各业务线在更改和同步过程中所需承担的成本，以及开发成本。关于这一点，此处不再赘述。

订单详情配置图优化

手淘平台上依然保留着用于营造情感氛围的场景，这些场景在保持原有布局的基础上，逐一重新绘制了氛围插图，目前尚未对整体结构进行统一调整，比如在订单详情页面所呈现的氛围设计。

订单详情

故事的结果和延续落地实现效果及未来的反馈

目前仅对某些特定异常情况进行了上线处理，尽管整体工作尚未彻底完成，但已上线的部分在还原度上均达到了较高水平。未来，我们计划在后续版本中逐步完成剩余的更新工作。

这些异常情况较为隐蔽，多数用户不仅未能察觉，甚至对此不以为意。因此，这一领域的数据收集存在困难。我们只能寄希望于在未来系统全面上线一段时间后，观察用户反馈中是否包含相关内容，届时再由用户进行评价。

故事将会更有趣

淘宝的传奇远不止这些，当然，还有更多引人入胜的故事即将呈现给广大用户。

未来的故事还可能会将情感化设计延伸到不仅仅是异常的场景中去，从而覆盖整个淘宝，真正地实现做到一个“有故事的淘宝”。

私家调查【电话/微信同号188-2022-5007】严格保密,经验丰富,信誉服务,开办数年受得了顾客们广泛好评,欢迎来电咨询!