童话说说技术创业美文职业
投稿投诉
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

这4个配色技巧,解决你80色彩问题

3月3日 飞虹谷投稿
  今天和大家分享下界面中如何使用颜色,颜色在设计中对于我们的情绪和行为有着很大的影响,很多产品都在抢占我们内心的颜色心智,因此选择适当的颜色的一个产品成功很关键的点!
  设计师都有收藏好设计的时候,我经常会去看我收藏的设计,当我一次又一次去看的时候,意识到有一些共同点,就是当第一眼看见的时候,它们颜色偷走了我的心。
  今天和大家分享下界面中如何使用颜色,颜色在设计中对于我们的情绪和行为有着很大的影响,很多产品都在抢占我们内心的颜色心智,因此选择适当的颜色的一个产品成功很关键的点!
  色彩的情感
  看过色彩心理学的同学都知道,除了美学外,颜色是情感的创造者,颜色的含义因文化和环境而差异化,在色彩心理学里面,不同颜色和含义是不尽相同。
  1。红色
  红色通常与激情,热情联系在一起,在设计中,红色的使用能很好的吸引用户,我们经常被运营或产品说这个地方按钮要大,按钮要红。
  2。橙色
  橙色是一种充满活力和温暖的颜色,能带人兴奋感以及热情活力的感觉,如果你的产品需要带来活力,有激情使用橙色就没错。
  3。黄色
  黄色是比较代表幸福的颜色,大家容易联想到阳光,欢乐和温暖,一般黄色用的好有很潮的感觉,但是在设计中也需要注意,黄色也是很容易让用户有负面反应,容易感到焦虑。
  4。绿色
  绿色通常代表自然,能给人和平清新的感觉,它相对其他颜色能给人更多正能量感,绿色意味着成长,再生与丰富,天猫超市品牌色就是绿色,代表着新鲜,丰富,健康的寓意。
  5。蓝色
  蓝色给人科技感,很多IT公司也都是运用蓝色当做品牌色,facebook,twitter,支付宝等等。因为蓝色能带来可靠,给用户平静的感受,它代表了平静,放松,安全。
  6。紫色
  紫色带来神秘感,非常神秘的一种颜色,一般用在奢侈品或者女性产品中比较多,它代表了浪漫,奢华。
  7。粉色
  粉色代表女性,代表年轻的活力,粉色比较柔软有爱的感情,同时粉色和年轻女性气质密切相连,因此如果你的用户是女孩,那么粉色是一个很合适的配色。
  8。棕色
  棕色,棕色常被联想到泥土、自然、简朴。它给人可靠感觉,一般设计中能带来温暖,舒适的感觉!
  9。黑色
  黑色,深邃,黑色是宇宙的底色,代表安宁,与白色相反,没有任何情感倾向,界面中尽量少用纯黑。
  10。白色
  白色,干净,神圣,纯洁的颜色,通常被认为是“无色”的。白色的明度最高,无色相。
  UI常用配色原理
  在UI中配色有哪几种方式呢,今天教大家一些小技巧,要了解UI中配色,首先我们的知道关于颜色的几个小知识:
  1。纯色
  顾名思义就是单色,一个颜色组成,在界面中经常通过颜色深浅冷暖对比来使用。
  2。邻近色
  相邻的两组颜色,色相环中相距30度,或者相隔五六个数位的两色,为邻近色关系,色调统一和谐、感情特性一致。
  3。互补色
  在色相环中每一个颜色对面(180度对角)的颜色,称为互补色,也是对比最强的色组。把对比色放在一起,会给人强烈的排斥感,搭配不好会很山寨。
  3。三种颜色
  界面中,由三种颜色组成的配色。
  4。拆分互补色
  拆分互补色就是在互补色的前提下,每个互补色再增加一个同色系的颜色,比如互补色是蓝色,和红色。
  这是一对红蓝互补色
  在蓝色和红色基础上,选择一个邻近色作为拆分互补色
  以上就是色彩中常用一些搭配方式,互补色,单色,邻近色,拆分互补色,那么界面中怎么运用呢,来看一些实际的案例
  单色运用
  Copper的产品设计,整个产品就采用一种配色,暖粉色,颜色年轻活泼,暖粉色很好的运用在界面的各个地方,形成统一的品牌认知。
  蒂芙尼,整个品牌网站,到线下店,以及对外的宣传,周边包装产品统一的使用着蒂芙尼蓝色设计,让这个蓝色深入人心。
  印象笔记的设计,从整体的网站设计,到界面,到引导页面,都是讲印象笔记经典的绿色用到彻底,形成品牌色彩认知。
  WalidB的插画作品,同样在插画作品中,运用一个色系,通过深浅对比,来形成统一的风格色调,让风格更加具有高级感,科技感。
  邻近色运用
  CreativeO的图标设计中,很好的运用邻近色渐变,让图标更加富有活力和时尚感,邻近色作为渐变运用。
  一个天气应用,同样采用邻近色做对比,背景底纹运用一些光晕让界面更加生动和灵动。
  IshtiaqKhanParag很好的将邻近色用在了图标和卡片上,让整个设计整体年轻活泼了许多。
  邻近色在很多的产品中越来越多被应用,邻近色取品牌色周围30度的颜色作为渐变色,我们在设计中需要注意邻近色一定不要太大,太大会显得不够柔和。
  互补色运用
  来自MIKE的作品,互补色设计中如果用不好,界面会很山寨,互补色前面我们说了,是界面中对比最强烈的配色,我们一定要注意互补色的比例,比例一定要协调舒适。
  补色在设计中,不要占比过大,一定需要有一个主色,补色作为重点去强调和突出,这组作品很好的把红色作为补色,有点睛的效果。
  互补色让页面更加突出文字信息内容,同时很好的讲内容趋势和图片趋势很好的拉好,形成了很好的冲击感。
  红绿互补色视觉冲击力强,很好的强调了音箱本身的质感。
  两组互补色运用,很好的将LOGO的矛盾感,空间强加强,要人过目不忘。
  三种颜色
  这组作品,通过三种颜色的叠加的形式,让三元色巧妙的运用到设计中去,同时颜色叠加形成一种新的时尚感。
  三种颜色运用最佳的案例当属于谷歌,颜色的饱和度以及设计都恰当好处。
  在谷歌的设计中,我们不难发现,它很好的将多种颜色组合在一起,不乱,同时还很平衡,这些值得我们设计师去好好领悟和学习。
  动手试试
  我们来拿一个案例来尝试下我们的方法,本文案例我从素材网站下了一个案例来尝试下我们今天分享的方法,单色,互补色,三个颜色,互补色拆分。
  1。单色使用
  在页面中使用西瓜红作为一种主色调,来强调品牌色和行动点,整个界面会呈现出简约和谐的氛围。
  2。邻近色运用
  这种配色和单色用法类似,在滑块上滑动到红色旁边黄色配色,作为额外的颜色。
  3。互补色使用
  互补色比单色,邻近色更加吸引用户注意力,前面我们说了,互补色在色彩里面是对比最突出的,我们主页面是红色,蓝色补色是我们需要强调吸引用户注意。
  4。互补色拆分使用
  这个原理其实就是互补色基础上进行拆分,对主要颜色增加一个辅助色,比如主要颜色红色,蓝色,那么我们增加一个淡粉色和淡蓝色作为辅助色,它的目的让颜色满足更多场景。
  5。三种颜色使用
  这个原理也是类似的,只不过我们选用了三个颜色应用在页面中,颜色越多越不容易驾驭,需要注意色彩之间的比例关系。
  总结
  颜色其实设计中最基础的,其实也是学问最深的,每个人对颜色感受,对颜色理解都不一样,也有很多设计工具帮助我们用好配色,后面我们再分享给大家,今天这个小小的分享,希望对你有帮助。
