三种方法,使用鲜艳的配色来制作WEB/APP界面

无论是Web还是APP,鲜艳的配色已开始逐渐具有人气。为了将人们的注意力集中于要素之上,让设计能给用户带来深刻的印象,就让我们来使用鲜艳的配色吧。


无论是Web还是APP,鲜艳的配色已开始逐渐具有人气。为了将人们的注意力集中于要素之上,让设计能给用户带来深刻的印象,就让我们来使用鲜艳的配色吧。

三种方法,使用鲜艳的配色来制作WEB/APP界面

配色,对设计师来说是非常有帮助的工具之一。他不仅可以用来吸引注意、为作品添加氛围,还可以影响用户的感知与行为。

无论是Web还是APP,鲜艳的配色已开始逐渐具有人气。为了将人们的注意力集中于要素之上,让设计能给用户带来深刻的印象,就让我们来使用鲜艳的配色吧。

这一次为大家介绍的是:使用鲜艳的配色来进行设计的实用技术。

使用单色

在鲜艳配色的使用中,最常见的就是利用单色。单色色板是指:利用同一种颜色不同深浅的饱和度相互组合构成,带来视觉冲击,提升作品的魅力。与具有很强吸引力的印刷风格相组合,单色色板更容易给读者带来具有深刻印象的感官体验。

三种方法,使用鲜艳的配色来制作WEB/APP界面

要点

使用黑白设计的效果与单色相互组合使用,也是一种将用户的注意力集中在小画面上不错的方法。

三种方法,使用鲜艳的配色来制作WEB/APP界面

使用双色

双色调指的是将一副单色原画通过改变屏幕的角度将它变成由两枚负片组成的效果。这是突出中间色和再现重点的方法。在以前是印刷上常用的技术,如今在网络上焕发出了新的活力。双色调看起来很有趣,也非常容易实现。通过使用Adobe Photoshop的双色渐变,就能够达到效果。

三种方法,使用鲜艳的配色来制作WEB/APP界面

虽然双色调效果适用于大尺寸的屏幕,你也可以将他运用在手机屏幕上。

三种方法,使用鲜艳的配色来制作WEB/APP界面

要点  

1、利用双色调效果,制作引人注意的效果吧。选择具有高质量的图像,让主题变得显眼。就算是乱七八糟的照片,我们也可以通过模糊细节来使用它。

三种方法,使用鲜艳的配色来制作WEB/APP界面

(2)选择能反映出照片氛围的配色。要时刻记得,你可以通过不同的色彩来表现出不同的情感氛围。

(3)在制作网页的时候,进行设计时不需要对现有的图像进行加工,也能够实现双色调效果。通过Colorfilter.css,只用CSS代码也能够使用这效果。

重叠效果

使用配色来传递信息的另一种方式,就是在设计上利用重叠效果。让我们在图像或动画上重叠半透明的效果吧。与材料设计的鲜艳配色相组合,表现出更加现代的氛围。

三种方法,使用鲜艳的配色来制作WEB/APP界面

尝试着在卡片式布局和视频内容上使用重叠效果,不断的去调整让内容更加有吸引力吧。

三种方法,使用鲜艳的配色来制作WEB/APP界面

要点  

在单色上使用叠加效果时,色彩与滤色透明度的调整是非常重要的。

  1. 使用灰暗的、透明度低的颜色作为滤色器,将用户的注意力集中到颜色而不是背景图像上。
  2. 与之相反利用明亮的、透明度高的颜色作为滤色器,可以将用户的注意力集中在图像上。

最后

事实上使用颜色来发现乐趣的技术的确是一件困难的事,但利用配色的效果却能为你的设计增添不少风采。不断的去尝试各种配色,发现最合适的那一种方法吧。不管是喜欢使用明亮鲜艳的颜色也好,还是喜欢简单的黑白单色也好,请记住,颜色是不会有错的。最重要的事,就是如何去使用那些颜色。

 

原文地址:http://photoshopvip.net/97186

译者: 丧心病狂的翻译站

译文地址:微信公众号【丧心病狂的翻译站】

本文由 @丧心病狂的翻译站 授权发布于人人都是产品经理,未经作者许可,禁止转载。

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

(0)
CatherineCatherine
上一篇 2017-05-09
下一篇 2017-05-09

