Banner设计保姆级全方位教学！万字干货！ 收藏
编者注：Banner设计看似简单，实则囊括了 平面设计 、设计心理学、用户研究、文案设计等多领域的知识点，本文用1万2千字的超长篇幅，帮你从零开始掌握 Banner 设计。
在工作中需求方往往不是设计出身，提需求时传达上往往也没有办法很好的表达自己的想法，在这种需求模糊的环境中往往做的 banner 会被需求方怒怼，而追问原因是，只会得到“不好看！”或者当我们每天疯狂填充自己的素材库时，很多小朋友都会有“该如何分辨作品的好坏”这样的疑问，那到底什么样的 banner 算是优质的 banner 呢？
一、简单了解 Banner 本质
他真的只是一张简单的图片么？答案肯定是否定的。这张图不但起到宣传的作用，而且是页面中最直接的流量变现的渠道。
1. Banner 在运营工作中的作用 从需求方的角度来看 banner 的作用大致分为两种：
便于上线操作
如果直接投放活动内容页面，首先屏幕使用空间有限，不能多个活动共同展示，其次每次活动上线基本上都是凌晨，暂且不说累不累，在人工成本上就会消耗大半。如果遇到大促或者重要节日，那全体运营需要时时刻刻更改内容。
而 banner 的定时上架和权重排序大大减少运营工作成成本，提高工作效率。
清晰看到数据反馈
说白了，banner 就是广告形式的一种，在一款 APP 中，除 banner 外还存在很多形式的广告比如开屏广告、弹窗广告、落地页内嵌广告等。而对于运营同学来说，他们需要清晰的了解每一条广告，每一种投放形式的数据反馈，根据数据对每次活动的内容进行复盘、优化。应对以后的不同的活动形式。
2. 优质 banner 的特点 由于 banner 的位置和大小都属于产品中的绝对的巅峰，但用户在此页面停留的时间往往很短暂，所以在整个产品页面中，视觉层面会呈现鲜明的中心，设计层面需明确视觉层级关系，以最短的文案加上图像形式直击目标用户内心，使用户快速获取信息。
三秒原则
通过对市面上大多数产品 banner 进行研究，发现轮播中每一张 banner 停留时间不超过三秒，在这里我们需要做的就是在三秒内传递用户所有重要信息。
增强可读性
由于 banner 是由文案、CTA 按钮、配图、装饰元素、背景组成，增强识别性一般指的是文案以及按钮元素。
文案部分需要尽量精简，控制在一级标题、二级标题、备注标题三段式，针对不同的目标用户做到内容可读性，确保用户快速获得信息。
设计部分不仅要保证页面整体美观、观看舒服，更重要的是确保信息层级关系，引导控制用户视觉动线。
其目的都是为引导用户不断的参与内容，促使 banner 极大程度的转化用户，同时也间接提升了企业的商业价值。
二、Banner设计的核心目标 在我看来，与文字信息相比，我们更容易被图形化的内容所吸引，也更加能够快速理解图形化内容。产品页面的 banner 也是主要展示一些产品最近的活动或者一些传递产品内容信息的图片，而根据 Jakob Nielsen（尼尔森十大可用性原则的那个男人）做了一个眼动实验，发现 2010 年后用户平均花费 80.7%的阅读时间在前三屏，其中首屏时间占总时长的 57%。基于在第一时间抓住用户注意的角度出发，我们必然将最显眼，最突出的 banner 放在首屏的位置，这样不仅让我们进入页面后第一时间看到，而且还可以在三秒内了解具体主要宣传信息。
咱就是说市面上一切的广告都是为了转化用户，Banner 作为产品吸睛的工具也不例外，通过展示现阶段真实准确的信息转化用户，从而达到实现商业价值的目的。
试想如果我们是一个企业的老板，我们在线上投放 banner 广告后，用户从打开页面到最终被我们转化会尽力哪些步骤呢？
（一）正确传达信息 有一天你的好朋友在过生日，你拿着一个生日礼物送给他，你的朋友肯定希望打开礼盒直接就能看到礼物，而如果里面和套娃一样全是包装盒，你的朋友也许只会这个表情，然后流露一丝尴尬。
这种感同身受就如同用户看到花里胡哨的 banner 看半天都不知道是个啥一个样。
为了缩短用户打开产品到点击 banner 之间的时间，我们需要将用户想成小朋友，从视觉动线上要快速传达准确信息，但一切的前提是不违法，遵守广告法中真实有效的法律法规。
1. 快速 − 精细调整Banner视觉动线
（1）什么是视觉动线？
我们可以将一个 banner 理解成你大学所在的城市的地图，回想一下当年你来到这所城市后，首先想到的是什么？
以我来说，我大学是稳坐中国宜居城市榜首的城市-成都，来到这所城市后首先想到的就是吃喝玩乐感受这座城市的美好。但我又不能没有目的的乱逛，相信喜欢旅游的朋友都做过攻略，都是想在最短的时间内逛某个城市，我也不例外，从路线到景点大小再到美食据点等等安排出一条最佳线路。而在欣赏景区的过程中如果遇到很不错的的地方，肯定会记住之后频繁到访，为其消费。
回归到 banner 中，视觉动线就是最终安排出的这一条旅游路线，而“做攻略的我”这个角色就相当于在手机面前的你“ 设计师 ”这个角色，由你来安排用户在 banner 内观看内容的顺序，而“不错的景点”对应在 banner 内是可以让用户进行下一步行为，保证用户留存，提高转化率的亮点区域。
如何在 banner 上改变色彩、文字、排版等，告诉用户先看哪里然后再注意哪里，在哪里改着重停留呢？有以下几种方法：
① 古腾堡图表法
首先是我们从古至今的习惯性的眼动规律使我们观看内容是都是从上到下，从左到右的规律，其次古腾堡图表法（对角线平衡的和谐状态）告诉我们浏览内容时往往是由左上至右下的视觉动线，左上角与右下角可以看做第一视觉落点区和最终视觉落点区，而右上角和左下角往往被视为视觉盲区，经常被忽略。
在视觉动线设计中与之相似的还有尼尔森 F 型视觉模型和 Z 型布局，这两种布局形式常常作为 Web 端的载体，我们可以简单的了解一下这两种布局形式。
② 尼尔森 F 型视觉模型
用户注意首先在顶部横扫一遍观看上半部分内容，造成了水平的一条视觉动线，之后用户将页面下拉看到的内容会比第一条动线短，之后受到用户在当前页面注意力的影响，持续下滑，观看内容也越来越短，浏览模式也形成了字母“F”的形状，被称为 F 型模型。
下面是尼尔森报告中的热度图，利用颜色来表示浏览者眼光聚集的热度，分为最热（红色）、较热（黄色）、不热（蓝色）和基本不关注（灰色）4 种。
③ Z 型视觉模型
通常在 Web 端打开一个网页后，用户注意往往在头部的 logo-导航横扫一遍，再到网站内容和构架，最后会移动到网站下方行动按钮处，形成字母“Z”，被称为 Z 型模型。
（2）如何让用户跟随视觉动线观看？
① 整体排版形式
左右排版
应用于 banner 内容排布时受限于 banner 的长条尺寸，视觉盲区压缩。往往将重要的信息放在左边，右边放主视觉图形和其他元素。运用视觉元素创建一条虚拟的“动线”，引导用户实现从左往右移动，符合用户习惯性的眼动规律。
在这种左右排版是最我们最容易上手的一种排版方式，虽然不算很惊艳，但是永远不会出错。其中根据文字与图形级别高低决定采用左文右图还是右图左文。
不论主视觉是产品还是人物，再怎么精准表达，没有文字衬托，用户无法迅速了解 banner 表达的具体内容，所以为了用户快速接收信息，在左右排版中文字部分与主视觉图片在版面中占比永远是接近黄金分割比例的 6:4，这样可以更多的关注文案内容。
如果将信息传达精准的图片排在画面中，不论有无文案，用户的惯性思维想到的内容都会八九不离十，例如下面这张图。
即使没有文案我们看到这张 Banner 后，也会以樊登读书 VIP 卡为中心想到销售会员卡、促销、打折等这些方向性明确的词。
试想一个问题，如果我们将识别性较弱的图像信息排在画面中，会出现什么样的情况呢？
首先当内容识别性较低图片排在画面中时，如果没有文案，我们没有办法准确的了解信息内容。例如这张图片只有正面的女生自拍照，我们可以将他放在任何信息元素的宣传中，例如美妆、服装、旅游或者其他。
其次如上图所示，如果内容识别度较弱的图像信息放在左侧，根据视觉动线原理用户优先看到内容含糊不清的图像信息后，接下来看右侧的文字信息，然后再回看左侧图像信息去理解文字内容，查看图片这个步骤相当于重复两次，这样的布局排版与我们之前说到的“3 秒原则”相违背，降低阅读效率，加重用户识别内容的时间导致用户接收重要信息时常陡增，可能会造成用户流失。
策略 1：左文右图
文字信息级别更高，文字较为重要更需要被用户关注，我们更倾向于将文字信息放在优先被识别的左侧，主视觉放在右侧，这时放在右侧的主视觉内容往往相对模糊，排版和设计上更加简单，更要注重左侧文字的识别性和易读性。
策略 2：右图左文
一般应用于音乐类或电商产品 banner，由于需要展示产品或者需要向用户展示重要的图像信息，这时图片层级更高，需要摆放在左边，需要右侧图片内容相对清晰更容易被用户读取，先利用主视觉图片吸引用户注意，再配上左侧优先级较弱的文字阐述，banner 节奏松弛有度，非常棒！而这时根据视觉动线原理，右侧文字排版的自由度则更高于左文右图。
除左右构图之外还有以下几种常见的构图。
文字居中排版
我称它为“左中右构图”这种形式是最好突出文字的一种方式，与左右排版上对比，这种方式比较难以掌控。趣味性也相对较低，形式上居中位置的文字是 banner 中层级最高，最需要被用户注意到的内容。周围元素主要起到陪衬作用。
文案中主标题是强制必须有的，作为重要的识别信息内容，字号也是最大最醒目的，设计上可以更加精细化更加有质感，这样可以快速吸引用户注意。副标题则可有可无，不需要着重去表现。
策略 1：环绕式排版
我将其称之为“图中有文”，由于文字居中，层级性较高。相关元素围绕文字形成环绕效果，有效的强调文字，但在单一的文字排版会造成视觉中心留白空间过大，画面太空，这时的文字设计就需要更大更加突出，字间距相对拉小。设计上装饰性会更多一些将文字设计更加偏向图形化。
策略 2：上下排版
常见于 banner 中出现多个主题物，主题物在下方一一排列，但依据视觉动线的原理，人们习惯性的从上而下的接收信息，所以上方文字在排版和设计上需要着重处理。
策略 3：纯色蒙版给文字垫底
一般用于图片以摄影作品或者抽象的图像为主，因为摄影作品为写实作品，抽象作品会加大减弱图像信息，这里的图像主要作为一个装饰，不能过多破坏其画面，所以选择文字的设计样式会相对简单，否则画面会乱成一团，影响用户识别信息。
2. 减轻辅助元素不等于元素粗糙
① 文字排版形式
文章开头我们也讲了，一个优质的 banner 本质是引导用户操作，当我们打开 app 后在 banner 中最先看到的是那一部分呢？是图像？是文案？还是装饰元素呢？
我想大家应该和我一样在第一时间被整体视觉所吸引，接下来在视觉动线的引导下才是局部的观看，在所有局部区域中是否进行下一步动作百分之七八十的原因在于文案的梳理与排版效果。
我把《写给大家看的设计书》中可以与文字排版有关的内容高度总结为以下几点：
文案中影响用户注意的元素：
排列顺序
当我们还是小朋友的时候，老师就告诉我们一篇好的文章结构式总分总结构，一篇文章或一个段落一定要把重要内容写在最前面，这样读者才会有读下去的欲望。
在 banner 视觉动线的指引下，我们也同样需要把重要信息或者转户用户的重点内容的放在最显眼的地方并且着重突出。
字号与字重大小
首先我们浅看一下字体字重与大小的影响。
在 banner 中，大标题一般都会很大，笔画越粗，画面中也会越亮眼，为了不抢大标题的风头，小标题则会相对变细变小，颜色选择上也会更加弱化。如上图所示，字体越大，画面中占比越大，用户看到画面时会直接被大文案吸引，同理字重越大，字体越粗颜色比例越重，也会吸引用户注意。反之，字号越小字重越小越不容易被用户注意到。
由于 banner 作为引流变现的一个广告内容，文字一定要有辨识度和可阅读性，所以文字不能太大或太小，在做好文案内容的量级区分后务必限定最小字号。
颜色饱和度
为了凸显文字的层级关系，我们平时除了加粗加大外，有一个更直接的办法就是给层级最高（大标题）的文字添加高饱和度的颜色，加快吸引用户视线。对于其他文字我们可以调整透明度来降低层级关系。
由于 banner 作为引流变现的一个广告内容，文字一定要有辨识度和可阅读性，所以文字颜色不能与背景颜色过于接近。在做好文案内容的量级区分后务必限定字体颜色规范。
根据视觉动线处理文案位置
从第一板块讲到的视觉动线了解到我们浏览信息的顺序是由上到下，由左到右，因此我们需要根据画面内容和传达的主要信息来决定文案的具体 位置。
接近原则
在打麻将时，什么时候我们会胡牌呢？
一般我们在摆牌时，都会把同类牌放在一起方便查看牌型。在文字排版中也是这样，相近的各部分趋于组成整体，便于用户直接提取关键信息。
文字颜色选取
文字作为 banner 中唯一可以突出买点的点，一般来说主标题都会做一定的设计或突出，很多同学就会忽略二级标题，字库字体随便一打，颜色也为了统一画面选择接近画面的颜色，导致小标题阅读成本增加。
在 banner 这种寸土寸金的地方任何一个元素都不能忽视，所以文字一定要清晰明了，一定不能选取与图片同色系的颜色。
② CTA 按钮
什么是 CTA
当我们了解到 banner 广告条的最终目的是转化用户，设计中如何让用户感知我们做的 banner 可以进行下一步操作呢？
在营销学中 Call to Action（CTA）又叫做“行为召唤”，可以引导用户进行点击的行为，是最常用的交互元素。经过测试，在 banner 中使用按钮形式的 CTA 会更容易引起用户注意，点击率也越高。直接链接到内容落地页的按钮形式诱导用户不自觉的的点击进行下一步操作从而提高 banner 转化。
如何利用 CTA 按钮中的文案
用户看到号召性文案时首先会考虑“我要不要点击？
少即是多
一般将关键信息放在 banner 主文案中叙述，在按钮中短小精悍的语言一般更加能够让用户快速产生共鸣，一眼激起用户点击欲望。
文案长度直接影响用户做出下一步决定的时间，按钮上的文案尽量短小精练，任何一个不必要的文字都有可能导致用户视线离开 banner。
激发用户点击
时刻想着按钮最终目的是为了用户点击进行转化，用户对画面中按钮功能性文案一目了然，才会更愿意点击。
一般为了激起用户的点击欲望，使用的文案都偏向于“点击 XX、领取 XX”这一类指导性较强的词，或者完全能够满足用户兴趣的“满送、满减”类促销词。
增强用户紧迫感
在我印象中，短时间内频繁更换 Banner，让用户时刻感到“错过一个亿”的时候就是每年大促，经常会在 banner 为和落地页内增加倒计时，营造满满的紧张氛围，就也就是这个时候我们会不经大脑直接下单。
我们在采用 CTA 文案时是否可以吸取经验而自用呢？
我们选取文案时经常采用“立即 XX”这种既可以增强用户紧迫感又非常简洁的文案类型。
满足以上要点的文案才能将用户行动力最大化，增加主题内容的紧凑感减少用户看完文案后的思考时间，提高用户参与度和 banner 点击率。
如何设计 CTA 按钮
在了解了视觉动线之后，我们来浅谈一下如何将视觉动线中的原理运用在 CTA 按钮设计中。
CTA 按钮位置
根据设计的一致性原则我们为了减少用户学习成本，经常将文案与按钮位置与市面上大多数排版一致的排版呈现在用户面前，这样布局可以提高用户对活动和企业的可信度而且可以更容易的理解内容。
对于用户来说观看内容时浏览是他们的第一行为，注意力会根据排版顺序进行移动最终停留在操作行动点上，此时 CTA 按钮就至关重要。
根据对古腾堡图表法的了解，我们可以看出三段文案内容中颜色深浅程度为用户观看停留时间长短，用户的浏览动线影响了文案信息的排布。
如果对这些不了解，只是单纯为了填充画面及文案留白区域将按钮随便摆放位置，则在阅读顺序以及操作上极大影响用户使用体验。
根据设计中亲密性选择，信息之间的间距越小，我们会直接将是看作一组，所以我们经常将 CTA 按钮放在文案内容之后，不仅可以提升查看效率而且可以促进用户转化。
通过对比提升按钮识别度
1）颜色区分
由此可以看出颜色的强烈程度直接影响用户的注意程度。对比度越强越能吸引用户注意，其中白色和黑色被称为中性色也是所有颜色中亮暗的极端值。
通过强对比的颜色可以快速表示按钮在画面中的重要程度，并且可以从背景颜色中跳脱出来并达到吸引用户的目的。
在亮色背景中使用黑色按钮，暗色背景中使用白色按钮，是最突出也是最具有吸引力的。
2）字重区分
除了增加颜色对比外，按钮上的文字可以选择有多重字重的字体，选择较粗的字体增加视觉权重，突出按钮的优先级。
通过改变外观提升识别度
1）大尺寸按钮
简单来说就是尺寸越大，在屏幕中占用空间越大，越会被用户注意。
从另一个角度来看，尺寸大不仅可以吸引用户注意，引导用户点击，而且会扩大用户的点击操作空间，提高操作容错率。
除了按钮变大外，在手机端的 CTA 按钮设计中需要留出足够的安全空间，便于用户快速进行点击操作。
在设计角度来看需要注意的是，不论按钮多大，都尽量不要超过文案长度，这样可以增强用户查看内容的紧迫感觉，提高用户点击率。
2）动效按钮
当画面中元素较多或者画面元素全都是静态的，此时我们应该如何让用户更快地被按钮所吸引呢？
如上图所示，给 banner 按钮加入动效，在整个静态页面中了快速吸引用户注意。
A/B 测试
虽然上面说了很多如何突出 banner 中 CTA 的方法，但为了最终结果不能纸上谈兵，还需要通过多轮 A/B 测试对比数据结果，测试出最吸引用户的样式、颜色、文案，便于下次设计是指出结果。
（二）吸引用户点击 1. 精准 − 分析用户人群
大家作为设计师，在做设计时不能两耳不听天下事，闷头干，在拿到需求时，首先要分析 banner 的产品定位、投放渠道等信息来了解目标用户的行为特征，情感和思想诉求，了解目标用户群体的群体特征提炼产品卖点。
近几年经常会听到“用户画像”一词。那什么是用户画像呢？用户画像有对我们的 banner 设计有什么用呢？
① 了解用户画像
在我们工作中的“用户画像”实质上是为了从感受上理解用户帮助我们推导结果的工具。
我们常见的“用户画像”分为两种，一种为大数据时代下推荐算法的用户画像，另一种是具有共性的用户画像。
推荐算法的用户画像
我们先来浅谈一下大数据时代下推荐算法的用户画像。
这里所说的标签就可以简单理解为是抖音对我朋友的用户画像。将我朋友所有爱好抽象为多个标签，利用这些零碎的标签打造出一个具体化的用户形象。从而对我这个用户进行针对性的服务。
设计师的用户画像
而另一种针对设计师的用户画像则有所不同，它是从众多的使用者的使用行为中抽取共同的行为，将其汇聚成一个虚拟形象，这个虚拟形象不一定完全符合这些使用者，甚至虚拟形象的某些行为与使用者行为相悖。
举个简单例子，还是在抖音中，我们找了 50 男孩子，其中有 40 个时刻关注球鞋产品动态及价格信息，而这 40 个男孩子中有 30 个会在肌肉体育生直播间直接购买，15 个男孩子会在专业博主直播间下单，还有 7 个男孩子一直在看价格信息，但迟迟不动手。
这 40 个男孩子关注球鞋就是我上面所说的是用这种的共同行为，将其汇聚成一个虚拟形象：比较喜欢球鞋，每天游荡在专业博主和肌肉体育生直播间坐等福利，将其收割。
如果我们作为抖音的设计师，我们要将两个案例中的用户画像作为一个标准提升设计部门与其他部分之间协作能力。防止各个部门由于对用户认知不清而导致的项目延期或者工作暂停。我们需要与我的朋友产生共情，设计出更针对他本人的设计方案。
当然了，用户画像并不是一两句话能说完的课题，我们在之后的文章中慢慢详谈。
② 如何利用用户人群做 banner
随着短视频自媒体的快速崛起，知识付费类产品涌现市场，知识付费不同于之前的教育类产品，他的用户人群更广，上到高端金融理财，下到摆摊卖烧烤。当很多小朋友面对用户人群体量如此之大的板块的 banner 思路混乱，无从下手。我们就浅谈一下如何通过用户人群来制作相应 banner。
首先我们要善用行业属性，要明确的是知识付费内容不属于强制性学习，主要以用户兴趣或者希望主动提升充实自己为出发点。设计就会相对容易一些，主打风趣幽默，短期速成，干货满满。
高端理财金融课
一听“高端”“理财”“金融”这三个词，你会想到什么？
这一部分的用户基本上都有一定的原始积累，他们自身会有一定的优越感，对于这部分用户来说他们学习的需求不仅仅是解决温饱，也不全是为了课程中的干货内容，更多的是体现自己的社会价值，他们对于课程内容更关心的是哪位行业大佬授课，与讲师产生链接，扩展人脉，建立圈层。
对于这一类人群，我们设计 banner 时不但要简约大方，而且要让目标人群感受到优越感。
对于这类用户我们该如何利用我们的设计能力体现出这门课程的含金量和专业度？
我们通常运用高饱和颜色（红黄蓝三色为主）、简单的元素和规矩的三段式排版体现课程的品质感。
兴趣特长类课程
对于选择 这一部分课程的用户，基本上人群定位在 30 岁之前 ，应该和在坐的同学年龄相仿，那我们这个年龄段的用户更需要什么呢？
这个年龄段的用户一般在外打工的居多，虽然生活辛苦，但对生活充满着向往，具有一定生活情趣，对兴趣爱好的需求是为了充实自己的业余生活，参与其中扩充自己的交际圈，找到志同道合的朋友，得到满足感。
但在课程内容的选择这部分用户往往不希望内容不要太冗长，浪费自己的业余时间，希望学习过程中不要太过枯燥，在较短的时间内可以稳，准，恨快速获得干货内容。
由于对于用户来说，每一个兴趣爱好都是一个新的技能，我们可以看到这类产品的 banner，基本上都以“0 基础、快速入门”快速吸引用户，内容主题感更强，设计更加简明了，甚至以文字为主视觉，直击用户痛点，更加容易接受和理解。
根据行业属性制定 banner
微信创始人张小龙曾经表示“用户都是懒惰的，不 愿主动获取信息，更倾向于被动获取”为了让用户快速定位企业定位，我们经常使用行业规范制定 banner 的部分内容，例如在颜色选取时，除大型节日类的特殊情况，往往优先选择行业默认色调，其次选择画面中扎眼的亮色调，最后才是符合文案内容的情感化色调。
用户在长期的被动获取下更容易识别每一类行业的大属性，为了促进用户识别和点击，我们要做的就是顺应用户规律，而不是调教用户重新认识某件事物。
③ 如何让利用目标用户选择文字
常言道：字如其人，笔记识心，在座的各位女同学应该都经历过这样的事吧，在路上对迎面走来的人总会上下打量，虽然只是人群中的一眼，但是也会从体型，身材，衣品，妆容等等一系列方面进行评价，甚至对于某一项分数极高的路人到家后还会细细品味。
这么看来其实我们字体也是一样的道理，我们一般拿到一个标题后会从字体结构，笔画特征以及字效感受到字体的性格特征。
banner 中的标题文案可以快速将活动内容完美植入在用户意识之中，这样不但可以让用户在较短的时间了解活动内容以及活动利益点，而且可以大大降低与用户的信息沟通成本，提高用户对活动的关注度与参与率。
所以在选择字体时首先要考虑的是目标用户群体，其次要考虑的就是字体性格气质是否符合画面调性。
纵观所有的字体无非是官方字体，手写字体以及装饰性字体三种。
官方字体
我们经常经常看到的宋体、黑体、等等这些四平八稳一看就是直接打出来的字体俗称为官方字体，使用这些字体四平八稳不会很出彩但也不会出错。
黑体（无衬线体）
黑体又称为为衬线体，字体笔画无过多修饰，直来直往非常硬朗，辨识度较高，偏向理性，气质简约大气，自带稳重感和现代感，大家可以用自己看一下，基本上所有手机厂商内置字体都是黑体。
在黑体中一般字重较小的黑体笔画纤细高挑，具有简约、年轻\有品质感觉。用于电子类产品以 Apple 为头阵的产品以及高端商品如珠宝首饰类，面向人群为小资女性。
字重大的黑体，具有严肃规矩的性格，用于比较有力量和冲击力的产品中主要针对男性用户为主。
优设标题黑字体下载！优设首款免费可商用中文字体来啦 优设标题黑请从优设官网下载，我们会将最新版本更新在此，大家记得收藏本页面。
阅读文章 >
圆体
除了以上笔画尖锐的黑体外，还有一种非常常用的黑体—圆体。
它属于合规的一种延伸产物，由于它将原始黑体的边角全部圆润化，让字体显得更加圆润，也没有了原始黑体的沉重和锋利感，具有活泼感及趣味性。
也正因圆体边角的圆润，可以让字体在后期笔画变形设计时拥有更大的可塑性，可以表现女性的柔美也可以表现儿童的灵动与天马行空的脑洞。
圆体主要出现在食品，宠物、低幼、家居等产品，主要针对的用户群体以小朋友和女性为主。
优设标题圆开放下载！优设网出品的第4套免费可商用字体 从「优设标题黑」发布至今已有两年多，在这款国民级字体发布后，优设马不停蹄，集结了团队的中坚设计师，继续发布了电商领域的宠儿「优设好身体」和另一个风格可爱的「优设字由棒棒体」。
阅读文章 >
宋体
宋体最大的特点就是笔画末端有一个小的角做修饰，整体显得横向笔画较为纤细，竖向笔画较粗，装饰性较强，属于自带浪漫气息与人文气息凸显文化的气质挂性格，除原始的宋体外，以宋体延展的字体同样有类似性格，经常出现在复古怀旧类，文艺以及美食和时尚类产品，面对用户群体主要也是女性为主。
可商用宋体推荐：
手写字体
一提到手写字体，让我们印象深刻的一定是毛笔书法体，这类字体笔触洒脱，随性写意。非常凸显产品个性与中国文化，一般使用在文艺主题或者出现在极具个性的 Z 时代年轻化产品之中。
还有一类比较稚嫩的手写体笔画相对柔和，充满稚气非常平易近人。经常出现在少儿类或者抒发情感的产品中。
书法字体笔画较为复杂，一般以图形的形式出现在 banner 内，或者为了吸引用户注意会在标题中某个文字上单独使用书法字体。
优设书华体正式上线！优设首款可商用手写书法字体火热下载中 这两年免费中文字体越来越多，优设也发布了4款：优设标题黑、优设好身体、优设字由棒棒体和刚刚发布的优设标题圆。
阅读文章 >
装饰性字体
装饰性字体一般非常强调 banner 的整体调性，以及人群划分，由于主要作为 banner 主文案使用，这里的装饰基本上以原字体本身特点为出发点，在不失文字可读性和辨别性的同时创造出携带艺术气息并且能够带入用户的字体，启发用户按照我们的想法去感受，去思考，最终达到吸引用户眼球的注意，引导用户参与的目的。
我们选择不同的字体其实也是在变相衡量我们产品用户定位。
作为 banner 的标题，我们一定要注意字体版权问题，不要被项目时长限制我们的设计能力，能够对字体逐一进行设计是最好的，如果时间紧能力弱，我们可以根据目标用户的使用场景选择字库字体或者利用可商用字体进行修改，切记我们做的是 banner 不是图形化 logo，文案内容直接影响用户操作，千万不要大刀阔斧“哐，哐”的改，一定要保证文案的阅读性和识别性。
*对于字体设计的知识点，我在这篇文章里讲的比较详细，这里我就不过多赘述了。
字体设计保姆级全方位教学！万字干货 前言 在平时的工作中，我们是否有考虑过运营设计的商业目标是什么？
阅读文章 >
2. 深挖 − 精准化痛点文案
在简单了解 banner 的排版规则和我们的视觉动线之后，有没有发现 banner 信息锚点引导认知方向：当我们看到一个 banner 时，往往先被看到的信息会直接影响我们后续接收信息的内容。
试想你是一个日常大量使用咖啡的社畜，但咖啡对你来说仅仅只是用来吊足精神的工具，当你看到以下两条 banner，哪一个会让你有进行下一步操作的欲望呢？
第一条 banner 被我们优先读取到的信息是咖啡的口感，而接收到这条信息后会思考“我好像也并不在乎它的口感”从而将其划走。
第二条 banner 第一眼就接收到”咖啡、0 元”两条重要信息，我们会下意识认为他很划算，并且点击进行下一步操作。
由此可见，文案是 banner 的重点展示部分，就如同前几年父母经常给我们转发的“标题党”文章类似，那些标题深深戳中用户的痛点，也直接收获了非常夸张的点击率和转载率。
当我们看到这些夸张的文章标题时，有没有想过我们为什么会情不自禁的点击进行下一步的行为呢？在我看来，“标题党”实质上是抓住了用户当时实际的心理变化从而引导用户进行操作。接下来我们从行为引导的角度出发列举出 banner 文案撰写中常被利用的几种心理状态：
① 占便宜的心理
从心理学角度来看，占便宜就像男朋友在我意料之外突然送给我一个惊喜一样，让我产生极大的快感和满足感，不可否认人的本性就是爱占便宜的，贪婪的，我们也经常会因为要占一点小的便宜而浪费很多时间，例如拼多多”助力红包活动”以及“砍一刀领取商品活动”
在文案撰写中在“占便宜”的路径中极大地提高用户点击率以及活动转化率。
② 有趣和猎奇心理
我们对未知世界来说就是一个好奇宝宝，我们天生就具有好奇心，这就像伊甸园里的那颗苹果，让我们有产生一种不可抗拒的行为动机。对于未知领域我们从不缺乏猎奇的双眼，这种心理让我们不断发现开阔自己的眼界，去适应不断变化的生活。
在文案撰写中，用户会被有趣的文案所哦吸引，从而参与其中进行探索。
有句话虽然不好听，但是我觉得很有道理“围观使人快乐”，否则怎么会有那么多吃瓜群众呢？
③ 好奇延伸的窥探心理
这样的文案撰写在引起用户联想的同时促使用户点击进行下一步行动。
④ 随机奖励带来的满足心理
在心理学中，在意外情况下获得的随机奖励会大脑会释放出一种叫做多巴胺的神经递质，会使我们得到极大的满足感。
⑥ 极限大奖激发用户行为
这种利用大奖激起用户行为的方式也是现在活动中最常见的一种形式。大奖作为用户行为的诱因，它能召唤起用户行为并且指导行为。即使用户得到大奖概率完全没有（在工作中曾经和运营同学沟通过大奖概率，他们就轻描淡写一句话“这种根本不会中的奖品，设计都不用出奖品图和弹窗”），最终侥幸心理还是没办法抵挡这么强有力的诱惑。
这样的文案的撰写，即使用户本身没有进行下一步操作的想法，中奖品诱惑足够大时也会激发用户的行为。
⑦ 总结
以上只是运营 banner 中最常利用的几种用户心理，更多的用户心理我们日后详细展开，在文案撰写中不论什么样的形式，文案都要与主题相关，我们一定要根据用户对产品的需求场景进行调整内容文案内容来引导用户进行下一步操作。
（三）实现用户转化
我在工作中，运营同学经常将 banner 称为“资源位”，从这个名称就可以看出 banner 在整体页面中的价值所在。它对产品来说起到了非常好的宣传作用，用非常短的时间让用户帮助用户了解主要内容，通过 banner 传达出的真实有效信息为用户提供愉快、优惠、收入、知识等情绪价值，促使用户做出行为。这也大大降低了企业在传播和获客的成本，而且可以快速增强产品竞争力。
三、总结 当下我们方方面面都在体现着良好的用户体验，由此我们在设计 banner 后，我们可以模拟用户去检查我们的 Banner，是否能直观感受到画面内容，内容是否吸引我们，是否第一眼就想了解画面内容参与其中。如果以上问题都是否定的，那可以说是相当失败了！
在整个 Banner 中不光要看表面的图形字体的美丑，更需要建立在用户研究和事实之上贴近用户，帮助用户零成本了解画面内容，了解用户行为，具体需求以及背后动机，从而打入用户内部，激发用户操作，提高内容转化率。
欢迎关注作者微信公众号：「YTY杂粮设计铺」
