火星网校
发现更多关于配色设计的秘密，让你的界面更出彩
发布时间：2024-08-11 20:12:57 浏览量：173次
色彩在产品中扮演着至关重要的角色，好的配色方案能让产品焕发新生，给用户留下深刻印象。
今天咱们来聊聊关于色彩的话题，不废话，直接聊聊苹果和谷歌的配色方法，帮你理清界面色彩搭配规范！
在我收藏的设计作品中，经常会被某些设计吸引，每次都在思考这些设计点的迷人之处。后来我找到了答案，那就是色彩，在一眼望去时，吸引我目光的始终是色彩。
色彩就像一把设计师的魔法棒，可以吸引注意力，唤起设计情感。
在电商设计中，用户90%的快速决策基于色彩。为何国内电商的“直接购买”按钮常用橙色或红色？因为这些颜色能激发用户购买欲望。
那要如何定义一套色彩呢？
色彩如何定义
1. 了解产品定位
当确定配色方案时，首先需明确设计目的。
询问自己，我们的色彩需要向用户传达何种信息，是希望激发购买欲望，还是营造尊贵感觉，抑或唤起某种情感，色彩可塑造品牌形象、情绪氛围。
如可口可乐旗下的Fuze Tea红茶品牌，以自然绿色为品牌代表色，传达融合植物、茶叶等健康元素的形象。
2. 了解用户喜好
男性通常喜欢饱和大胆颜色，而女性偏爱柔和色调。此外，男性喜欢深色调（含黑色），女性更倾向于明亮色调（含白色）。
人们对色彩有不同理解，因个人喜好、文化背景等原因，对色彩寓意也不同。因此，在设计时需考虑目标用户。
西方红色代表恐怖、死亡等，而在中国则象征繁荣、激情，文化差异需在设计中考虑。
在西方，黑白代表纯洁、高贵感，许多高档品牌服装、店铺都采用黑白配色。
而在日本、韩国，黑白通常与死亡、丧礼等联系，文化差异需慎重考虑。
3. 了解色彩心理学
紫色给人高贵、奢华等感觉，但也可能带来忧郁不安情绪，使用时需谨慎。
4. 发掘色彩灵感
早期选择品牌色往往比较困难，这时需寻找灵感，以下推荐几个工具。
https://brandcolors.net/是一个优秀网站，收录全球500强企业品牌色彩，可从中寻找适合产品的配色方案。
https://www.materialui.co/colors提供谷歌的色板库，值得学习参考。
http://www.home-designing.com/提供室内设计配色灵感。
当找到喜欢的色彩方案后，结合调色工具，制作色板并根据需要灵活调整。
如何定义一套UI配色
如何定义一套APP的配色，如何用HSB作色彩定义。
HSB是色相、饱和度、亮度的颜色模式，在HSB模式中，H代表色相，S代表饱和度，B代表亮度。
1. 多尝试不同配色
在制作色板时，尝试创造所有颜色和灵感，然后逐渐缩小范围，并结合前述原则进行选择。
在UI设计中，需注意：
- 超链接颜色
- 品牌色
- 主要颜色、辅助颜色
- 成功、错误颜色
- 文字、背景颜色
2. 利用HSB色彩模型
首先确定品牌色，通常是企业LOGO颜色，若无可自行定义。
以品牌色为基准得出24色带：
以Spotify软件为例，品牌色为绿色，可参考该色打造一套色彩体系。
根据设计需求，将H值（色相）设定为15，逐步调整S和B值，形成基于品牌色的24色带。24种色彩围绕360色环，确保色彩和谐。
基于色带得出16色相环：
细心者会发现24色带中颜色接近，需进一步筛选为16色相环，选择与品牌色搭配自然的颜色。最终根据16色相环确定辅助色。
调整B（亮度）和S（饱和度）：
设定辅助色，调整亮度B值可选择-10、-20，调整色相H值可选择+-5，确保辅助色对比明显。
亮度调整，不明显可设定为-20、-30。
调整B饱和度值：
最终形成一套配色板，有些色彩接近，需进一步筛选。
制定色板：
根据品牌辅助色相邻色，制定色板。https://coolors.co/可输入品牌色，生成相应明度色板，可根据需要调整明度。
以上就是
热门课程推荐
热门资讯
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
3. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
探索零基础UI设计培训的时长与薪资前景。了解数字艺术教育领域的专业课程，以及培训后的职业发展机会。
-
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
-
9. 设计中的色彩心理学:浅析中西方色彩的历史演变与设计应用
摘要:本文探讨了色彩的历史演变和设计应用。通过对色彩在早期文明社会中的实用运用、不同文化背景下色彩观念的差异、色彩在设计中的重要性以及新兴技...
-
大家今天走运了,我就把自己总结出来的学习UI设计的一些经验与大家一起分享吧。想做一个好的UI设计师除了应该具有一定的审美能力,还要了解整个产品的...
