客观定义视觉风格－情绪版

在设计过程中，我们经常会主观的去对我们设计的产品定义视觉风格，从而忽略了产品的本质特性与用户的客观认知。情绪版方法论能让我们在做设计时，更加客观、理性的去定义产品的视觉风格，让设计更贴切产品气质。情绪版能让我们的设计更加可视化、透明化；也能很好的探索与挖掘客户用用户的视觉偏好，从而提高工作效率。

---

✩情绪版的定义

情绪版（Mood Board）是指将一系列的与设计主题相关的图片、文字、照片等抽象或具象的素材拼贴在一起，营造出产品对应的情绪和氛围，引起情绪共鸣。简单的说情绪版是视觉灵感的合集，是视觉思维的一种可视化表达方式。

✩情绪版的作用

情绪版是设计前必要的工作。设计师通过情绪版营造出的情绪与氛围，明确相应产品的视觉风格，从情绪版里提炼设计元素（色彩、字体、板式、图形、质感等）的特征，运用相关的设计中去。情绪版是帮助设计师理性、客观的定义视觉风格、是指导产品设计方向的重要依据。

✩如何制作情绪版

从产品中提取出核心关键词，从核心关键词出发进行头脑风暴，衍生出相关关键词，再进行图片素材收集，最后进行总结分析，提炼对我们有帮助的设计元素。

制作情绪版的步骤

一、明确原生关键词

原生关键词也就是产品的核心关键词。需要我们洞悉业务本质，提炼出核心关键词，我们可以从产品特色、核心目标用户、用户需求特征等出发探索产品的核心关键词。情绪版定义时可以选出3-5个原生关键词即可。

☇举个例子，比如公司想做一款理财类产品，我们可以根据产品定位与用户需求特征确定原生关键词。说到理财产品首先能让我们的客户放心与信任，让用户觉得我们的产品是安全可靠的，其次用户是很迫切的需要平台可以提供一些理财指导，让用户的财产安全外还能让它有所增值，所以懂用户、给用户推荐适合用户的理财产品，让用户感到贴心与专业是我们需要做的；在时间就是金钱的时代，让用户足不出户就办理好、快速办好相关的业务，让用户感到便捷高效也是很重要的。从而确定我们的原生关键词为安全、贴心、便捷。

二、挖掘衍生关键词

从原生关键词出发进行头脑风暴，挖掘与原生关键词相关的衍生关键词。这一步除了团队内部的头脑风暴外，我们还会进行用户访谈。衍生关键词可以是抽象的也可以是具象的。

☇接着上面理财类产品提取出来的原生关键词为安全、贴心、便捷进行头脑风暴与用户访谈，我们挖掘与提炼现关的衍生关键词为：

安全：可靠、信赖、放心、锁、保险箱、110、警察...（我一般会先收集抽象的，再收集具象的）

贴心：呵护、温暖、体贴、天使、微笑、向日葵 ...

便捷：智能、效率、科学、ai、人工智能、飞机、机器人...

三、衍生关键词映射

关键词映射是情绪版中非常关键的一步，因为这一步是由抽象转具象，对我们产品的视觉风格成型至关重要。在与用户访谈中收集到的衍生关键词，可按照以下三种映射关系进行提炼整理。

1.视觉映射

将我们的关键词联想到的视觉呈现。比如说到品质感会想到黑色、金色；说到简约会想到白色。

2.心境映射

从关键词联想到的心理感受。比如说到简约会联想到干净、整洁、透气。

3.物理映射

从关键词联想到的具体事物。比如说到高端会想到香奈儿、巴宝莉等品牌

四、搜索关键词图片

通过以上收集与提炼到的关键词，进行相关图片的搜索、从而提取生成我们的情绪版。

五、提取视觉风格

前面的所有步骤都是为这一步服务的——提取视觉风格。一直强调所有的设计方法论最终都是要回归到设计中去的。通过分析我们的情绪版、提取出我们需要的符合产品特性的视觉元素。视觉元素包括图形、色彩、字体、板式构成、质感。

重点讲一下图形、字体、色彩～

✭图形

从情绪版中提取符合产品气质的图形元素。比如我们做理财类的产品，收集到情绪版中的图形锁、保险箱等图片的图形元素都是直角，所以在我们的产品中直角会比圆角更符合产品的气质。

✭色彩提取

从情绪版中我们可以很明了的看出符合产品气质的颜色是什么。通过gif法与高斯模糊法提取我们所需色彩。

gif法：把图片导入ps中，选择存储为web所用格式－选择gif防色，就会出现相关的颜色。

gif法

高斯模糊法：把图片导入ps中，将图片进行高斯模糊你会看到图形中不部分区域颜色是什么，从而吸取提色。

✭字体提取

选择符合产品气质的字体。举例蘑菇街banner常用字体都是从时尚杂志中提取出来的，因为她们的女性用户会更容易被杂志字体吸引。

---

情绪版帮助设计师理性客观的定义视觉设计风格。帮助设计师收集设计灵感，推动设计方向。在自己定义设计风格前，记得使用情绪版方法论哦～