广州总部电话:020-85564311
广州总部电话:020-85564311

广州网站建设-小程序商城开发-广州小程序开发-企业微信开发公司-网站建设高端品牌-优网科技

19年
互联网应用服务商
请输入搜索关键词
知识库 知识库

优网知识库

探索行业前沿,共享知识宝库

APP配色概念--深圳UI设计公司
发布日期:2025-02-03 19:50:02 浏览次数: 814 来源:肯尼全媒体



点击上方蓝字关注我们



APP配色概念


1.APP基础色彩构成


图11-1冷暖色模型


APP所用的配色方案为自发光的RGB色系

一套APP配色基本由背景色、主题色、辅助色、点睛色4种色调组成

(1)背景色:分为浅色基地(白基),深色基地(黑基),彩色基地(灰基)

(2)主题色:除了基地背景色外占最多体积的色调组成,主色调也可由几个颜色混合的渐变色组成。

(3.辅助色:辅助主色,使画面细节更丰富,辅助色也可由呼应主色调内容图片辅助。

(4)点睛色:引导阅读,装饰页面,让页面的元素信息层级井然有序。


图11-2白底和彩底及黑底配色的APP


2.前进色和后褪色元素的色彩信息层级

浅色底上,深色,鲜艳的颜色为前进色,深色底上,浅色,鲜艳的颜色为前进色。



图11-3前进色和后退色


比如机场和机票这个2个页面,地图为暗色背景色,而路线就是亮蓝色为前进色,点睛色。

下方弹窗白色压在地图上为前景色区域,按钮亮蓝色为点睛引导区域。机票页面,红色为背景色,白色为前景卡片区域,2个城市MUC和SFO为重要功能色,时间和座位登机口为点睛色,按钮和二维码为点睛色。

小提示

优秀的UI界面,每个页面上功能和内容都会分主次信息层级,凸显重要的内容,弱化不重要的内容,好的UI APP页面应该在第一时间让用户看到自己想看到的内容,节约用户时间,在用户使用过程中,用色彩和图标及元素摆放位置,很好的引导用户实现来这个软件上想要实现的操作任务和目的。


图11-4APP中的元素色彩信息层级


1.凸显APP页面UI元素和文字的多种方法。


图11-5APP中的元素色彩信息层级


文字可以用颜色、粗细、深浅、大小等方法来区分谁更重要,甚至,还可以在色彩前面加上图标,色块,底下加上下划线,或者删除线来使得文字相对其他文字更加明显或者减弱。

图11-6区分元素优先级和功能分类的手法


我们可以使用格式塔理论来设计元素之间的对比关系和从属分类关系,尺寸一致的,类似的功能的图标靠得更近等,也可以用相反的手法凸显这些UI元素。

格式塔原则・接近性(Proximity)

物体间距影响我们对它们关系的感知,距离较近的物体看起来组成了一个整体,距离较远的则不是。

格式塔原则-相似性(Similarity)

如果不同元素在形状、颜色、阴影或其他特征上彼此相似,那么这些相似的元素看起来就自然组合为一组。图4.A中,尽管圆点之间都彼此等距,但绿色实心圆点却因颜色一致让我们觉着它们是两条垂直线;


图11-7格式塔接近性和相似性


格式塔原则-连续性(Continuation)

格式塔心理学上所指的连续性是指对线条的一种特殊知觉,人们在知觉过程中往往倾向于使知觉对象的直线继续成为直线,曲线继续成为曲线,持续延伸。

格式塔原则-共同命运(Common fate)

之前介绍的格式塔原理都是针对静态图形,而共同命运这一原理则涉及运动的物体,一起运动的物体会被感知为属于一个整体或者彼此相关。


图11-8格式塔连续性和共同命运


1.当下最流行的4大类配色方案

(1) .单色渐变,这几年流行的UI配色为糖果色,及彩虹流体渐变,而双色渐变又分为艳色系和浅色系及深色系3种。


更多的APP渐变配色方案举例:

(1) 一般电商类APP多以橘色,红色,粉色暖色为主要配色,因为用户群大部分为女性,又需要激发人们的购买欲,但是高端购物APP也有很多黑金,黑白冷淡系配色,不是一概而论。

(2)一般医疗,科技,旅游类产品以绿色,蓝色为主要配色,但是也有一部分医疗美容产品用粉色,旅游类产品用柠檬黄如蚂蜂窝和飞猪旅行,还有一些民宿类APP比如爱彼迎是红色的。

(3)一般音乐类APP多以绚紫,紫红为主要配色,也有小部分文艺类的为红白,绿白,黑金为配色。

(4)一般理财类APP多以橘色,紫蓝,土豪金,红色或者黑底为主要配色,记得尽可能不要绿色感觉会跌。

(5)一般美食类APP多以米黄色,咖啡色,粉红色等烘焙色为主,当然也有一些高端的会走黑金,绿色食品冷链会走蓝绿路线。


小提示

当页面上颜色太多的时候,我们可以用大面积白色和黑色(深色)去和谐统—颜色。


图11-9白色及深色调和多彩色页面


图11-10更多APP单色配色


图11-11更多APP渐变配色







优网科技,优秀企业首选的互联网供应服务商

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!

优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。


我要投稿

姓名

文章链接

提交即表示你已阅读并同意《个人信息保护声明》

专属顾问 专属顾问
扫码咨询您的优网专属顾问!
专属顾问
马上咨询
联系专属顾问
联系专属顾问
联系专属顾问
扫一扫马上咨询
扫一扫马上咨询

扫一扫马上咨询

和我们在线交谈!