UI视觉设计趋势 与创意设计方法

做更好的符合商业需求的设计前提是要了解当下设计的流行趋势，那么问题来了，现今UI设计的流行趋势是什么呢？

说到设计趋势，我们必不可少要讲到扁平化，因为扁平化设计依然是主流。

说到扁平化，那么必不可少要就要讲到扁平化的死对头：拟物化。

一、扁平化设计VS拟物化设计

拟物化诞生的比较早，一直都存在，被运用到UI里面差不多2009-2012年左右，这几年是拟物化盛行的时代，那么为什么这段时间会盛行拟物化设计呢？而不是扁平化设计盛行呢？这段时间有没有扁平化呢？

其实拟物化和扁平化是一直存在的，只是在每一个时期受欢迎的程度不一样，那个时代也是有扁平化的，比如微软的winphone、win8的效果，就采用了大块面的北欧的极简风格。为什么2009-2012年拟物化运用的是最广泛的呢？

主要是因为这段时间属于智能手机的上升期，很多人都是刚刚拥有第一台智能手机，当大家从功能机向智能机转换的时候，有很多页面是没有办法理解的，所以用拟物化的设计语言可以很好地映射我们生活当中真实的场景和真实的物品，可以很好的把用户带入进来，让用户有一种熟悉感。 如果在一开始使用智能手机时，是使用扁平化设计，那么用户的使用成本是极高的，用户很有可能不理解图标以及页面的意思，就会产生疑惑，从而带来不好的使用体验。

2012年迎来了扁平化1.0的时期

扁平化在UI界面领域第一次广泛运用就是IOS7的发布，IOS7采用的非常极简的扁平化设计。相对拟物化而言，IOS7带来扁平化潮流，并且强调排版的形式感。

我们现在看到的大部分设计都是扁平化2.0设计，扁平化1.0与扁平化2.0的差距主要在于：

扁平化2.0带有一些质感，没有扁平化1.0那么纯粹，极简；扁平化2.0存在一些微妙的，细小的投影，字体也有一些变化，字体变得稍微粗一点；画面的对比也稍微变得强烈一点；

扁平化2.0在拟物化和纯粹扁平化中找到了平衡点，做到的适度的渐变，适度的材质和适度的光感以及更丰富的色彩搭配。

这正是我们这个时代的扁平化。

二、UI视觉设计趋势分析

  

目录

1.颜色

2.排版布局

3.图形图案

 

1.颜色

大胆用色，对比强烈：现几年的颜色设计趋势，用色都比较大胆，对比强烈,大胆的撞色得到更多设计师的青睐。

通道色：这种颜色趋势国外用的比较多，国外则采用的比较少。这种颜色的使用效果给人神秘和不可思议的感觉，另一方面也会给人一种脏脏的感觉。比较适合一些面向国际的产品。

全息幻彩：它有一个非常专业的词：holographic;给人感觉迷人、梦幻、多变。它也不仅仅运用到UI设计里面，当下很多手机壳的颜色也采用了全息幻彩的形式；

镭射虹彩渐变：（color-gel laser gradient）,这是色彩的运用早期在平面包装运用的比较多，去年才开始流行于UI设计领域。

名人色：即用人名命名的颜色，

比如去年的爆款：莫兰迪灰（延禧攻略），是一款非常高级的灰色系，特点是对比度低，如果内容很多则不适合采用这款颜色，所以比较适合页面留白较大，内容较少的界面。

克莱因蓝：被认为是世界上最纯粹，最干净，最无瑕的蓝色，是一款纯度非常高的蓝色。其实在UI里面看到的所谓克莱因蓝，都是降低了它的明度和饱和度，否则会很刺眼；

爱丽丝蓝：淡淡的，很梦幻的那种小女生的蓝色；

范戴克棕：胶片工艺里面的 

品红：注意品红是名人色!haha,没想到吧

2.页面的排版布局

更大的负空间：

