浅谈Banner设计-83p.pptVIP

浅淡BANNER设计 赵 镜 写在前面的话 “位置：首页 第一屏通栏? 格式：jpg? 尺寸：950*90 ……” 在工作我们经常会接到这样的banner设计需求，由于它不比大型项目，需求方从设计 成本考虑不会给设计师太多的时间，那么我们怎么才能在短时间内做一个出彩的banner 呢？ 以下内容仅个人在目前工作中针对banner设计收集整理的一些方法，与大家分享。 目 录 主题明确 与整个页面相协调 顺应用户的浏览习惯 点击才是王道 Banner的构成与设计形态分解 a.点的聚合 b.线的流动 c. 面的分隔 Banner设计的形式美法则 a.有机形的柔和与美 b.偶然形的独特魅力 有效的设计创意方法 a.预留大面积的Banner空间创作 b.有效的措辞与行为导向按钮 c. 插图与清新手绘让页面倍感亲切 d.引入肢体语言让画面变的生动 e.丰富的产品展示组合效果 f.特殊肌理的组合 g.让资讯循环动起来 Banner中的字体结构分析 a. Banner的传达方式 b.文字在Banner中的重要性 c. Banner=文字+图像（辅助）d.中文字和英文字的属性区别 e. 中英文字体的结构分析 f. 如何处理Banner中文字的构成问题 g.让资讯循环动起来 案例展示分析 主题明确 在着手设计之前，设计师应该先与需求方沟通，并从中获取需求方想要表达的主题和 需要重点突出的点。然后在针对性地对广告对象进行诉求，形象鲜明的展示所要表达的内 容。不要放一些没用的东西，除非你想赶走你的用户。 主题明确 / 三英战吕布的场景为背景加上随意放置的几本连环画，很好的体现了连环画这一主题 与整个页面相协调 当我们确定表达的主题之后，要在banner实际放置的环境中展开后续的设计工作。色 彩搭配要明亮干净，要与整个页面相协调。不能为了使banner更加吸引用户的眼球而大面 积的使用一些浓重的颜色（特殊需求除外） 顺应用户的浏览习惯 我们知道大多数的用户在浏览网页的时候都是从上到下，从左到右的浏览。为了使 banner更容易被用户浏览,我们应该顺应用户这样的浏览习惯，糟糕的设计会让用户无所 适从，焦点到处都是。 顺应用户的浏览习惯 让浏览者从一个方向上看文字： 顺应用户的浏览习惯 下面的图是在实际环境中的运用案例： 点击才是王道 一般我们做的banner都是为了宣传、推广某个产品或新功能等，它本身就是引导用 户点击参与的入口，我们目的就是要吸引用户点击。所以我们可以用不同形式和手法来表 现，但相同处，通情达意，突出主题，富有乐趣，那它们则能让浏览者产生兴趣。 点击才是王道 Banner的构成与设计形态分解 自然界的万物形态构成都离不开点、线、面。它们是视觉构成的基本元素，具有不同 的情感特征，因此要善于采用不同的组合去体现不同Banner的情感诉求。 Banner的构成与设计形态分解—点的聚合 点的排列所引起的视觉流动，引入了时间的因素,利用点的大小、形状与距离的变化， 可以设计出富于节奏韵律的画面。点的连续排列构成线，点与点之间的距离越近，线的特 性就越显著。点的密集排列构成面，同样，点的距离越近，面的特性就越显著。 Banner的构成与设计形态分解—点的聚合 Banner的构成与设计形态分解—点的聚合 Banner的构成与设计形态分解—线的流动 线分为四类：直线、曲线、折线以及三者的混合。直线又有水平线、垂直线、斜线三 种形式。其中，水平线给人平静、开阔、安逸的感受；垂直线给人崇高、挺拔、严肃的感 受；曲、折、弧线具有强烈的动感，更容易引起视线的前进、后退或摆动。? Banner的构成与设计形态分解—线的流动 Banner的构成与设计形态分解—面的分隔 面在设计中的概念，可以理解为点的放大，点的密集或线的重复。Banner元素在不同 大小色块元素的风格对比下，能获得清晰、条理的秩序，同时在整体上也显得和谐统一。 Banner的构成与设计形态分解—面的分隔 Banner的构成与设计形态分解—面的分隔 Banner设计的形式美法则 在banner设计中采用特殊的形式结构，会使网页变得个性十足并很好的区别于同类产 品，让人记忆深刻。 Banner设计的形式美法则—有机形的柔