教你简单快速的设计Banner

"不要太复杂，简单就好。要大气，要漂亮！"
这是大多设计师面对需求提出者所共同听道的一个声音，然而说简单，设计并不简单。
面对紧缩的时间与"大气"的要求，想要花太多的时间去雕琢一个好作品，在工作中并不现实，所以在较短的时间内拿出一个合格的设计品，是十分考验UIDer的。
那么，如何能快速高效的设计出一个漂亮的Banner呢？
选材：仔细选择一个与主题相关的形象或背景，不要复杂，简单就好。
背景：稍加处理，在背景上留出足够的文字空间，产品（OR 模特）在1/3到1/4位置，即不会抢到文字视觉焦点，又不会使自己跑出视野。
配色：从背景(or 模特，即Banner中的图案元素)选择2到3种颜色，以保证Banner整体的色彩和谐。
布局：一般来说是不要人物与文字过分缠绕，有文字部分的背景不要太花。另外，不管怎么排，一定记住，要隐隐的有一种对齐（这点下面实例会讲）。
审视：最后审视全局，然后看图思考，并做调整：
该突出的是否突出
该弱化的是否弱化
色彩是否和谐
是否"对齐"
交稿审核

可能空范的理论并不是很好理解，下面以一个简单的实例来说明上面的几个要点的实际运用：
（实例是随便一画，图片与文字我都不知道是神马，So莫追究意义。
这里讲的是设计的思路，或者说方法？总之不是PS工具使用教程，所以不会讲如何操作。）
好，废话结束，开始主题：

采集所需素材（其实，这也是一种能力）

处理背景

将背景适当的延展，以留足文字空间。文字才是主体，人物是辅助。把人物放在边上，但注意，不要太帖近边缘，那会给人感觉空间不足，看着很累。
选择色彩

这里选取了三种色彩，包的米黄色，海天的蓝色，还有人物主色：粉。从图可以看出，这三种色彩与背景很和谐，相互之间也有足够的对比。
字体的选择上，不要选择一些奇奇怪怪的字体，使用方方正正的字体，宋体，线体等简单而又易读的字体即可。尽可能的压制你使用的字体种类，多则乱。
对文字进行排版布局

把需要突出的主题放大并放在第一位。
同一种字体，同一颜色，我们还可以用大小做区分。在保正整体一致的前题下做出不同。
当然，我们还可以用其它选好的颜色做出主次分明，区块划分。主题用包的米黄色，中间选用了海天的蓝色，而最后用了粉色。注意，到了这里，请再看一遍图。发现了吗？"米黄背包"的背景是蓝色，这四个字非常突出。而下面两行，与背景相似的色彩，蓝字对海天，粉字对沙滩，很和谐。
最后一点，也是非常重要的，不管怎么排列文字，一定要隐有一种对齐。请看下图：

文字的垂直方向，是底对齐的。水平方向是左对齐的（人总是喜欢有序的东西...），这样整个文字的排版就不会乱，但又不像板书那般看上去很死板。
文字与人物之间的对齐很特殊:不要让文字压到人物，并且两者之间要有一定的留白空间。如上图所示，切记不要让图挨字，会让人物有"面壁思过"的感觉。
当然，如何对齐视具体情况而定，这只是一种可能。
审视并微调细节
现在主体已经出来了。现是还太"简单"，这不是我们所要的那种"简单"。所以我们需要审视并调整细节，让图更"耐看"。
主题部分够突出，但有些过于独立，加些简单的修饰性内容：

修饰同样简单，但却使文字区域不再是纯文字那么单调，图形的加入，带来了活力。但不要用过于复杂的修饰，那会破坏我们想要的"简单"。
嗯，现在看起来好多了，可是文字区域下面似乎有些空洞，我们再补充一点内容:

同样是简单的文字与简单的白色矩形背景，不会破坏"简单"，但图形的加入，又一次带来了活力。值得注意的是，"特价包邮"与"活动时间"仍然存在"对齐"。
嗯，嗯，现在已经可以收工了吧。再看一眼...
够简单，简单的没有一点起色 -_-!!!。最后再给文字加一点小修饰，这里我给主题"米黄背包"和"特价包邮"的背景加了一点渐变色：

也许还可以给背景加点小花样：

OK，再次审视，可以收工了。
课后作业：这个作品还有不足，你能发现是什么吗？提示一下，是空间方面的。思考一下吧，你的收获会很大。[思考后的参考答案：按CTRL+A，在本页寻找]
定稿并总结>
收工后总结一下，这个Banner，不是很牛掰，但也算的是简单，漂亮，大气。不用复杂高超的PS技术，只要肯用心思考，用勤奋的双手去练习。设计一个简单的Banner，很简单。

到此，设计结束，我的交流教程也结束。希望本文对你有所帮助。我是设计师Lenton，下期见。

================关于优设网================
"优设网uisdc.com"是一个分享网页设计、无线端设计以及PS教程的干货网站。
特色推荐
设计讲座：定期邀请国内互联网公司的设计前辈及行业总监在群内及YY语音（YY频道：15335158）分享实战经验。
设计微博：我们拥有粉丝量26万的人气微博@优秀网页设计 ，欢迎大家关注及时获取设计资源。
设计导航：史上最赞最全面的设计师网址导航：http://hao.uisdc.com
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的"福利"吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您还可以扫描下方二维码快速添加：