交互设计要点&配色趋势

色彩在任何一种设计中都起着很重要的作用,相差不多的色彩却能渲染出截然不同的情感效果。因此,好好利用色彩与生俱来的魅力,就能让你的网页设计更特别。

1Metro和柔和鲜嫩的色彩

Odam Luiran的网站是Metro风格,这种风格尤其适合一些比较鲜嫩柔和的颜色,扁平化网页设计在2014年中的流行让柔和色彩的用途变得越来越广泛。这样的色彩基调将在2015年得到进一步的延续,马卡龙色系也许会常常出现在网页设计中。

332181407

2偏灰的冷色系粉彩

偏灰的冷色系色彩是一种看起来比较百搭的颜色,但是实际上,要将这类颜色使用的恰如其分却并不是一件容易的事情。这类色彩表现的比较中性,所以搭配任何颜色都不会显得突兀,但也不算出挑,而要让色彩之间真正融合,应该选择清淡的粉彩系透明色,让网页看起来清新脱俗。

309612351

3根据图片搭配背景色

网页设计需要看整体,而不能针对性的看局部。网页中显示的图片往往是表达网站思想和意图的一部分,属于网站元素中比较重要的环节,所以让背景色来适应图片的颜色是情理之中。如下案例所示,蓝色系的图片搭配蓝灰色的背景,整体表现的十分融洽。

309615239

4只有一个重点色

一谈到色彩搭配,常常有人会说一个比较保守的搭配方法:一个区域范围里不能超过三种颜色。这句话并不算完全正确,更深层的含义是,只能有一个重点色。

621713753

5以简单灰作为网页基调

用灰色作为网站的主基调是一种比较保守的做法。灰色属于所有色彩中最简单的颜色之一,所以设计师有充分的理由去选择使用灰色,以此来衬托出网页中内容的可读性,减少用户的阅读干扰。

499799853

6低透明度色彩

透明度低的色彩也很有可能成为2015年网页设计的主要色彩趋势。如今的设计越来越追求用户的交互体验,因此低透明度的色块能让用户更加容易发现并且阅读。

621754175

7用高亮色体现用户交互

一大片高亮色设计一定会造成用户的视觉疲劳,令人很反感,但小部分的高亮色设计却能起到突出重点的作用,既能将内容有效的区分开来,又能保证与整体色调保持一致。

621757376

8不轻易减少亮度中的黑色

下面这个案例中很简单的使用了黑色和橙色。橙色作为很亮眼的一种颜色有时会给人带来一种比较刺眼的感觉,但案例中的橙色却令我们的视觉感觉很舒适。原因在于设计师在原本亮丽的颜色中加入了一些黑色,既能让颜色之间形成对比,又不会显得很招摇。

12026335

9蓝色是网站的“基本款”

蓝色在网页设计中属于不会出错的颜色,当你举棋不定或是在色彩上产生困惑的时候,你可以用蓝色尝试一下,也许能顺利化解你的问题。

347049079

10单色网页

单色网页设计看起来似乎不会存在色彩搭配方面的问题,但这里说的单色网页更应该理解为单色系网页。所以,要打造一个色彩统一的网页,设计师可以以一个基本色调来扩张色相、饱和度和亮度等条件。

499856113

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/11411/

(0)
iouedioued
上一篇 2015-12-08
下一篇 2015-12-09