投诉 评论 转载

11个案例告诉你,编辑类App首页设计怎么做各类APP根据自身产品调性不同,首页设计也不尽相同。编辑类App怎么设计一个还不错的首页?本文作者结合11个案例对此进行了分析探究,与大家分享。最近看编辑类的App比较多……可视化设计的10个指导原则数据可视化已迅速成为在网络上传播信息的标准。它用于各种行业,从商业智能到新闻,帮助我们理解和传达见解。我们的大脑善于处理可视化信息,这使我们更容易理解图表或图形中可视化的……B端产品设计规范的意义与误区作者总结了自己在B端平台产品设计规范的整理工作的一些方法和思考,通过设计规范的工作,锻炼大局观,甚至实现最后的商业化。网上关于设计规范的文章写的都很专业,但没有区分C端产……如何让导航栏成为加分项?界面设计中,用了导航并不代表会用导航栏。正因为无法轻易删减,逃不掉就必须用好它,不然很容易沦为页面的减分项。讲一个老东家的故事。一次产品迭代会上,老板在台上讲到打算……ToB产品经理如何设计接口类产品?本文以被动请求接口为主,讨论如何进行对外系统接口的产品设计。一起来看看常见的ToB产品有四类:第一类为管理系统类产品,如CRM、ERP、BOSS平台等;第二类……互联网产品7。0版本的意义,听网易云音乐的回答7。0对于入口级的中文互联网产品来说,是一个重要节点。它是这个产品过往内功的集中体现,又是下一个世代这个领域产品大趋势的折射。这一次,网易云音乐给出了答案。当大家还在社交……提高用户转化率,如何设计订单页面?(以OTA行业为例)订单页面的设计对用户转化有着直接的影响,怎样设计才会更有效提高用户转化率?本文作者以OTA行业为例,对比了各个平台的订单填写页面,对这个问题进行了分析。订单填写页,是用户……干货如何构建UI组件设计规范通过本文,你将学习到Uber、Pinterest、Shopify和Airbnb等知名网站如何利用组件构建统一的UIUX设计规范。Airbnb通过reactsketchap……产品设计方案大观园(二):硬件设计篇上一篇《产品设计方案撰写指南(一):结构设计》中我们说到,只有理解背后的道理,借助框架模板,通过反复的训练才可以提高产品设计方案的撰写水平,并且和大家探讨了结构设计版块的撰写要……2019年终总结:从01的2B产品搭建复盘本文笔者简述了一款“2B”ERP生产制造产品的搭建思路,以此作为2019年的总结,也希望给读者带来一些启发。B端产品所处环境复杂,往往一开始接触的时候就如同走进了森林,不……这4个配色技巧,解决你80色彩问题今天和大家分享下界面中如何使用颜色,颜色在设计中对于我们的情绪和行为有着很大的影响,很多产品都在抢占我们内心的颜色心智,因此选择适当的颜色的一个产品成功很关键的点!设计师……如何搭建组件库基础实战篇?本文从组件分类、命名、上传、设计走查等要点,梳理了如何搭建组件库。一、搭建组件库有什么好处?让设计更高效、开发更迅速、产品体验更一致。很多大厂也做了自己的组件库,比……
产品经理岗位的由来、定义和发展产品经理工作图谱:泛产品经理思维框架构建用户端产品经理的思维模型实用套路:用户细分,各个击破工作三年后,我选择离开腾讯为什么你看了那么多产品文章,却依旧做不好产品?品牌定位靶盘:在规定时间内,你能表述你的产品是干什么的吗?感性的思考vs理性的感受一个产品的从0到1的全流程谈最易被忽视的竞品分析“抽象能力”产品设计的“节奏感”该如何把握?产品经理应如何提高产品文案写作能力

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界