注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

家居装饰

让每一个人都拥有漂亮的舒服的家!

 
 
 

日志

 
 

三步走实战网页广告条制作  

2007-04-14 13:22:31|  分类: 网页 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
广告条(banner)是我们在浏览网页的过程中遇到的最多的网页元素之一了。笔者结合阿里巴巴和taobao的一些广告条,在此总结一些网页广告条制作的实用方法,希望对大家有些帮助。

  首先是把所有元素都堆上去,文字图片,然后参考设计的内容定一个颜色。

  笔者把广告条分为两类:

  • 一类是产品展示型,主要是对客户需要展示的产品做一个排版和设计。
  • 二类可能是一个活动,没有产品展示,需要自己发挥更多。

  我们先来说说第一类:

  客户提供的产品一般分两类:一类是有完整外观的,比如这双nike;他本身就有一个很好的外形轮廓,一般这种都把产品单独扣出来进行制作。

  另外一类就是没有明显外形特点的,比如下面的床上用品。这样的素材其处理方法就会有些特别。让我们来看例子。

  

 第一步:整个环境的设计

  

  从图中可以看到:在边角用到的简单图形文字很快的就表现出了你想表达的东西,让人一目了然。这个点题的图形一般出现在两个角上,相对产品会显得比较大;但这也不绝对,我们需要灵活运用。

  另外,在颜色上拉一个渐变也会产生光线照射的感觉,能有效地丰富层次感。

  如果基本元素的位置都放好了以后,如果觉得背景还是太过简单,我们可以试试加一些样式。下面给出几个例子应该会对各位会有所启发。

  在这个基本的环境搭建好以后,整个广告条的调子也基本确定了。接下来,我们只要把要展现的产品放进去就好了。

  

  第二步:产品的展示

  我们来分析一下前面用到的两张图。月饼那张图中,里面的月饼盒都有漂亮明显的外形轮廓,所以我们选择把他们抠出来处理。可能有些图形轮廓比较难抠,抠出来以后会有毛刺。笔者在这里用到的方法是加个外发光效果。本招操作简单但却超级必杀,问题马上解决。

  床上用品这张,由于没有外形轮廓的特点,我们给他加了一个外框来让几个物品摆放的时候感觉更加整齐。另外如果前面一种抠出的效果排布起来还是感觉凌乱,或者产品本身比较迷你的话,我们也可以考虑加一个统一的背景来增加统一感(如下面两张图):

 

  

 

第三步:字体的选择和样式设计

  这个方面本人一直比较关注。字体选择得正确,往往就能把把握住整个广告条的风格。一个广告条上的文字一般有大有小,要突出的字应当大一点并加个样式;有些需要活泼气氛的不妨把字都独立出来,做个旋转效果,这样下来便会有相当好的效果。

  请注意,字体样式和效果的使用要有节制,同一个广告条内的文字效果一般控制在3种以内,太多了会给人以眼花缭乱的感觉。下面举例一些字体及样式的设计给大家做个参考(主要就是渐变/描边/做产生立体感的白细线)。

  

  最后,希望本文能对各位朋友有所帮助,祝大家都能设计出精美实用、令人赏心悦目的广告条作品。

  评论这张
 
阅读(195)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017