选课报班>>

您现在所在的位置:主页 > 上元设计 > UI设计 >

镇江UI设计_渐变使用指南,如何创造令人难忘的

来源:上元教育
发布时间:2022-06-23
在很长一段时间中,在设计中使用渐变是一大禁忌,老师在教学中总是告诉学生不要使用渐变,因为渐变色很难在印刷品中显示。但是现在,渐变已经成为一种流行趋势,我们打开 dribbble 和 behance,可以看到很多使用渐变的设计作品,在本文中,我们就来谈谈渐变的使用技巧。
 
  相比纯色设计,渐变有哪些好处
 
  在 2014 年以后,UI 设计的风格开始从拟物化转到扁平化,谷歌发布了 Material Design,苹果发布了 iOS 7,设计师们开始尝试用扁平的纯色做设计。但是纯色的设计有一个弊端,就是可以使用的颜色很少,设计师的创意受到了束缚,同质化比较严重。
 
  2014 年非常流行的纯色长投影设计,当时的渐变设计很少
 
  在扁平化设计流行多年以后,纯色慢慢不能满足设计师的需求了,大家开始使用渐变,相比纯色而言,渐变主要有两大好处:
 
  1.渐变可以创造更有表现力的画面,获得更多的创作自由。
 
  通过将两种或多种颜色混合,渐变为无限的可能性打开了大门,设计师可以创造出更个性和令人难忘的视觉设计。
 
  Ghani Pradita 设计的网页使用了丰富的渐变,多彩的画面有很强的感染力
 
  2.渐变可以引导用户视线。
 
  设计师通过一些技巧,在使用渐变的时候可以将用户的目光巧妙地引导到视觉焦点上,吸引用户的注意力。
 
  Mixpanel 使用渐变来突出显示插图,由深到浅的渐变背景将用户的注意力引导到插图上
 
  3.突出的渐变可以成为画面中的视觉中心。
 
  尤其是在黑色的背景中,使用渐变经常能达到令人惊讶的效果,它能模拟光在黑暗中的效果,成为画面的视觉中心。
 
  黑暗中的渐变经常能做出非常棒的光感,成为视觉中心
 
  使用渐变的一些技巧
 
  1.不要使用对比很强的颜色
 
  不是所有的颜色都能很好得组合在一起。如果使用互补色组成渐变,对比度太强,通常情况下效果都很脏。
 
  这是红色和绿色在一起时的效果,作为互补色它们组成的渐变效果很差
 
  使用相近的颜色创造的渐变很和谐,下图为使用青色蓝色和紫色创造的渐变。
 
  2.上浅下深的渐变可以模拟物体
 
  经过力力的观察,上浅下深的渐变可以模拟现实生活中物体被光照射的景象(比如卡片)
 
  在一些理财应用中,经常用上浅下深的渐变来模拟卡片
 
  3.上深下浅的渐变适合做背景
 
  生活是设计的导师,不知道大家仔细观察过天空没有,天空的颜色从上到下一般是从深蓝色过度到浅蓝色的,天空在我们的生活中一直扮演了背景的角色,因此在设计中设计师也经常用上深下浅的渐变作为背景,可以很好得引导用户的视线向下看。
 
  天空的渐变
 
  在 UI 设计中,背景经常使用上深下浅的渐变,就像天空一样,把用户的目光引导到下方的内容中
 
  4.高级的渐变必须有色相的变化
 
  即使是很微妙的渐变,比如从深蓝过度到浅蓝,也不能无脑得选取同一个蓝色。我们观察上一幅图片,在背景从深蓝往下变浅时,色相也从蓝色过度到了紫色。这是一个非常重要的技巧,同一个色相下的渐变变化太平淡了,即使是最微小的渐变,也一定要有一些色相的变化。

价值千元线下试听课 限时预约中