相关推荐

  • 从地方性视角谈民宿的定位(二): 找到有趣而唯一的内核

    ▲点击关注我们,挖掘土壤的内涵近些年来,随着旅游的快速发展尤其是大众旅游市场的迅速兴起,旅游与地方的关系引发越来越多的关注和讨论。“地方性”一方面作为旅游目的地吸引力的内核被重视,另一方面又因其趋于淡化而引起对地方可持续发展的担忧和对旅游发展的批判。▋什么是“地方性”?事实上,地方性不是绝对的现实,而是话语与知识生产的过程。全球化进程必将是均质化与地方性凸显相互伴生的过程。虽然在全球化背景下,旅游产业的发展由于多种要素的作用,会带来社会...

    2018-03-10
  • 直觉设计:如何让网页更直观、易用【UXRen译#162】

    作者:Peep Laja(ConversionXL的创始人,世界上领先的转换优化专家之一) 翻译:方糖小姐,校审:小四   你的网站越容易使用,那么使用的人越来越多。“容易使用”的至关重要的一部分是直觉。那么直觉设计也就意味着当…

    交互专题 2017-08-07
  • 取消了Home键的 iPhone X,交互方式都有哪些变化?

    iPhone X 作为一台全面屏的设备,和上一代的 iPhone 7 还是有着很大的区别,这些区别不仅体现在材质和工业设计上,在界面交互上也有一些差异。iPhone X 的显示屏所能显示的内容和 4.7 英寸的 iPhone 7 一样「宽」(同为 375pt),但在高度方面就比原先多出了 145 pt ,再加上 iPhone X 去掉了最为标志性的 Home 键,这两点直接导致的就是界面的布局和交互会发生相应的变化。

    2017-09-18
  • 微信公众号里八大不能忍受的用户体验

    首先要说这里写的“微信公众号”不是指微信的公众号服务,而是指企业申请公众号以后企业在公众号里提供服务。

    2017-06-02
  • 产品经理黑魔法 | 自启动与后台

    最近写黑魔法上瘾了,每天稍微有点空闲,Glen都在思考互联网行业都有哪些黑魔法。有机会大家还可以探讨一下魔咒课、魔药课、占卜课等哈利波特魔法课程。

    2017-06-03
  • 广告与用户体验只能二选一?

    最近公司的移动端产品在优化广告投放,其中也遇到了不少的困惑,我翻看了部分APP的广告展现形式并结合了几位设计师&产品经理的想法之后,整理总结出了这篇文章。本文将结合实际案例就常见的广告形式以及它们如何合适地呈现与大家进行分享。遇到的困惑我们知道无论是自身的品牌活动宣传还是第三方的商业广告都能为公司和产品带来不小的收益,但与此同时不恰当的广告也会对用户体验造成很大的影响,特别是移动端,因为屏幕有限更是“寸土寸金”,一不小心就会引起用户反感...

    2018-04-04
  • 【文创•职通车】2018校园招聘信息

    序号001未而思伯文化传媒(杭州)有限公司2007 年成立至今,经历了十年的发展,从最初的单一媒介投放板块到如今的以视频内容创作,品牌营销传播为两大核心板块。十年媒体资源、渠道积累,坚持立足浙江为中心,面向江浙沪,以传统媒体+新媒体的渠道传播组合方式。(向上滑动启阅)一、 总监助理( 1 名)职位描述:1、本科以上学历,具有良好的协调沟通能力,良好的文字功底;2、完成总监交代的任务,负责项目的对接协调统筹工作;3、负责总监的工作日程安排...

    2018-03-20
  • 一篇读懂交互设计进化!

    计算机刚被发明的时候并不是现时看到这个样子的,而是这个样子的。像房子一样大的计算机当时的计算机一切数据和操作指令都是通过由纸带输入机进行的,是当时唯一的输入设备。穿孔纸带上利用一排孔表示一个字符,用穿孔或不穿孔表示1和0,来将指令和数据导入内存。穿孔纸虽然大家都没见过这玩意,但可想而知纸带的输入速度很慢。。。很慢。。。即使是一个简单的程序,所需要的纸也是一箱一箱的。后来,因为打字机的灵感,键盘终于被发明了,可想而知这输入速度有多大的提升...

    2018-03-04
  • 交互设计师的60日计划第十二天

    周五在会议室被吹感冒了,周六又因为之前约了牙医所以跑出去一整天,晚上回来就发烧了,昏昏沉沉睡整夜整日。然后发现我果然劳碌命,生病都挑周末,工作日一到立马恢复了…不过这几天就都没写总结,想想心里还有点慌…

    交互专题 2015-08-20
  • 细数那些精彩纷呈的引导页

    随着苹果ios8的发布,可以看到货架上,众多主流App迫不及待地向人们展示产品视频预览,接下去会是被设计师、市场宣传相继关注的焦点,产品宣传的下一轮引爆点。 作为能在App store上先发触达地形成前期推广的视频预…

    2014-12-18