视觉设计师可能会花很长时间产出了精致的，高品质的设计，得到的却是用户或客户的一句话：“这不是我想要的！”一般来说，在没有实物前，人们并不清楚自己要的是什么。但是在看到成品后，他们可以轻易地判断是否符合自己的喜好或期望。因此，在为错误的设计方向投入过多前，了解用户对风格的期望和需求，从而确定整个网站或产品的视觉风格是有必要的。 而情绪板可以很好的解决以上问题。

什么是情绪板？

情绪板是一种启发式和探索性的方法，可以对如下问题进行研究：图像风格（photography style）、色彩（color palettes）、文字排版（typography）、图案（pattern）以及整体外观以及感觉。视觉设计和人的情绪紧密相连，不同的设计总是会引发不同的情感。

情绪板分为：拼贴式情绪板、参考式情绪板和模版式情绪板

拼贴式情绪板

直接将可以运用到项目中的图片素材拼合在一起。下图是NIKE MECURIAL系列的一个拼贴式情绪板，里面的图片都是来自官方的海报、图片和影像，这些素材都能够直接运用到我们的设计中。

参考式情绪板

将与设计主题风格相关或功能类似的真实项目拼接在一起。下图是一个以多彩和现代视觉风格的情绪板，里面选取的素材都是真实项目的界面。

模版式情绪板

灵感图片素材和概念控件的结合。概念控件是指概念设计中的一些核心组件，它可以是色彩搭配、按钮、卡片、图形或者是信息排版等，它们是概念设计的雏形。

情绪板作为可视化的沟通工具，可以快速地向他人传达设计师想要表达的整体感觉。

设计师要帮助用户发掘其真正需求，情绪板作为一个工具可以很好的帮助了解用户所希望展现的调性，从而提高生产效率和满意度。

对于设计师：是定义视觉风格和指导设计方向的依据；对团队：在团队之间传递设计灵感与设计思路，从而使想法充分融合，深化设计。

1.情绪板可以让客户参与我们的设计流程中，提高我们的工作效率。客户的加入，能够让我们更好的了解业务本身以及客户对项目的期待。尽早的让客户参与整个设计流程，还能够避免在错误的设计方向上投入过多。

2.情绪板是设计与客户沟通的可视化沟通工具，可以减少设计师和客户之间由于认知不同导致的沟通障碍。

情绪板的推导过程

在制作情绪板过程中，原生关键词的作用相当重要：

获得原生关键词是情绪板的第一项工作，一般从内部涉众（相关的产品和设计人员）及外部用户两种渠道获得。

自涉众访谈和用户研究中，可以收集大量的体验词样本。在获得这些样本后，可以内部进行讨论，通过归纳整理精简为几个关键词。

原生关键词提取好之后，可以在内部使用情绪板，也可以招募用户来完成。

01.明确原生关键词

访谈及用研结果导入产生原生体验关键词

原生关键词（Primary keywords）的产生是一个糅合的过程，它需要综合企业文化、用户研究成果、品牌/营销策略，行业特征、目标用户群、产品的价值定位等因素来界定，通常，这也会是一个商业决定。

涉及的访谈受众可以是产品、运营、交互、视觉、用户等，根据产品是0—1还是改版现有版本设置不同问题，以改版为案例，产品使用的感受、期望产品更新的样子等。以此得出的关键词，一般是很抽象的词汇。例如：亲切、熟悉、温度，一般一个产品的关键词不易过多3～5个为佳。

项目案例（示例）

某手机银行是以服务客户日常金融业务办理及投资理财需求为主的综合金融服务APP。面向30-40岁为主要年龄段的中青年用户群体。目前产品处于成长期向成熟期过渡。

02.挖掘衍生关键词

如果仅通过单纯对原生关键词的搜索，很容易导致不同参与者提供图片素材出现同质化的问题。所以，首先头脑风暴画出关键词的思维导图。一方面，合理地引导调研对象发散思路；另一方面，也在过程中深挖原生关键词在他们心中的定义。

衍生关键词（Derived keywords）是原生关键词的发散和提炼，主要通过部门内部头脑风暴或用户访谈得出。

将所有“衍生关键词”按照三个维度去分类整理。这个过程的目的是帮助项目组成员从用户的角度去理解“抽象关键词”的“具象诠释”。所有的关键词可按照以下三个维度分类：

访谈对象会根据主观印象以及过往亲身经历给出一些看法或答案，而很多时候并不可以把访谈对象的答案直接作为关键词，我们需要了解为什么，直到觉得用户的答疑非常清晰具体，然后提炼关键词。

例如衍生关键词访谈：

自由发散问题—看到“品质”你想到了什么？

引导发散问题—如果“品质”是一种颜色，你觉得是什么？为什么？

如果“品质”是一种食物，你觉得是什么？为什么？

