一年前，我们上传过一节公开课：banner设计35式，得到大家的广泛认可，今年我们在此路线上做了精细化加工和设计拓展，希望大家学有所成，再接再厉～

为了大家更好地观看，我们把本次视频教程梳理成：思维梳理篇＋精细度执行篇，

同时也补充了文字版教程；

在工作，面对banner运营需求，有的同学都会有自己的一套解决思路能快速完成需求，但大部分同学会陷入改改改的循环中，甚至对运营设计产生厌恶。

 “方向永远比努力更重要”，在本文章中，并非单纯的传授大家banner版式处理技巧，更希望大家掌握的是处理思路。如在处理banner设计时，可进行元素拆分：文案、背景、点缀、配图；

从而个个突破，明确设计方向，以下是视频版的部分节选：

知识点串联

为何要梳理出这四个细节点？

直接展示出banner设计的细节，对于同学们来说可能还是过于抽象。

我们不妨通过一个导航栏设计的案例，来类比理解一下，为什么要梳理设计细节点，又应该如何在实战中进行应用：

 观察上述三个不同产品的导航栏，尽管内容不一。

但进行拆分归类后可以清晰的看到，它们都是由“时间栏+搜索框+功能图标+文字描述+底板”组成的，各个板块的构成都有其各自的样式规范。

在设计导航栏的时候，只需要在遵循规范的基础上，根据实际需求稍加灵活调整即可。

如果将导航栏的设计类比于banner设计，那么它的构成规范就相当于banner设计中的版式细节点。所以在banner设计中，明确具体的版式规范，有利于快速高质量的设计产出。

例如，下图为banner设计中常见的四种排版方式，梳理出这些内容，可以让我们在设计前更加的有方向性。

banner处理思路

知道了banner设计的元素拆分思路，下面一起来看看如何具体执行：

版式试错

如果把设计banner比喻成建造一幢楼房，那么banner的排版样式就是楼房的地基和钢筋。

分析产品的文案和元素，尝试并确定最合适的版式布局方式，是决定优秀banner输出的重要一步。

细节调整

确定好banner的基础结构之后，我们可以开始对一些细节进行调整了。

就以图文排版举例，下图为部分可以参考的细节点调整点：

产品沟通

无论是UI还是运营设计，沟通都是非常重要的一环，而且是贯穿设计始终的。

回到上图的例子，分析出诸多的版式设计细节点，如何取舍？

要根据banner服务的产品诉求、竞品分析等权衡决定，而这些都需要设计师与产品或运营同学的充分沟通交流：

沉淀经验

恭喜你完成了一次优质的设计输出，接下来的工作也至关重要。

对设计过程的沉淀和总结，有利于下一次的进步和创新；

例如，探索设计复用：思考如何复用版式或者配图的设计风格或格式，面对紧急需求时提升设计效率。

总结

banner设计的细节点还有许多，下图即为例子中banner的设计拆分点展示：

视觉设计技法万万千千，但万变不离其宗，只要遵循科学合理的设计步骤，用好各种视觉设计技巧，相信你最终都会有优秀的banner设计产出。

更详细的讲解请同学们观看视频课程。

——————————————————

下节预告

不为人知的图标设计系统

或者大家有什么比较欠缺的，可以在评论区留言，我会给大家答疑解惑、或者出成教程

微信公众号：EDC设计研究中心；私人交流微信：zssilence