颜色心理学被广泛地运用到各个规划范畴,这早已不是啥隐秘。从日常的杂货到LOGO规划,颜色所起到的作用越来越大,它是给用户传递信息的最主要的要素之一。

根据Kissmetrics 的说法,当咱们看到一个颜色的时分,信息会传递到大脑的下丘脑的某个区域中。接下来,信号会进一步传递到脑垂体,然后到甲状腺腺体。这也就意味着,颜色会影响大脑和腺体排泄激素,引发出咱们的心境反应,并影响咱们的行动。

科学研讨标明,颜色会影响心境,会引起正面的心境,也能带来负面的影响,有的时分带来的心境与实践要的并不匹配。Kissmetrics 接着弥补道,网站的访客一般只需求大约90秒就能关于一个网站作出判断和挑选,而在者其间,有62%~90%的要素是取决于某个商品的颜色。

在UXPin的免费电子书Web Design for the Human Eye 中咱们曾说过,某个事物在给人第一印象的时分,颜色扮演着无可争议的主要人物。

颜色意味着啥

每种颜色关于每自己而言都有着特定的含义,可是它的具体含义一般取决于他们所在的文化布景、自己经历和喜爱。

事实上,颜色心理学在规划范畴并不是一个准确的学科,个体差异十分显着。社会要素,自己认知,乃至性别也会对颜色感知发生影响。进一步的研讨发现,发生影响的并不老是颜色自身,运用这些颜色的品牌与用户之间的联系也会影响用户关于颜色的感知。

所以,假如你的规划是关于女人的,那么紫色会是一个适当不错的挑选,因为紫色在女人受众中遍及受欢迎,可是关于大都男性而言,紫色并不太受欢迎。紫色被运用在巴黎欧莱雅的页面中,作用十分不错。主体运用的是非配色,黑色的页头页脚看起来十分高雅,紫色装点其间,全体感十分不错。实践上他们的商品并不便宜,可是给人感触比照高端。

别的,运用白色的文本,让人感触安静又满足现代,紫色则被赋予了奢华、高雅、女人化的含义。所有的这些都能够在这个网站里查到。

下图是女人健康杂志的页面,上面的Banner运用了粉赤色,导航规划更为斗胆,除此以外网站别的的当地用色倒并不丰厚。不得不说这样的挑选十分风趣。

首要,关于女人类的网站而言,粉赤色自身仍是比照老套的,可是作为一个女人健康类的网站,这样的配色和主体并不算是格外搭。

当咱们持续探究网站别的的有些,比如当你翻开瘦身页面的时分,导航栏上相应的方位会成为粉色以示标识。

颜色会影响用户的心境和感触,虽然这个页面的第一张图像是随机翻滚播映的,可是想想看,全部瘦身有关的页面几乎被粉色淹没了,拔苗助长。

 

.
站长之家


站长论坛

 

 

 

 

 

站长东西

 

 

 

 

 

 

 

 

站长资料

 

 

 

 

 

 

 

 

源码下载


手机版

 
重视咱们

 

立即登录 注册新帐号
.

.

 

 

>
 

 
.
站长之家

     
  . 
. 主页

业界

搭站

创业

电商

运营

好站

移动

游戏

规划

专题
.
.
您的方位:站长之家主页 > 规划 > 教程 > 正文

 

 


   

.
.
  

 

.
 

 

页面配色!如何巧用颜色打造扣人心弦的页面规划(2)

2015-06-16 10:35 来源:优设网 修改:FACENOW【纠错】0人谈论

A-A+

 

如何开淘宝店 网站优化办法 创业如何取得出资 小米note顶配版评测 手游攻略


配色计划

一般当你预备规划一个网站的时分,不会只运用一种颜色吧?你需求思考全部网站的全体配色计划,单个颜色的选择,以及不一样颜色之间的调配。接下来,你还需求思考不一样颜色关于用户的影响,调配色与主色调之间的调和,等等等等。

这样一来,就需求规划师关于颜色的混合调配运用有更深化的考量了。下面三个根本的配色窍门,能够帮你搞定这一疑问。

#1: 三色调配

页面配色窍门 页面配色 页面规划 页面规划教程

这是最根本的办法,也是最平衡的配色思路,运用互补的艳丽颜色。在色轮上选择彼此间隔120度角的三种颜色,别离来作为布景、内容和导航的颜色。

#2: 组合配色(拆分互补)

页面配色窍门 页面配色 页面规划 页面规划教程

这种配色计划相对而言比照有难度,你需求通过一定的测验和探究才干获取。假如调配好了,作用十分冷艳。如图所示,这种配色计划是选择色轮上相邻的两比照照色。

#3: 近似配色

页面配色窍门 页面配色 页面规划 页面规划教程

