随着电子产品的不断丰富,互联网公司竞争的加剧,UI设计也越来越被重视,几年前UI界面设计还是一个很新鲜的名词,但现在UI设计师被越来越多的提及,所有互联网公司都更加重视用户的视觉体验,不得不承认,现在设计的页面比几年前的平面设计作品更符合人们的审美和习惯,体验更好。未来UI设计的竞争还会更加激烈,如果不能抓准大趋势,只能越来越被边缘化。
第一部分:版式设计趋势:
1. Immersive, full-screen video 沉浸式的全屏视频
Campos Coffee的网站使用简单的排版结合动态全屏视频制作了一个简单但有力的内容,在UI设计的世界,图像画面仍然是一个很好的方式来快速抓住用户的注意力。 视觉被认为是所有人类感觉中最强的,并且大的单幅图像能够以更有效、简洁、快速地方式总结语音的讯息和音调。
图像长期以来一直是UI和网页设计的主要内容,它的成功逐渐为视频铺平了道路。视频在数字设计中被越来越多的使用到。 传统摄影是静态的,视频是动态的。
2. Long form content and scrolling 长篇幅滚动翻页网页
滚动的网页绝不是一种新的方式,也绝对不是一个基本功能的“趋势” 用于浏览Web和应用程序。然而,越来越多地看到的是更多在桌面设备和更大屏幕的设备上使用了长篇幅滚动网页来进行信息展现。
在过去几年中,由于用户觉得在较小屏幕设备上滑动翻页更便于查找内容,更多的设计人员开始在较大屏幕上使用长篇幅滚动网页的界面。这允许用户可以以更流畅的动作来非常快速地浏览大量的信息,而不会因为要切换页面而被干扰。 它是一个能够广泛适用的方式,可以用在所有设备和内容媒体上,不管是长篇新闻和新闻故事,还是登陆页面和交互体验,它都可以适用。
3. Gradients and vivid colours 渐变和鲜艳的颜色
2013年,扁平化迅速在各类设计中流行开来,扁平化要求简化UI中的核心功能性元素,从而获得更简洁高效的用户体验。使用扁平化是为了获得更好的用户体验,但是扁平化的迅速流行造成很多设计师设计出的网页都极其相似的现象。 2016年,扁平化的趋势又逐渐显现,更多的品牌和设计师开始强调更加个性的扁平化,尝试鲜亮的颜色和渐变,不再像以前一样一味的强调简单和冷色调。
4. Illustrations 插画
Dropbox是具有强烈插画风格品牌的很好的一个例子。 这种粗犷、手绘的风格让人觉得轻松愉悦,增加了人们对他们产品的信任感。插画能够给人一种别具一格的感觉,这是普通图片很难实现的。 更能贴合品牌特质的定制插画能够使公司更加细致的创建一个真正贴合他们的个性和语调的视觉语言 - 有助于给用户和客户灌输可靠和信任的感觉。
5. Breaking the grid 突破网格
Red Collar Digital的网页是突破网格限制的UI的一个很好的例子
网格长期以来一直是设计师的神器,给那些需要确保一致性、平衡、节奏和顺序的设计提供了基础。 它是用户体验设计中的一个重要工具,因为他们为用户提供了最熟悉的UI体验,使他们能够以一种自然的方式直观地浏览网站或APP。
然而,与网格同样需要重视的一点是:它也限制性的和刚性的制约了设计者的创造性选择。 为了创造突破传统的数字体验,许多网页和UI设计师正在通过“打破网格”来试验布局。
第二部分:色彩趋势:
UI色彩每年都在变,年年都会有微妙的差异性,2017年开始,色彩运用的越来越大胆了,比如新版淘宝,就采用了比较年轻态的渐变色,可以看得出来接下来会有更多的产品会采用丰富饱满的色彩,而色彩的运用呢,也趋于多元化,极简风与大胆扁平渐变色会共存,还有就是界面视觉元素的几何化,点线面的运用呢,会更多。
趋势一:冷暖色相渐变此类在UI中运用的较多,比如新版淘宝就是采用暖色单色相的渐变色,这也是产品界面用色的趋势之一。
趋势二:饱和度较高的纯色这类用色在品牌、插画等领域用的居多,不过在个人网站或创意设计网站慢慢的也多了起来,对于纯色的运用,比如橙色也居多。这类用色如果把握不好色彩之间的平衡度,很容易适得其反。 趋势三:邻近色渐变这类用色,在UI中用的也居多,特别是banner、插画。使用临近色渐变,会给人很微妙的感觉,使得UI更加的细致,一般采用邻近色渐变,会以一种色彩为主,其他色彩为辅,这样看起来,主次比较分明。 趋势四:不同色相的后退色渐变这种冷色调之间的搭配,也是比较常见的形式,一般在web端用的居多些,比如一些官网,会采用这种偏冷静的配色方案,当然啦,在APP中也场景,主要体现在banner或者一些视觉元素上。 趋势五:单一极简用色这类用色在web端居多,而且是在国外越来越多,此类用色跟“点线面”的几何形式配合使用,兼职完美搭配,所以此类用色也会用于banner、平面、品牌的等方面。在APP中还是比较少见的形式,有点过于小众化了,不过这也是接下来的趋势。
趋势六:黑白极简风这类配色,跟上面的很类似,不过灰色调属于中性色,采用极简的形式更有气质。所以现在不少的小众APP均采用单一的灰色调,比如阅读类的APP,这类配色用户在视觉、品牌中也比较多。
趋势七:多色相的渐变渐变用色,前面说到了同色相渐变、邻近色相渐变,多色相渐变在视觉上变现力会更强一些,多色相的配色在web端运用的居多。
趋势八:不同色相、色阶强对比渐变此类配色在这几类里,是最难掌控的,涉及到的内容居多,色相的掌控、色阶的掌控,我们一般看到的此类配色会带来很强的视觉冲击力,不同色相搭配,同色相的色阶差异很大,所以视觉效果更加的立体、饱满。比如Instagram的icon就是个很好的例子。