首页 > 华企学院 > 电商运营 > 层次在优秀的海报设计在网页中的应用

层次在优秀的海报设计在网页中的应用

作者:华企商城小编  浏览量:86   发布时间:2016-06-04 09:54:17

  层次在优秀的海报设计在网页中的应用

  画面的层次感,说白了其实就是画面的内容有主次之分,有空间感和距离感,有虚实之分,光影层次清晰,这样的画面才起来才真实、丰富,而且通过一些特殊的处理手法,可以进一步拉开画面中不同元素的层次,使得主体更加突出。(因本部分的讲解不涉及到色彩方面的知识,为了更便于大家观察,所以对海报进行了去色处理)

  远近关系

  

23hb20160531

 

  上两图中按箭头所示方向由近及远,画面纵深感强,远近景层次明显,画面感很强。运用到网页设计当中如下:

  

22hb20160531

 

  

6hbbb20160531

 

  

5hbbb20160531

 

  

4hbbb20160531

 

  通过上面的例子可以看出,远近层次清晰的画面,搭配上网页中的内容,可以使页面看起来更加透气,在浏览内容的同时,也能够通过场景传递出很强的代入感。

  虚实关系

  

21hb20160531

 

  上左图中按箭头所示方向依次由实到虚变化,满足正常情况下近实远虚的道理,层次感很强;在上右图中,实景和远处的虚景想必大家都可以理解,但为什么离我们最近的下方的人也是虚的呢?我们看下下面这张图可能更容易理解。

  

20hb20160531

 

  这张海报其实更接近于咱们生活中的实景拍摄,而且是那种有明显对焦主体,毫无疑问是图中拿着竹竿的美女。那这时,虽然前景的花草离我们更近,但是因为它们偏离我们的对焦点(我们的视线并没有直接去看这些花草),所以,这时候前景的花草我们也是去做模糊处理的,甚至有的时候模糊度比远处的场景还要明显。这个是需要了解的。那我们再看下海报中的虚实关系在网页中的应用。

  

19hb20160531

 

  

3hbbb20160531

 

  

2hbbb20160531

 

  通过上面的例子可以看出,把握好画面中的虚实层次,结合网页的内容,可以使页面看起来更加接近真实场景,视觉体验上来说更加逼真。

  氛围关系

  

 

  

1hbbb20160531

 

  图1通过烟雾来拉开女主与远处机器人的层次,烟雾既弱化了远处机器人,同时突出了女主,让两者有一个明显的层级关系;图2中人物本身颜色较暗,背景也是暗色,这时候如果直接把人物置入,人物就会与背景融为一体,这里利用人为添加的光效、碎片等氛围元素,凸显了人物的边缘轮廓,背光的效果使人物从黑暗中分离出来;图3也是同理,只不过它通过光影和烟雾一起来区分众多人物之间的层次关系。

  那么氛围关系运用到网页设计当中如下:

  

17hb20160531

 

  

bbb20160531 (2)

 

  

bbb20160531 (1)

 

  通过上面的例子可以看出,合理利用一些氛围元素的渲染,例如光、烟雾、云等素材,不仅可以起到烘托页面气氛的作用,而且可以突出主体,同时弱化主体外的其他元素,成功地拉开主体与其他非主体元素之间的层次关系。

华企商城更多商品介绍:社区论坛网站源码     搜狗竞价助手    seo分析

文章转载请注明出处:http://www.netshop168.com/article-5562.html


精品推荐
下一篇:活动目标有哪些细分类型?如何制定出具体、可执行目标?
上一篇:为什么百度要来推百度地图付费推广呢?
相关文章

华人企业网
关注微信公众号
享受更多优惠

 

消费者最喜爱的网站TOP100 | | 网络社会征信网 | 北京工商 | 法律顾问 | 京ICP备07504386号-6 | 网站地图