蓝色依然是一种安全的色彩,当你的产品或者网站契合蓝色的气质的时候,不妨选择它,但是始终记住一点:选择适合自己的产品的色彩,才是正确的选择。
你可能已经猜到这篇文章是关于蓝色的。毫无疑问,蓝色是UI设计中最重要的颜色,也是使用范围最广、最常用的色彩。在你的手机当中,许多APP都采用了蓝色的LOGO,而它们的UI也大多也将蓝色作为主色调,Facebook、Twitter、Shazam、Safari、支付宝、知乎、Behance均是如此。
那么,为什么大家都会不约而同地选择蓝色呢?
原因很多,但是最主要的,还是下面的几个。
1、绝大多的用户喜欢这个颜色
有调研指出,绝大多数的人都喜欢蓝色,蓝色被认为是全球范围内最安全的设计用色。
2、蓝色与自然相关
清朗的天空和纯净的水,在多数时候都呈现出漂亮的蓝色,它们代表着好天气和健康的水源,这种对自然的亲近深藏在人类的基因当中,外化表现为对蓝色的喜好。
蓝是海洋和天空的色彩,是自然的色彩。
3、蓝色还是UI设计师的通用色彩
从UI设计师的角度上来看,这是一种泛用且实用的色彩。常见的色彩当中,红色、橙色、绿色对于用户都有这强烈的情感影响,其中黄色常用作警告,红色能够唤醒用户的激情,也能够昭示危险,而绿色常常关乎健康、安全,相比于它们,蓝色的泛用性明显更强。
4、蓝色所传递的情感相对更加抽象
蓝色所传递的情感相对更加抽象,它还能传递出“创新”和“科技”的感觉。所以,当公司采用蓝色LOGO的时候,常常会让人想到技术和创新。
5、蓝色会让人有安全感
蓝色会让人有安全感,因此许多旅游相关的APP和网站会乐于采用蓝色的UI设计。它隐隐传达出可靠、信任的感觉,对于旅行类的应用和网站,无疑是不错的选择。
Delta airlines
6、蓝色让产品看起来更加值得信赖
更准确地说,它会让用户更倾向于觉得“这是我要的产品”,当这种感觉和品牌本身的运作和特质结合起来的时候,就能够形成让人信任的品牌性格了。戴尔、IBM、英特尔、AT&T、和 PayPal 都是利用技术来营造品牌的信任感,进而创造出让人日复一日值得信赖的产品。
蓝色令人沉静,能让人感觉平衡和智慧。许多金融类服务企业也因此选择蓝色作为品牌色。
7、蓝色对于色盲也足够友好
占比最大的红绿色盲群体都能够清晰地分辨出蓝色。
色盲用户眼中的色彩效果
蓝色是Facebook 的主要色调,因为扎克伯格就是色盲,正如他所说:“于我而言蓝色是我最容易分辨的色彩,所有的蓝色我都能掌控。”
UI设计中的色彩运用
1.创建画布
新建一张790*400的画布
2.制作背景
Alt+Delete 填充背景色为 #1c46e3,并为其添加渐变叠加图层样式
3.创建界面底托
选择圆角矩形工具,创建 250*90圆角半径2像素 的白色圆角矩形,并为其添加 图层样式
4.为底托添加效果
新建图层,选择椭圆选区工具画一个如下图的选区,并进行羽化(50px) ,Alt+Delete填充黑色
将绘制好的“黑色羽化图形” Ctrl+T 变得扁一些
为该图层添加蒙版结合画笔和选区工具制作
调整为柔光模式
5.制作彩色Loading条
矩形工具绘制288*2的矩形,并为其添加 渐变叠加图层样式 ,在其下绘制1PX黑色直线
6.现在给整个界面增加细节
这一步主要是通过直线工具和选取工具对界面进行细化
7.为界面添加文字,并将loading修改到36%状态
加入文案,为其添加1px修饰效果,将彩色loading添加图层蒙版,做成36%状态
8.为Loading添加加载时的预期动画效果
这里主要是灵活运用选区工具,画笔工具,铅笔工具(铅笔工具作用于绘制1px点)进行仿光效绘制
9.放上自己心爱的小icon,做适当修饰~
因为整个界面风格是简约风,所以在选择icon的时候也要选用风格相对一致的哟
10.最后为icon和文字添加光效修饰,再加入属于你自己的印记,大功告成~
手机UI流畅度哪家强,蓝绿厂中的OPPO居然排到第一?
UI设计中的色彩运用
20世纪90年代,由日本SONY公司推出的智能化移动手持设备T86通^色彩绚丽的屏幕,漂亮的图形按钮以及流畅的操作刷新了用户对人机交互界面的体验。并在行业内引发了设计者对UI设计中风格、图形、色彩、操作体验等等方面的全新思索。经过二十多年的 发展。
UI设计已经成为一门专门性交叉学科,通过对视觉思维、心理学、人体工程学等不同学科的研究,设计者从各个方面不断的改善用户的操作体验。早期的软件界面曾经通过“拟物化”设计(skeuomorphism)试图通过模拟真实物体的质感来让人机交互更趋向于人与现实世界的交互方式而“去虚拟化”;而21世纪以来,随着UI设计中对视觉传达规律的运用,“扁平化”设计(flat)成为更为主流的设计趋势。扁平化设计更为现代主义,通过简洁、单纯的色块的组合与运用帮助用户更好地理解与使用产品本身。
1 UI设计中色彩的功能
色彩作为视觉传达中非常重要的要素在UI设计中具有非常重要的作用,可以归纳为以下几个方面。
1)显示界面的整体架构
一个UI界面总是借助图形化的外观直接作用于客户的视觉系统。用户接触一个UI界面,看到的往往是一个由底色、其他几何色块、图标、按钮等元素构成的图形符号系统。用色彩可以非常直观的凸显出背景、导航栏、状态栏,按钮等构成元素,并显示出UI界面的逻辑架构。
2)明确视觉层级关系
UI设计中不同的内容属于不同的层级关系,如菜单于菜单间的同级关系、内容间的从属关系等等。用同色系色彩、不同色相色彩间的差距可以非常直观地区分内容的层级关系,还可以通过色彩间的强对比突出关键内容。
3)营造界面整体风格
UI界面虽然是个复杂的视觉图形系统,但通过主色调、辅助色、装饰色之间的对比调和关系会呈现出明显的风格倾向。用不同的色系或者同色系色彩之间的对比与调和关系,可以塑造出不同的界面风格。如适合男生的金属质感的黑色、灰色、蓝色系,女生喜欢的梦幻甜美色系、糖果色系。界面风格定位于品质已经成为用户体验中最重要的部分之一。
4)基于人体工程学的色彩运用。
由于色温会影响到光源显示的颜色,大于 6500K 就会偏冷(白蓝),小于 6500K 就会偏暖(黄红)。而蓝光大量存在于电脑显示器、荧光灯、手机、数码产品、显示屏、LED等光线中,由于蓝光是一种高能量的短波光线,因而会较为严重的伤害视力。基于人体工程学保护视力考虑,苹果手机Iphone7和iphone7plus手机背光显示设计了Night Shift 的屏幕去蓝光保护功能,开启后会在晚间自动将屏幕显示调成暖黄色调,减少视觉疲劳。
此外,UI界面中,考虑到电子设备的显示特点。背景色要与图标色彩之间至少有5.38以上的对比差,才能够易于区分。而在此差值范围内的配色则会因为过于接近而在显示环境中对辨认造成困扰。
还有一些特殊人群,如红绿色盲人群,由于特殊视觉需求而需要进行特别的配色设计。
2 UI色彩设计方案
在进行UI设计时,要通过对产品及用户体验的分析确定明确的色彩搭配反感,形成“标准色彩规范”,在这个基础上再进行具体界面、线框、图标等细节设计。标准色彩规范中要规定出最主要主色、辅助色、装饰色的色号,方便设计师的设计稿的色彩统一。
1)主色调
主色用量基本占据全部用色的75%,基本决定了整个界面的视觉风格。主色选择要符合产品本身的气质、诉求和色彩心理学规律,可在主色的基础上通过明度与纯度的变化衍生出同色系色调作为主色调范围。
根据色彩在视觉中的能量值,一般主色倾向于选择饱和度高、明度低的色彩,往往会在在同一界面中占据较大的面积或明显的凸现于背景。
2)辅助色
辅助色起到辅助主色的作用,在全部用色中约占据20%。用与主色同色系色彩作为辅助色可以呈现柔和、整体、统一的视觉效果;而用主色邻近色作为辅助色可以让界面有丰富的变化,产生活泼感;用主色调对比色作为辅助色可以让主色更为突出。
3)装饰色
占全部色彩方案的5%的装饰色起到点缀、提醒的作用。并界面增加个性化、富于趣味的视觉元素。装饰色要与界面整体色调相区别,一般在明度、饱和度上要有明显差异,一般会用明度或饱和度高的`颜色。
3 UI设计中对色彩三要素的运用
色相、明度、饱和度是色彩的三要素,对这三个色彩要素的理解和运用体现在UI设计中整个色彩方案中。
色相是色彩的首要特征,是不同色彩相区分的重要因素。色相也是色彩搭配中进行色彩对比的主要因素。对主色色相的选择往往决定了一个UI界面的整体风格与气质,或奔放活泼,或冷静深沉,或淡雅清新,或浓郁艳丽。其他辅助色则起到对比或调和的作用。因而一个UI界面的主色选择要符合产品本身的特质。以手机APP为例,淘宝、百度外卖、大众点评等许多电商类APP常常用容易让人兴奋、热烈的红色、橙色作为主色调;而主打探索与求知的“知乎”APP则使用理性、冷静的蓝色作为主色。
色彩的明度是色彩的明亮程度,是对色彩进行调和的主要因素。同色相色彩的明度变化可以在同色系中呈现一种调和统一的变化关系,协调而具有层次感。常常用于配合主色进行图标、菜单、导航等设计。明度变和也会带来色彩性格上的差异,明度升高会让色彩变得明亮、呈现清凉感;而明度降低则会让色彩变得暗淡,呈现温暖感。
饱和度是指色彩的鲜艳程度,也是色彩进行调和的主要因素。饱和度的改变同样会让色彩呈现从浓烈活泼到安静深沉等不同的“色彩性格”。此外饱和度的改变还会让色彩呈现不同的质感,如金属的不透明、坚硬、光泽感;糖果色的清新甜美感等等。
4 UI设计中的色彩心理学运用
色彩具有非常强的联想性。不同的色彩会在味觉、空间、冷暖、情绪等不同方面引发人们不同的综合感受。UI界面在主色调的选择中往往会利用人们对于色彩的联想习惯突出产品的定位。仍以ios系统手机APP为例;以介绍美食菜谱的“香哈”APP,主色采用最容易诱发食欲的红、橙色系;而具有丰富中国民俗传统的万年历APP则采用了充满中国传统文化涵义的中国红作为主色并配合这一气质采用篆书字体作为文字标识。
综上所述,由于色彩的重要性,对色彩的理解和驾驭对整个UI界面的设计产生着巨大的影响。
UI设计中常用的色彩搭配技巧有哪些?
对于手机的使用体验,一般用户最直观的感受就在于使用体验,而使用体验要好,手机流畅度一定得好。其实手机的流畅度不仅仅跟手机的配置有关系,各个手机厂商对于手机系统UI的优化同样可以在感官上提高手机流畅度,就比如点开某个应用的过渡动画、系统对于应用的资源调配等。 最近 娱乐 大师公布了2021上半年最流畅手机UI排行榜。 在这份榜单中,有不少大家都了解的系统,比如小米的MIUI在其中排第七,这显然不符合小米在米粉心中的地位,鲁大师也是完全不怕米粉对它的微博进行轰炸。 已经沦为小厂的魅族凭借无广告,成功打了个翻身仗,竟然挤进了前五,不知道魅友们还能不能在有生之年再看到魅族昔日的荣光。 值得注意的是,在这份榜单中斩获榜首的居然是OPPO,OPPO手机之所以在流畅度上屡获肯定,除了扎实的硬件配置外,ColorOS出色的软件优化一定是功不可没的,要不然绿厂的实体销售员也不敢叫嚣着骁龙765处理器比骁龙888还流畅。 除此之外,鲁大师还发布了2021上半年最流畅手机排行榜,oppofindx3pro又是排名第一,说实话有时候还真一点怀疑这鲁大师是不是跟绿厂有一腿,不然为何蓝厂系统排行榜才排第九,值得深思。 作为唯一一个不是安卓阵营的手机厂商华为,在这份榜单中HarmonyOS仅排到了第八名,不过在这短短一两年里,华为能做到这种地步还是很值得鼓励的,越是困难越是要迎难而上,打出中国人的气势,价格再亲民一点就好了,现在买不起了。 不知道你们认为什么厂商的手机系统最好用,欢迎评论区留言
在视觉艺术中,有时被艺术家注入到创作中的颜色能成这个作品的灵魂。其实颜色就是一种力量。它可以在转息之间改变图片的基调。它可以增强,减轻,突出,说服,呼吁等等。颜色和文字也可以相互辅助,并使他们更有力量。它可以在没有任何文字的情况下传达出自己的感情。成为设计师手里的一大武器。这就是为什么在UI设计领域里,颜色是关键的因素之一。
那很多设计师不知道在设计产品是如何选择颜色,我们先来看看优秀的配色案例,再简单的分享一下配色的方法吧。
今天我们就来看看Ludmila的设计理念和作品。
在应用或者网站工作的设计师,颜色的选择和组合是最初设计的主要部分。当被问到这条道路上有什么锦囊妙计的时候,Ludmila说,她将从事任何创作的过程中基本上是从四个主要组成部分中成功的:良好的心情,传递积极情绪和感情的欲望,灵感,和你对设计的热爱。这四点是促使人们迈出设计第一步的基石。再经过深入的知识或者艺术的搜索和准备,就可以换来惊人的效果。
1、大胆的尝试
如今,设计师在颜色搭配和选择的时候有很多辅助软件。其中很多软件可以提供大量的现成颜色组合可以选择,还可以查找很多别的设计师的例子。设计师就可以在不断的尝试中找到不同的搭配。
然而,设计师要跳出这些已有的搭配和组合,要用自己的热情设计和创造新事物。当然这不意味着一开始就要尝试革命性的新设计,保持头脑清醒,放飞创造力。不要害怕进行大胆的尝试。
2、不要被标准禁锢
对于新的客户来说,你得主要竞争力就是作品,可以肯定的是,你可以决定你得作品想要表达什么。如果你只想展示的风格的一面,例如,你想让客户笑,想让他严肃,那么这一条并不适合你。然而实践证明,当你提供各种不同配色的作品时,他们可选性更多,成功率也更大。
3、尝试渐变
2018年开始的趋势,更多的应用渐变,可以加强颜色的感染力。但是必须提到的是,很多设计更喜欢避免渐变色。然而,现在渐变色已经越来越有潜力,合理的应用在设计中,反而可以为颜色的选择中加分。
4、尝试干净的组合
无论在什么组合中,颜色都应该感觉干净。即使是特别大胆的创新和尝试,都不应该在屏幕和页面上留下污垢。清晰度提高了可用性和可读性,并使所有的颜色都尽可能的发挥自己的影响力。
5、尝试用颜色作为背景
用颜色来呈现作品,也需要用颜色来衬托作品。通常,设计师们会把精力更多的放在作品本身上,而减轻了对背景的关注。然而,更多的时候背景可以成为另一个活跃主题的要素,可以使作品看起来更富有表现力。不要错过尝试的机会,也许这个选择是正确的。
6、用黑白模式选颜色
应用程序有的时候不仅仅是为了传输视觉信息,而且要能够与产品进行简单和成功的交互。检查设计方案的有效性最好的方法就是通过黑白外观来测试。观察黑白模式下的作品,会更快的发现什么元素是更引人注目。这不会减小颜色对设计的影响,相反能能好的发现无效的颜色组合,发现更多潜在问题,也可以让设计师更关注色盲用户的体验感。
7、从艺术中获取灵感
获得灵感并将灵感转化为设计的最好方法就是观察艺术。经典艺术,现在艺术,数字艺术。水彩画,油画,炭画,水粉画。任何一种艺术都能吸引设计师的共鸣。艺术在颜色的选择和应用的角度都非常有效,当然也都特别有创意。在你喜欢和欣赏的艺术家的作品中寻找灵感是非常有帮助的。获得灵感,并尝想象你在设计的作品就是一件艺术品,结果不仅对客户,甚至最你自己的提升都是惊人的。
8、关注细节
美国设计师查尔斯·埃姆斯说:“细节不是细节,他们在设计”。这是在应用程序或网站的UI设计与工作的关键法则,特别是当设计师选择组合调色板时。没有透彻的分析和关注,什么设计都有可能前功尽弃。颜色是将所有的细节展现出来的高效方法之一。颜色阴影和暗部也是加强视觉元素层次和机构的有效途径。
9、可用性是关键要素
设计一个UI不仅仅是平面设计,设计UI也是为用户提供可以方便快捷而且让生活更加幸福的产品的过程。因此,从UI中的颜色选择和用法的角度来看,设计师始终都要铭记,界面应该是使用性强并且清晰干净的。颜色选择的所有细节都应该为这个大前提来服务。使用颜色来改进和加快导航,使用类别颜色编码,提供颜色标记,这些方面都是可以使设计变得更加有效,用户体验更高,而这些都是颜色的力量。
所以,颜色不仅是伟大的设计工具和技巧,也是强大的灵感来源。通过实验和实践来训练设计师对颜色的认知,可以使大家更好,更准确的完成更多客户的要求,并更加有动力,在设计的道路上走得更远。
以上就是关于为什么ui设计中最常使用的色彩是蓝色全部的内容,如果了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!



















