更新时间：2026年10月14日

作为UI设计师，你是如何处理收集下来的素材呢？是放在文件夹里，等需要的时候再一张张搜索？还是放在AI里，让整个画板混乱不堪，扰乱自己的设计思绪？因为没有有效的管理好自己的素材资源，导致在真正动手做设计的时候，依旧脑子一片空白，毫无思绪。如果这时你懂得使用“情绪板”，那就不会让自己的灵感偷偷溜走。

情绪板是一种工具，可帮助设计师找到正确的设计方向，并为他们想要创造的情感体验创造坚实的基础。学会怎么应用情绪板，就要先了解情绪板的创建方法和流程，下面由Pixso分享情绪板设计指南。

情绪板是由文本、元素、图片拼贴而成的画面，能够很好地帮助设计师与用户建立感性连接，定义商业设计的方向。情绪板的设计流程大概分为前、中、后三个阶段。

情绪板不是把漂亮图片堆在一起，而是把目标用户会感受到的语气、材质和界面线索先对齐。以医疗预约 App 为例，先确定“可信、平静、清楚”的关键词，再用素材解释取舍；可在Pixso 情绪板中整理素材、标注来源并邀请团队评论。

先写体验目标，再收集能证明它的素材

医疗预约场景既要降低紧张感，又要让用户快速找到科室、日期和确认按钮。关键词不能只写“高级”“简洁”这类无法验证的形容词，应该结合用户任务改成“信息分组清楚”“颜色不过度刺激”“关键操作容易确认”。每个素材旁边写一句保留理由，后续才知道它如何影响 UI。

素材线索	可以保留什么	排除边界	映射到界面
诊所环境或自然光照片	柔和明度、清晰留白、可信的真实质感	过度拥挤、无法确认授权或会引起不适的画面	页面背景、卡片留白和信息密度
字体与排版样本	标题层级、日期和科室名称的可读关系	装饰性字体导致长名称难以识别	标题、表单标签和按钮文案
颜色、材质与图标	主色/辅助色的角色、边界和强调方式	只凭流行色决定警告或成功状态	操作按钮、状态标签、错误提示
竞品或社区案例	记录布局问题和可借鉴的结构	直接复制品牌资产、未经许可的图片或文案	转化为自己的组件与内容规则

素材齐全后，把关键词、素材和 UI 映射放在同一画板上，让产品、设计和开发能够指出具体异议：是颜色太弱、信息层级不清，还是照片与真实服务不匹配。情绪板只负责建立方向，不代替后续的组件规范、可用性测试和版权确认。

最终情绪板应保留关键词、素材来源、排除项、颜色/字体/图标映射和待确认问题。评审评论要落到某个素材或 UI 片段，例如“该照片的高饱和红色会与错误提示混淆”，而不是只写“感觉不对”。确认方向后再把结论同步到组件、页面和原型文件。

1. 明确原生关键词

在制作情绪板的过程中，原生关键词的作用相当重要：获得原生关键词是情绪版的第一项工作。原生关键词的产生是一个糅合的过程，它需要综合企业文化、用户研究成果、品牌/营销策略、行业特征、目标用户群、产品的价值定位等因素来界定。通常，这也会是一个商业决定。

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

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

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

根据“原生关键词”及发散的“衍生关键词”搜集素材，在素材搜集时具体以具象和抽象两个方向搜集。

根据已有关键词，搜集具象图片（具体的实物场景）—风格感受。根据已有的关键词，搜集抽象图片（包含色彩、质感、图形等元素）—设计元素。然后将收集到的图片素材，按照衍生关键词进行分类并提取生成情绪板。

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

综合情绪板制定风格，提取图片主要颜色，明确主色。有了前面的一些情绪板，下面就开始提取各个关键元素，如图形、色彩、布局构成、字体、质感等开始进行设计风格发散。

Pixso认为，情绪板对项目设计风格的探索和制定有很好的帮助，将情绪板融入到所从事的设计项目中是一件有意义的事。因此，建议你可以按照上面的情绪板创建步骤开始制作情绪板。如果缺乏灵感或需要收集素材、模板的话，可以打开Pixso的社区资源，里面有海量优秀的设计模板素材可免费使用，赶快来试一试吧！