能让人会心一笑的图标，是如何设计出来的？

有趣灵魂里挑，们正情绪往使“有趣”成为沟交流不可或缺情感特征。随着越来越多品涌入市场，用户品或服务诉求逐渐上升至心理层，而格化、趣味化作为共情设计要思路，于品能否脱颖而出、提升用户认感，发挥着不容小觑作用。

本篇章将被窝的线上百科产——“被窝知道”的icon设计项目为例，分享情感设计的思考及创意过程，探索如何视觉手帮助牌和户建立起友好的沟通。

项目背景

在众多生活服务，装应算是相低频流程复杂项了：不论是房翻新是新房美化，前期准备疏忽往往会为后期施工带来各隐患。在装前缺少晰易懂家装普，正是大多业主痛。基于这样背景，被窝家装出了自己线上百品——被窝知：其配合工艺介绍、家装案例等板块，补齐了用户装知识系统，帮助业主规避潜在问题，提升家装体验。

本次需求为设计一套 icon，生、有趣的形式展现百科中的 80 余个知识场景。对修疑问的解答过程，正是牌同户的一次交流互。如何沟通交流的过程专但枯燥，是本次设计需要解决的问题。

切入点：让 IP 成为沟通的入口

在被窝 app1.5 版本中，被窝设计团队结合户调研梳了牌传达的键词：专与温暖。为构建这样的牌调性，在设计探索的过程中，我们格外注重牌 IP——Mr.Wo的融入。

Mr.Wo 是随被窝品牌一起诞生的人物形象，继承了被窝 Logo 那双炯炯有神的大眼睛，并延续了被窝品牌积极、正面的情内核：可爱逗趣、充好奇，对生活品质有着的追求和执拗，也是努力实现美好居住的梦想家。

△ 图 1 被窝品牌 Mr.Wo

作品牌的“言人”，我们再次选择 IP 形象作视觉创意的切入点，让其与用户沟通的入口，帮复杂的科内变得专业却不枯燥，温暖且加趣。

确立风格：从产品特征发散创意

确了以 IP 载体行设，但 icon 风格如何选择、温暖趣怎样体问题，还需回到产品本身行思考。结合产品功能行分析，“被窝知道”以下两点特征：

1. 问答形式展叙述

每知识点中，“被窝知道”均采用一问一答的方式行讲解。比起教科书似的陈述结构，聊天式的沟通过程加具亲力，这也奠了该产品轻松的氛围基调；

2. 内多样场景具体

本次需设的 icon 约 80 余，虽然部分知识点标题存重复象，但均针对了特的活场景及家装体验。举例，施避坑章节中的“卫间”知识点加侧重常见隐患的解决方式；空间功能板块中的“卫间”知识点则加聚焦主的选择技巧。场景存差异，所描绘的故事便也各不相同。

△ 图 2 从产品特征发散创意

结合以上特征，次视创意散的关键词为“轻松”与“故感”。“轻松”对应产品身的语言，目的是营造轻松、的阅读氛围；而“故感”则是为更地区分场，通贴近生活的画面吸引用户，引情绪共鸣。

注入灵魂：用趣味打动人心

基以上分析，我们通三个步骤来营造轻松、生动的视验：

Step1. IP 融-建立情绪触点

从产品口到文章分享，IP 融的目的是让风趣幽默的态度在产品内贯穿始终，增加情绪触点，赋予产品人魅力。

△ 图 3 通 IP 建立情绪触点

Step2. 把控-延续情绪氛围

在验程中，icon 需要做到视统一，以证整氛围稳定、连续。在次需求中，我们从风、彩、复程度等不同度对 icon 进行规范。

风格上，icon 统使用线性+色块视觉语言进表现，其线条用于勾勒基础场景，色块用于强调元素。色上，我们精简了图标颜色选择，在品黄仅以蓝、橙这组撞色来辅助情感信息表。为造“轻松”视觉氛围，套 icon 尝试使用断线风格来帮助页创造呼吸感，避免复杂图案带来拥堵与不适感。于 IP 物使用，为简化细节并保证形象特征在小尺寸下依旧能被晰识，物比例进了 Q 版处理，并规范本需求最小使用尺寸。

△ 图 4 调性把控：延续情绪氛围

Step3. 升温共情-传递喜悦与乐趣

仔细分析，“被窝知”各装疑问解答，其实也是在回应用户各各样情绪：有期待、兴奋、激动，也有焦虑、犹豫、不安。在 icon 设计过程，我们可以过诙谐、幽默来强化正情感、弱化负情感：比如过描绘 Mr.Wo 在飘窗上仰望空场景来放大浪漫生活憧憬情；又或是用淡定扫房 Mr.Wo 来缓解生问题忧虑情。这样来，家装百所传便不是严肃认真普，更表了被窝愿意与用户打造美好新家意愿。

△ 图 5 强化正情感

此外，巧妙利场景中的同情绪，够拉大图标间的差异性、增视觉的趣味性。前有举例提到，样是以“生”作为标题，两篇百内容篇侧规避装隐患、篇侧提升居住体验，分应用户潜在痛与爽。在设计过程回想生里代表“爽”与“不爽”元素，最先想到便是厕纸与桶搋子：能贱兮兮翘着小拇指抽取厕纸，必然代表这位朋友利完成了今日“健康指标”；而手足措握住桶搋子，则表明厕所定发生了什么不妙事情。将两场景具象化描绘出来，既成功区分了标题复带来难题，也表了品积极、阳性格。

△ 图 6 巧用幽默打造异

小结

在家装领域设计探索，我们发现共情设计核心目标是为用户带来美好感受，唤起其美好居住往。以幽默、风趣设计手法持续寻找品情感发力，除了换来们会心笑，也能够过不断情感累加，提升大众于品认感与依赖感。

目前“被窝知道”已在被窝 APP 中上线，虽然目前我们仅从 icon 设计的角对牌的情感融入进行了探索，但在未来迭代及他项目中，我们将尝试更多元、灵的创意方式来探索共情设计的方法路径。

欢迎关注作者公众号：「贝壳KEDC」