这种配色的中心是选择连续的相邻互补色,假如你想借此来取悦用户的话,在选择的时分一定要慎重当心。这种配色方法能够杰出颜色的生机,可是因为相得益彰,颜色和作用比照不会那么激烈,可是会愈加夸大。

所以,当你开端思考颜色的心理学特点的时分,尽量将全部配色计划作为全体来进行衡量,而不是独自为某个有些选择一个颜色,以期它能与别的有些调和作业。

看看下面的页面,想想看,它会向用户传达如何的信息呢?

页面配色窍门 页面配色 页面规划 页面规划教程

1、布景色——深色的布景让全部页面看起来经典、精雕细镂、沉稳、正式且满足“企业化”。当你规划一个网站的是,“精雕细镂”的感触总能给人杰出的观感。正式和企业化的特点,则一般能让访客不会以玩乐的心态来看待这个网站,且能够带来一定的信任感。

2、按钮色—— 规划师在这个CTA按钮(行动呼唤按钮)上运用了强比照的赤色,醒目且十分招引用户去点击。相对而言,白色边际的鬼魂按钮在优先级上显着低于赤色的CTA按钮。按钮用色按钮用色在全体配色中契合逻辑,方位明晰。

3、文本色——白色的文本与黑色的底色构成显着的比照,从全体配色计划上来看也十分搭调。别的和文字调配的线条图标也采用了相同的白色,在颜色上采用了高度共同的计划,露头的文本暗示用户需求向下翻滚。

整体上来说,整套规划计划还不错,中规中矩的是非配,加上赤色以后,就显得生动起来了。因为赤色的运用适当之可知,稍加装点,不会显得过为己甚,这一切让全部配色锋芒毕露。让全部配色锋芒毕露。

需求躲避的用色

棕色一般能给人以自然的感触,可是这种颜色一般都不为男性所喜。可是在有的场合,棕色能让人发生牢靠和安全的感触,这个时分运用仍是挺不错的。

页面配色窍门 页面配色 页面规划 页面规划教程

作为一家闻名的物流公司,UPS运用棕色能给用户一种激烈的可被依靠的感触。

可是作为怀俄明州大学橄榄球队的队服的用色,这套配色计划被评为史上最差的规划计划。最风趣的当地在于,这套棕色的队服大家共同以为它十分的耐用,可是与此一起也 十分的丑陋。男性关于颜色的认知在这一规划上表现得淋漓尽致。

在女人用户这边,橙色也是相对不那么受欢迎的颜色,所以,假如你的客户是女人的话,尽量防止这一点。

当然,这些规矩大都是一些指引性的条目,它们一般都有上下文和运用场景,颜色只有调和调配起来才会看起来美丽而合用。

        配色和取色东西

用现成的配色计划和调色板本来天经地义的工作,你并不需求为页面规划或许UI规划计划独自发明色轮。

Adobe Color CC – Adobe出品的配色东西,之前被称为Kuler。

Paletton – 这是一套为初学者预备的取色东西。

Flat UI Color Picker – 这是一套扁平化配色东西

Mudcube Color Sphere – 内置了一系列颜色主题,相应的配色都包含了相应的HEX代码。

Check My Colours – 这个东西是用来坚持远景和布景的颜色组合的,它能供给准确的比照度检查,保证色盲用户也能正常分辩颜色。

Color – 这个东西答应你用鼠标在屏幕上取色,设置饱和度,而且供给相应的HEX代码。

事例剖析

网络上有成千上彀的网站,其间有很多不错的站点,可是绝大有些和优异无关。不过下方的网站,正式优异的那波中的一员,它曾荣获Awwwards 的每日最好网站的头衔。

页面配色窍门 页面配色 页面规划 页面规划教程

网站的布景色运用的是浅灰,同其间电动车的配色同系。全部页面规划简略,超大的字体和细巧的车体构成比照,传达出电动车细巧灵敏的特性。作为中性色的灰色,让页面中别的的颜色愈加艳丽也愈加显眼,比照显着,也赋予了页面以生机。一起,灰色的主色调,也强调了商品和品牌沉稳大气的一面。

无穷的Go,配色开畅生动,突变和鲜亮充沛展示了规划的现代性。很主要的一点是,蓝色是男性和女人都十分喜爱的颜色,这一点使得网站是不关于性别进行差异的。灰色还带有抑制和环保的特性,联系电动车细巧的规划,全部规划还在暗示商品的环保和安全的特性。

整体而言,这个页面的日子感和现代感和今世都市人的状况契合度十分高。

最终的注意事项

颜色是商品规划的主要有些,一起也是品牌规划中至关主要的一环。所以,在规划网站或许UI的时分,颜色传达的含义有必要同品牌契合,将品牌故事和含义 融入到规划到中来。一般情况下,规划师会直接从品牌的LOGO或许品牌规划指南来取色,虽然这样会有限制,可是这的确能够让工作变得更简略。