相关推荐

  • 交互设计可以区分出一个好的产品和一个差的产品——「得米Micah」

    这是 Bestony 推荐给你的第141个公众号基础信息公众号名称: 得米Micah公众号类型:文章型订阅号公众号ID:MicahDesign更新频次:不定期更新简介今天为大家分享的公众号来自一个交互设计师 Micah 。搞互联网的或多或少都听过这个岗位,我在网易待过,也曾经为外包公司干活,也为初创企业作过技术服务,很多时候,不同产品的区别最大的点可能便是在于交互设计。小公司或外包公司会有设计师,但是是我们所说的「视觉设计师」,而大公司...

    2018-03-15
  • 成都UI-UE交互设计免费试听课了解一下!

    周一见!周一见!周一见!没错下周一!成都UI-UE交互设计免费试听课开课啦!与其宅在家里浪费时间不如来体验一下UI设计前五天免费试学4月16日--4月20号机会有限,先到先到得哦!UI-UE交互设计是什么?UI-UE交互设计就是指对产品的人机交互、操作逻辑、界面美观的整体设计!为什么要学习UI-UE?人才需求旺盛,成IT行业职位新宠人才缺口大,行业势头发展迅猛虽然UI这么好,但是不仅对人才的需求大,要求也越来越高,所以,培训,是提高水平...

    2018-04-17
  • 从情景出发的可用性设计

    设计文章 / 交互设计 | 来源:TID | 作者:stephyl 前言         为了优化产品,提升用户体验,产品团队经常做很多事情:数据监测、数据分析、竞品分析…然后给交互设计师提需求,让交互设计师把需求转化为可用的功能…

    2014-12-01
  • 在无线产品中,一些普适的交互设计原则及实践(上)

    本文作者将逐条列出其总结的无线产品设计领域应当遵循的的一些基本原则,并在每条原则下辅以实例说明以便理解。

    2017-05-04
  • Justinmind 和 Axure谁更适合做原型?

    Justinmind 和 Axure 都是目前很强大的原型设计工具,被业界推为原型设计神器,在很多项目中起着不可估量的作用,但这两者的之间的作用是相互竞争还是相辅相成呢,我们应该客观地进行分析,使之更好地服务于我们的…

    Axure 2015-08-25
  • 【笔记】从活泼的C端产品到严肃的B端产品设计,我是如何自如切换的——交互篇

    2016年11月5日,UXRen社区联合网易杭州主办“用户体验者的自我提升”主题讲座,本文网易资深交互设计师大饼的现场分享:《 从人性到人文的设计思维转变》整理而成。   嘉宾介绍: 杨杰(大饼,资深交互设计师,UEDC交…

    交互专题 2017-08-07
  • Facebook 改变「点赞」背后的故事

    Facebook 在上段时间做出了一个改变,堪称是最近科技界的最重磅的新闻之一,那就是他们改变了自己实施已达 7 年的「赞」的功能,增加了 5 种新的回复选择。从某种程度上说,这是 Facebook 近几年在自身产品设计上迈…

    IxD案例 2016-03-03
  • 让自行车站在墙上,生活中的交互设计|这个设计了不起

    Light Dusk by Z-Inhouse 宛如陶罐的铝制灯罩搭配质朴的软木,造作旗下的设计师利用两种材质的特性,打造了这个造型简洁的向晚小吊灯。喇叭形的灯罩由 1.5 毫米厚的轻薄铝板制成,表面还经过了哑光喷涂处理。嵌入顶…

    2016-12-09
  • 交互设计师的60日计划第十九天

    昨天M+头痛,8点下班回来做分享PPT做到11点半倒头就睡了,忘记了写每日…拖延症真是害人,周日拖了一天只写了大纲,周一做了白PPT,今天又加班到10点把完整的PPT做了,明天晚上演练一下。因为一天的拖延,整个一周都…

    交互专题 2015-08-20
  • 三招两式讲需求,看完你们也懂需求了

    美国一家市场研究公司通过分析101家科技创业公司的失败案例,总结出了创业公司失败的20大主要原因,排名首位的就是:No Market Need!据统计42%的失败创业公司出现过这个问题,创始人执着于执行自己的创意,却没有…

    2023-03-03