当前位置: 首页 > 新闻动态 > 行业动态

网站设计配色不再愁,重庆网站设计分享配色妙招,拜托配色苦恼

2017/10/27

      对于网站设计而言,配色、布局以及画面的冲击力。配色对于设计师来说,是吸引用户眼球的必要方式之一。不论是用来集中用户的注意力还是表达感情或者是传递信息都是非常有力的工具。为了让大家知道配色对于传递信息有多重要,一个好的网站配色对于用户而言可以增加不少的分数。



      想让配色的使用更加有效果,这在设计中是非常重要的,也就是构想出一个全新的配色方案。每一种颜色都有着他独特的意思,将他们组合起来也就能传递出无限的可能。


      分享这边文章是为了让网页设计师让网页设计的配色与你的设计更加搭配的方法。选择配色方案的调色板,这时我们不能盲目跟从行业选择,否则将被埋在互联网的行业里。


      所以作为网页设计师,我们应该有一个方向定位,可以使用一些计划性的方法。


01. 表现出来行业特征,主题明确!

       在此之前,让我们明确目的和设计理念。一个有着含义的调色板是良好的设计要素之一。做网站设计前可以问自己以下几个问题:

      设计的目的是什么?想传递什么情报?想引导用户什么?

      你想通过设计传递什么样的信息?

      与行业其他公司的区别?


02. 明确你的目标用户

      每个用户对色彩的理解是不同的,对颜色的喜好也是不同的。颜色所面对的每一个人都是不同的。同一个颜色,因为每个人的个性、文化背景,经验的不同会产生不同的效果。考虑到这一点,我们就需要明白,当用户面对这样的设计时,会表现出怎样的反应。


      一些颜色的含义,在世界的任何地方都是通用的,但有些则不是。绿色,一般是植物的颜色,看到他们就会联想到自然。但是红色就不一样了,他会因为文化的不同而不同。在西洋文化中红色代表的是:火(英:Fire)、暴力(英:Violence)、纷争(英: Warfare),有时也会表示爱(英: Love)或者热情(英:Passion)。但是在中国则表示的是繁荣(英: Prosperity)和幸福(英: Happiness)。


由于颜色有着不同的含义,在创建一个调色板时了解你所面对的用户的感情是非常重要的。

      如果你想了解更多关于颜色和国家的意义,你可以去看相关国家色彩含义相关文章,以便针对不同国籍的客户设计时不会犯原则性错误。



03. 了解配色方案的基本要素

      选择配色时,你需要了解一些关于配色的基本知识。配色的基本,就是配色组合的基本理论和构造,具有实践性的指南。他从如何使用色轮以及每一个的意义都总结的十分全面。

你所应该知道的,关于配色的基本知识。这篇文章,他对于颜色有着一个详细的划分,你们可以从这篇文章中获得参考。


04. 试着去寻找灵感

      有的时候视觉化的必要的配色方案很难设计出来。那种时候,可以从别的设计师的作品中获得灵感。收集多个行业好的配色网站设计,不局限于需要设计的行业网站,这样思维会更加开阔。

列举两个对于配色来说相当方便的网站,Dribbble 和 Behance。有时你想给你的材料设计找一些特殊的灵感时,推荐 Material UI 这个网站。平板式的配色调色板,你可以利用FlatUIColor 这个完整。


      当你想创建一些不同的配色方案,不妨试着转变一下思路,利用其他文化的设计。比如街舞培训机构,实用的多彩的调色板让人印象深刻。每一个场景,都可以给你的灵感提供参考。


我们也可以从日常生活中获得灵感的启发。当你走出去,看看室外的装饰陈列,室外风景,甚至逛逛超市,看看国外的一些进口食品包装等,都可以是获取灵感的方式。


      当你看到了令人激动的配色时,就可以把他们做成配色版了。你可以利用Photoshop,或者一些在线工具,来调整我们所找到的配色方案。


05. 制作属于你的风格指南

      设计系统你所需要知道的风格指南是,将所有的设计要素放在统一的设计框架之中。在这之中包含了包括按钮或字体等全部的设计要素。我们在设计时应该思考什么样的按钮或导航菜单才是应该被选用的。


       在实践中如何使用风格指南,在这里有一些网页的案例可以参考。看到好的网页设计就收集起来,需要设计时就有更多素材库便于配色灵感或者创意灵感获取的源泉。


      它可以是一个简单的草图,所以在使用配色版之前,可以方便的帮助你做出你自己的风格指南。一目了然的知道利用什么样的设计要素,那么也就会明白该使用怎样的配色来进行制作了。

选择设计制作时用的调色板时,要有「KISS(略: Keep it Simple, stupid)(越简单越好)」这样的思路。首先,尽可能的减少颜色,我们需要考虑下面几点。


   背景色(英: Background)

   主色(英: Primary Color)

   次要色(英: Secondary Color)

   警告色(英: Error Color)

   成功色(英: Success Color)


配色能力迅速提高的方法第一就是借鉴,借鉴优秀的网页配色,切记思路要开阔,别只盯着一个行业不放,学会发散思维,让您的网站设计脱颖而出。


专注高端品牌网站设计,设计更出彩,更多网站设计知识请关注我们的微信公众号:像之素科技