此前所接触到的用研方法中很少有是针对产品视觉设计的,今天记录的关于情绪板(Mood Board)主要是整理了微专业中的课程内容,同时结合自己完成课程作业的过程介绍情绪板的操作流程。。
概念解释:
情绪板一个由能够唤醒用户同一种情绪体验的图片、文本、实物样本等视觉元素组合而成的拼贴画。
使用意义:从定义中可以看出,情绪板是一种试图通过从用户情绪入手来为产品设计提供视觉元素,并统一产品UI的方法。网易的Bo-jian在其文章中指出:情绪板是依靠“图像”,沟通产品与用户、用户的潜意识与意识、用户的感性(情绪)与理性的方法。具体的操作意义在于:
a) 情绪板的制作是基于对产品的明确定位而进行的,所以通过情绪板能够形成一个统一和清晰的产品定位;
b) 设计师、团队成员与用户共同参与情绪板的制作,对产品的视觉设计形成共识;
c) 通过情绪板提供的视觉设计方案更加客观和理性,并有迹可循。
情绪板的操作流程
情绪板的核心在于根据产品定位得出合适的体验关键词,并据此选择出一系列与之相关的图片/实物样本,然后从中提取出符合产品定位的视觉元素。
由于微专业课程中介绍的案例可能不太适合分享,所以接下来以课程作业的内容为例介绍如何制作情绪板。
作业内容:假设你所在的团队要推出一个面向追求生活品质女性用户的一个美妆经验分享社区,请你根据这个初步的产品定位,以自己为用户,来用情绪板的方法给出最终产品视觉设计策略的建议。
第一步:确定原生关键词,这些关键词是设计师希望产品带给用户的视觉体验。
通常,这些关键词是通过内部讨论和访谈所得到的。但在本次作业中通过回收201份网络问卷询问女性网友“在想到‘品质生活’的时候,你想到的第一个词语/事物是什么”得到三个原生关键词:精致、优雅和舒适;
第二步:由原生关键词得出衍生关键词。
传统的情绪板会直接开始搜索与原生关键词相关的图片,但这样收集到的素材很容易出现同质化的问题。所以调整后的流程增加了对’衍生关键词’的探索:可以通过访谈或讨论的方式获得衍生关键词,比如在看到’年轻有趣’的时候,你想到了什么?如果’年轻有趣’是一种颜色/物品,你觉得它是什么?为什么?
敏捷的用户研究可能没办法邀请用户来进行关键词的衍生,因此衍生关键词同样可以通过内部探讨得出。在完成作业的过程中,同样通过网络问卷询问对于原生关键词所联想到的食物/动植物/人造物的联想进行了统计。下表中为出现频率较高的几种事物。
第三步:利用衍生关键词进行图片的收集。一般而言,某个产品会有3~5个原生关键词,然后每个原生词会有3~5个衍生关键词。微专业的老师推荐针对每个衍生关键词挑选1张图片就好。
在本次的作业中,我从上表中为每个原生词挑选出的衍生词如下:精致(蛋糕、多肉、玫瑰、钻石);舒适(棉花糖、猫、狗、沙发);优雅(红酒、天鹅、百合花、花瓶)。通过Lofter收集到的图片如下:
第四步:邀请用户进行情绪板的制作。通过关键词挑选的图片只能代表设计师和产品团队对产品定位的理解,但情绪板最终需要理解的是用户的情绪体验。所以在确定最终的情绪板中需要哪些图片的时候,应该邀请用户的参与。
4.1) 关键词的分维诠释
在用户进行挑选图片之前,先让他们在不同的维度去唤醒视觉设计想要达到的情绪体验能够帮助用户对图片进行更加准确的筛选,比如:
物化映射:在看到‘精致’这个词的时候,你会想到那些具体的东西?
视觉映射:整体来看,这些东西的外观是什么颜色的呢?有怎样的风格呢?
心境映射:当你看到这个东西的时候,你会有怎样的感觉呢?
4.2) 图片的挑选
一般情况下,你需要大概5个左右的用户来完成图片的挑选。然后由用户选择频率最高的图片构成最终的情绪版。
由于种种原因,我只邀请了一名用户,按照每个原生关键词挑选3张图片。如下图是这名用户最终挑选出的情绪板。
第五步:从情绪板中提取设计要点
对情绪板进行高斯模糊处理,然后使用工具提取虚化图形中的大色块。同时,从用户对于关键词的诠释中,也能够提取出设计风格、情绪体验等设计元素。如图,是从以上图片中提取出的色彩元素。
总结:前文中我按着作业的过程分享了制作情绪板的过程。老实说,对于结果我是不太满意的。由于是第一次接触情绪板,可能踩了许多坑:
a) 可能是问卷调查的原因,导致用户得出的原生和衍生关键词都存在一定意义上的重叠;
b) 用户在诠释关键词的时候很难绕开这个关键词以提供更有价值的方向;
c) 在进行高斯模糊后,图片背景的颜色变得突出,,对色彩的提取造成较大的偏差;
d) 最后也是最重要的一点,我大概知道目标产品是网易美学,但情绪板的结果与真实的设计相差甚远。最有可能的原因在于我在整个研究中把重点放在了‘追求生活品质’的定位,而不是‘美妆经验分享社区’的产品本身。
参考文献&推荐阅读
How to Create a Moodboard And Get Your Creative Juices Flowing