这两年，UI设计在页面的排版布局上有一个共性：更大的负空间，即所谓的留白。因为我们设计的所有的页面的宗旨是为用户体验设计的，用视觉的方式向用户传达页面的内容信息。我们如何做到高效率的向用户传达页面的消息：

少即是多(less is more)。

简洁的页面更适合用户获取内容信息。

负空间在所有设计领域都有适用。

破型和错位叠加：

这种排版设计趋势与色彩趋势有一点像，那就是大胆，使得页面没有那么中规中矩，死板；采用破型和错位叠加的设计方式会使得页面更加灵活，生动。可以运用在banner图、H5的运营页面，大模块的标题……

超大字体排版：

让用户聚焦信息。这种排版趋势这两年特别的显著，也是由iPhone和Airbnb做出来的设计，从而引领了整个UI设计领域的设计风格；从IOS10 开始的大标题，陆续的国内很多APP也使用了这种大字号标题的设计，包括一些运营的页面，H5……

这种极度夸张的大小对比，能够让用户迅速聚焦到内容上面来。

3.图形图案

场景插画盛行：

UI界面的开屏，引导页，缺省页，下拉刷新等等，都要求需要插画设计。插画设计在整个UI领域运用的非常的广泛，因为它更具有易读性、故事性、趣味性，更容易吸引用户的注意。我们应该考虑到用户在各个方面的使用体验，插画则是一个很好的情感化设计的一部分。

插画icon：

 

光感透气叠加：

这种设计形式比较适合运用在一些科技类产品领域，为产品增添更多的未来梦幻感。还有一些数据可视化的设计也会采用这种形式。

3D元素：

三、面对这些设计趋势，设计师需要哪些能力？

一精多专 全面发展：精代表有一个能力点是你必须很精通的，在团队里面是不可替代的位置；专则代表熟练且专业；全面发展则是要熟悉所在行业的相关信息。、

熟练掌握多种软件技能

基础通用能力：沟通表达能力，准确获取有效需求信息，清晰表达设计想法，获得他人认同

              分析挖掘能力，将获取到的信息，进行分析，挖掘更深层次的需求，可帮助我们抓到用户真正的痛点。

              执行力，能够高效完成任务、在工作过程中主动推动任务前进。

系统专业方法论：专业的方法可以帮助我们更好的进行设计工作

                头脑风暴    可用性测试    用户访谈     A/B test     用户画像    角色扮演…… 

四、创意设计思维&方法

主要方法：

1.联想。联想是创意设计思维最常用的方法，把你要设计的东西以一个核心事物为起点，将与之有关的元素进行联想，联想的越丰富，idea就会变得越多。

联想分不同类型的联想：横向联想、纵向联想、关联联想。

    横向联想：围绕核心事物进行发散，只考虑与核心事物有直接关联的，也就是一度关联的事物

    纵向联想：联想后的一样事物要与前一样事物有关联，深挖下去，找到与核心事物有二度、三度、甚至五度、六度关联的事物

    联想的体系：整个联想的体系就是一个事物的横向联想，然后再在某一个点上进行纵向联想。

    关联联想：联想两两事物之间的共同之处，找他们的共性。

联想是一个非常基础的寻找创意点的方法，我们应该不停的进行横向与纵向交叉的联想方法，最后你会发现你的灵感会井喷式的爆发出来，haha.

2.发散+聚敛

联想是一个思维发散的过程，我们也需要让思维集中：聚敛。通过“发散——提出创造性设想”和“聚敛——对创造性设想进行分析筛选”的反复交叉进行，逐步达到预期目标。

3.现实映射

从现实中提炼、抽象出的，可以是形态、色彩、质感，也可以是运动方式、光学力学特性等物体中最有特征的部分。

比如Google Material Design 的设计风格，灵感来源于纸张和墨水

形态映射：

色彩映射：

质感映射：

运动方式映射：（近实远虚）

 

以上就是关于UI视觉设计趋势与创意设计方法的总结，欢迎酷友们指正！