如果“品质”是……

衍生关键词的分析—分维诠释

根据原生关键词的的定义，从视觉映射、心境映射、物化映射三个维度去理解“抽象关键词”的“具象诠释”。

03.搜集图片素材

根据“原生关键词”及发散的“衍生关键词”搜集素材，对应视觉映射、心理映射、物化映射三大维度。在素材搜集时具体以「具象」和「抽象」两个方向搜集。

1.搜集图片

根据已有关键词，搜集具象图片（具体的实物场景）—风格感受；根据已有的关键词，搜集抽象图片（包含色彩、质感、图形等元素）—设计元素。

2.素材整理

将收集到的图片素材，按照衍生关键词进行分类并提取生成情绪板。

3.邀请用户参与情绪板创建

1.主持人需要不断询问被访者，去探究选择图片背后的原因：“为什么你会选择这张图片？能否和大家分享一下你的想法？”

2.注意差异的挖掘。注意挖掘被访者之间的观点差异，一百个人心中有一百个哈雷姆特，同一张图片对于不同被访者可能会有不同的解释，如果好几位被访者同时选择一张图片代表他们各自对某个品牌的感觉，注意询问他们选择这张图片的原因是否一样。

3.可以呈现给用户的图片有限的，因此，在挑选图片时，需要内部研究和设计人员协同，根据视觉设计所需要考虑的几个维度结合已有的关键词进行图片的筛选。一般来说，在将图片呈现给用户之前，内部人员已经明确了每一张图片所代表的意义，在用户选择和访谈结束后，两方面的数据综合分析才能获得最终的结果。

04.创建生成情绪板

归纳和整理图片，进行排版组成情绪板，得到设计主题相关的内容。建立几个统一风格的情绪板，以便更好的捕捉产品相关的感觉，为探索设计方向提供灵感。 

05.确定视觉设计策略

综合情绪板制定风格

提取图片主要颜色，明确主色。结合衍生关键词分析结果，将情绪板中高频物化纹理和材质提取出来。

1.色彩提取

通过对色彩的分析发现，高明度低饱和度的色彩搭配，能让画面保持丰富的同时显得干净和协调，可以达到「高效」「简洁」的效果，例如：邻近色、类似色、低饱和度对比色。

电子化情绪板对“色彩分析”是比较方便的

1.图片在PS中进行高斯模糊或马赛克处理，使用颜色滴管提取大色块；2.图片导入PS中，选择存储为Web所用格式－选择Gif仿色。当然，现在已经有很多用户配色方案提取的网站和软件，这样更事半功倍。

通过对情绪板中颜色提取并结合品牌色及对当下流行趋势的把握，确定如下颜色运用：

2.图形提取

通过对图形分析发现，基本几何形具有肯定、纯粹的特点，可以很好的体现「品质」与「精简」的特征。例如：方形、圆形等。

融入图形符号 强化视觉语言

图标使用深色+渐变色的展现，对比突出、品牌属性统一、信息层级分明。简约笔挺的线性图标更符合平台信息架构清晰，内容易懂的特征。

3.字体提取

通过对字体的研究发现，中文字体端庄匀称、字体方正。例如：思源宋体、方正宋体等，英文字体线条简洁、字形严谨。例如：Helvetica、Avenir、DIN等，都比较符合「品质」和「简洁」的特征。

笔画有粗细变化，而且一般是横细竖粗，末端有装饰部分，给人正式、正规感觉，既可以区分标题与模块内容的差别，也可以增加产品的差异化。

4.构成提取

通过对构成的研究发现，并置型和九宫格型构成比较严谨和秩序，满版型和通栏型构成，视觉传达直观而强烈，给人大方、舒展的感受；这与「高效」的特征是匹配的。

5.质感提取

在质感的选择方面，大多与当下流行风格趋势相贴近，例如：圆角卡片、弥散投影、渐变、轻拟物、毛玻璃等，可以有效地表达出「精简」「品质」的情绪感受。

总结

情绪板是一种设计方法论，可以指导设计方向，传递设计灵感与思路。

制作情绪板时，首先要明确原生关键词、然后头脑风暴挖掘衍生关键词，接着搜集相关图片并提取生成情绪板，另外访谈用户收集衍生关键词映射，最后通过情绪板和关键词映射来提取视觉风格。

在项目前期，我们可以通过情绪板来定义产品整体的设计风格和产品主色调，设计过程中，界面排版、图标的颜色、形状和设计细节都可以使用情绪板来定义。

无论我们做什么样的设计，情绪板都无疑是一个很好的工具，它不仅可以帮助我们明确设计需求，做出更容易被大众所接受的设计，也可以帮助我们更好地去与领导和其他需求方沟通，向他们传达设计的价值主张，最终达成共识，提高设计效率。

Powered by Froala Editor