最新案例推荐
点击查看
扫一扫查看
最新行业案例

3招让你的设计更有层次

发表于:2017-07-07

  很多时候,设计师都会碰到这样的问题,当客户或者领导看完设计稿之后会说“有点单调,总觉得少了点什么,你再稍微修改一下。”

  与其反复修改,还不如认真考虑设计稿真正所存在的问题。其实所谓的“有点单调”就是设计稿缺乏层次感的表现。何谓层次感?从设计的角度就是把设计页面的各个元素合理的、清晰的、有节奏的结合在一起,使整个画面看起来更加的舒适、愉悦和协调。从领导和客户的角度就是让他们看起来不单调,刚刚好。

  设计稿的层次感主要涉及到画面、色彩和文字三个方面。

  1、画面的层次

  (1)使用点、线、面来分割画面

  点:是最有装饰性的元素,因此大多情况下在画面中起到装饰作用

  线:除了装饰作用外还起到对画面的分割、元素的穿插和对视觉引导的作用

  面:往往起到稳定画面和承载重要信息的作用

  点、线、面是设计中最基本的设计元素,所谓的“点”并不只是圆形,任何在画面中尺寸和面积相对最小的元素都可以看做成“点”。“线”的一个重要的用途——分割,一般“线”分割让可以让画面更加有趣味性也更加有层次感。线分割出来的区域就是元素“面”,点线面是组合使用的,有效的利用点线面的组合可设计出层次丰富的作品。

  (2)留白

  留白是我们设计中很常用的手法,现在主流网站用的非常广泛的极简设计就是在留白的处理上用的比较好的一种设计类型,留白除了让画面整洁、干净和透气外,更是对“面”的更深刻的理解和使用。

  一般性的页面层次分成背景层,留白层,主体模特层,标题文案层和功能文案层,在留白的同时对画面的层次进行了处理,这样整体的设计稿的层次感就会凸显出来。

  (3)在摄影中找层次

  现在很多的设计稿里都会加一些高清大图作为背景或者素材,摄影图片的使用也是越来越多了,尤其是质量高的摄影作品不仅看起来画面非常细腻丰富,而且也品质感十足。在此基础上,我们可以使用文字来做为图案元素来增加画面层次感。

  2、色彩的层次

  (1)颜色的对比

  使用对比色和反差大的颜色来设计也是增加层次感的一个常用方法,因为有非常强烈的颜色对比,画面的冲击力会非常强烈,给人们的视觉观感也会更加刺激。

  (2)渐变色的流行

  随着渐变色的流行,使用范围也越来越广,甚至一些手机端的APP也会用渐变色来设计。其实渐变色本身就具有层次丰富的特点,因此,使用渐变色加上合理的点线面元素的搭配会在具有冲击力的同时最大限度的丰富画面的层次。

  在日常的设计中渐变色的使用还是需要更加精心的选择颜色的色值,一般来说会选择同色渐变、邻近色渐变和对比色渐变。而渐变的颜色数量也不宜超过2种。

  3、文字的层次

  (1)字体的对比

  字体是设计中必须使用并且比较难的一个环节,但是却能使画面的层次变得异常丰富,即使在只有文字没有图案的时候,只要排版合理也可以得到惊人的效果。

  不同的字体表达不同的意境和涵义,尤其是中文字体传承几千年每一个字都有特定的涵义,而英文主要是以衬线体和非衬线体的字形装饰的变化。

  (2)文字的对比

  文字的对比主要体现在字体、大小、粗细、颜色等等,这种对比是最能拉开并体现层次的方法。通过不同字体的大小来把层次拉开,另外加一些元素将设计页面分成不同的层次,画面会更加统一。同时,文字颜色的不同,一方面可以增加文案的层次感,另一方面可以与视觉主体的颜色统一。

  总结

  在网站建设的过程中,层次感的设计还是要更多的回归到设计稿的本身,需要从设计稿页面的整体出发,细节上精益求精,层次感自然也会凸显出了。为了能让设计稿在客户和领导那里一次性通过,相信可以从以上三点中找到很好的参考点。




(非特殊说明,本文版权归原作者所有,转载请注明出处 )
标签: 上海网站建设、上海网站制作、高端网站设计、迈若网络


迈若微信公众号_上海网站建设公司

手机随时获取迈若动态,扫描左侧二维码
添加迈若微信公众号【manro_since2005】