超全面总结!2017年UI设计领域流行过这21个设计趋势

1、功能性极简主义

不少移动端APP和网站开始基于极简主义设计风来设计,而极简主义本身并非关注所有的信息,而是通过减少非关键信息来突出特定的内容,它是有着极强的功能性和偏向的。它有着如下的特征:

  • 简单明晰
  • 富有表现力的视觉层次
  • 对比明显的比例控制
  • 每个元素都有功能
  • 大量的留白
  • 对核心细节的高关注度
  • 优秀的排版设计
  • 去除非功能性的装饰元素

2、粗野主义风格

粗野主义设计在2017年非常火爆,采用这种风格的UI,致力于使用更加明亮的色彩,质朴甚至原始的设计元素,借助复杂的布局和反模式的排版,还原早期网页设计的特征,甚至制造出上世纪八九十年代的质感。它有着非常明显的独创性,不管你喜欢不喜欢,它都是无法被忽略的一种流行设计风格。

3、字体和图片的融合

大胆地将虚拟的字体和真实的图片融为一体的设计也是去年流行的设计手法,这种设计手法让字体拥有了融入真实场景的视觉体验,协调而赏心悦目。

4、带动效的首图Banner

在网页中,首图Banner 是最为吸引用户的内容,他们不仅在视觉上足够突出,而且能够传递信息,传达情绪,强化主题。动效的加入,让首屏的Banner图更加吸引人,富有更强的吸引力。

5、自定义主题的插画

插画有着极强的可定制性,这也使得它越来越多地出现在UI和网页设计中,它不仅更容易被用户所感知,可以更好地承载创意,也可以带来更加可控的风格和调性。此外,优秀的插画还能干删用户体验,提高可访问性。

6、全屏式布局

如果你仔细观察,会发现许多设计师都热衷于使用全屏式的布局,让图片和视频等视觉元素不再受到边框的限制,这样的布局更加宽敞,不会有打破界限的感觉。

7、多样的UI动效

在动效设计这件事情上,你会发现它在2017年越来越成熟了,融入交互的动效越来越圆融,用户体验引人入胜的APP也越来越多了。接下来,UI动效还会越来越优秀。

8、对UI友好的品牌设计

2017年许多著名的品牌都针对自家品牌进行了重设计,被重新设计之后,这些品牌的LOGO等元素都得到了不同程度的简化,并且针对数字化产品进行了优化,对于UI更加友好,而且几乎每个品牌都制作了动态版本的LOGO。

9、单色UI

为了让UI和产品的功能性更强,不少设计师倾向于使用单色配色方案,这样设计出来的UI确实看起来更加时尚,最关键的是单色配色之下,内容更加突出,用户更不容易被分心。不过,设计师需要投入更多的时间来打磨设计,避免整个UI变得乏味。

10 、深色系背景

深色系的背景通常能够创造出更加优雅、更具有形式感的设计,也能让设计出来的实际效果在不同的环境下有更加一致的体验。相比之下,采用这样设计的大多是数字产品页面,而非以文本为主的网站。

11、浅色的文本背景

这是和深色系背景相伴出现的一种设计趋势,通过白色或者浅色的区块来承载文本,确保文本内容的可读性,还保持了整体的优雅。

12、成熟而对比强烈的字体搭配

越来越多的新字体进入设计师的视野,许多经验丰富的设计师都特别重视字体的搭配。在2017年我们看到了许多优秀的衬线体+非衬线体的字体组合,它们不仅创造了良好的对比度,而且让整个排版设计的层次感更加显著。

13、实验性的栅格系统

设计师的创意越来越强了,即使是栅格也能玩出新花样。通过自定义创造出实验性的栅格系统,设计师在此基础上能够创造出更加灵活原创的布局,创造性地使用各种视觉元素。不过,实验性的栅格系统通常都需要多次迭代和测试,确保可用性。

14、多样的着陆页设计

在2017年,着陆页开始以多种多样的方式呈现出来,无论是企业网站还是电商网站,在着陆页的设计上也越来越实在,开始越来越多地关注用户最在意的问题,着力提升着陆页的转化率。通过市场调研和测试,着陆页的设计也越来越友好,灵活的原创近乎随处可见。

15、创意十足的视差设计

视差滚动依然在流行,滚动毕竟是最省心最自由地交互方式,视差滚动本身能够促进用户持续不断地交互,这也使得多样而富有创意的视差在网页和移动端APP中大规模地使用。

16、用视频内容促销

视频内容的普及是我们大家都有目共睹的大趋势,这也使得视频内容成了营销和运营人员的最爱,越来越多的视频促销内容开始出现。视频内容可以结合视觉和听觉对用户产生作用,而动画和平面设计的内容也同样可以适当地融入其中,更好地服务于产品,提升转化率。

17、UX的游戏化设计

游戏化设计对于产品体验的提升是明显的。不仅仅提升了产品的娱乐性,而且让产品更贴合用户需求和人性。挑战,奖励,积分,成就系统,徽章,排行榜,社交媒体机制,等等等等,所有的这些都提升了用户的参与度,对于UX的提升是毋庸置疑的。

18、卡片式布局元素

卡片式布局的优势在于它的自由度,它足以承载各种类型不同功能的元素和模块,拥有着统一的美学特征和易于阅读、易于交互的特点,为更为协调的设计作出了不小的贡献。

19、风格化的几何元素

几何元素有着不俗的装饰性,而且它可以和不同的设计风格搭配起来,让整体设计的视觉饱满度和体验有所提升,不同的几何元素还能营造不同的情绪和氛围。

20、实验性的配色方案

设计师对于色彩的探索从未停止。实验性的配色方案通常都不会太完美,但是由于色彩本身会传递出不同类型的情绪,实验性的配色通常由于其独特性,而能够传递出更为强烈的情绪和独特的体验。

21、不再使用乱数假文

现如今对于UI设计的要求越来越高了,以往在设计阶段,设计师会用乱数假文(Lorem Ipsum)来填充内容,但是现在大家已经开始有意识地使用真实的内容来填充界面,确保视觉到内容都有真实感。

结语

毫无疑问2017年是UI设计多样化的一年,各种各样的设计趋势层出不穷,这一点足见设计师们的探索之心。漂亮的视觉,舒适的体验,流畅的动效,自然的声音,如今的UI设计的要求真的是越来越高。在2018年,上面所提到的21个趋势当中有一些可能会被淘汰,但是绝大多数应该会得到保留。为了更好的设计,世界范围内的设计师都会不遗余力地前进和发现。

原文发布于微信公众号 - 交互设计前端开发与后端程序设计(interaction_Designer)

原文发表时间:2018-03-14

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏我分享我快乐

什么!要用毛笔字效果!不会啊?也不能字体侵权!

前言:学生们在学习ps软件的过程中非常的认真与努力,所以对于软件的使用可以说已经很熟练了,可是为什么当我们给学生安排一些原创设计需求的时候,学生却有种无从下手的...

44180
来自专栏BestSDK

正确的配色多重要?直接影响产品转化率

首先看两张图,感受下配色的重要性。 “看这张,是不是很有食欲?” ? “那这张呢?” ? “没上张让人有食欲。” 其实每个人的心里,都有一张色彩心理学。 ? ...

30540
来自专栏吉浦迅科技

Hunter 使用AMD专业显卡制作《中国梦之声》

Ventuz 和 AMD — 软件和硬件的 强强联合 Hyoga 说,“Ventuz 是一款实时多媒体制作软件,可以制作动画,可以添加字幕,的确非常强大。我们用...

28950
来自专栏SDNLAB

Dell EMC表示新交换机可以轻松转向软件定义网络

Dell EMC推出了一款新的交换机,据称它采用了现代网络,正从架构上转向技术解耦和软件定义网络(SDN)。

15810
来自专栏腾讯大讲堂的专栏

极客公园 & 腾讯大讲堂 [ 走进腾讯 ] 活动精华回顾

[核心提示] 微信表情背后有着怎样的发展沿革?产品如何通过交互设计来把理念传达给用户? 编者注:7 月 19 日,由极客公园联合腾讯大讲堂开办的公开课「走进腾...

315100
来自专栏進无尽的文章

移动端APP设计趋势

移动端APP在2017年经历了诸多的变化, 人工智能、聊天式的界面、响应式设计、虚拟现实(VR)和增强现实(AR)让设计师不断面临新的挑战。研究表明,用户每天耗...

19220
来自专栏即时通讯技术

腾讯音视频实验室:使用AI黑科技实现超低码率的高清实时视频聊天

自从苹果公司在iPhone 4引入了视网膜屏幕的概念以来,手机的分辨率自此开始突飞猛进。当前,1920x1080甚至更高的分辨率已经成为了标配。不过当我们谈到实...

36730
来自专栏ATYUN订阅号

Adobe宣布了其人工智能平台Adobe Sensei的新功能

Adobe Sensei是Adobe公司推出的一个基于深度学习和机器学习的人工智能平台,可以应用在Photoshop、lightroom等软件中登录,登录后Ad...

40560
来自专栏我分享我快乐

扁平人物头像绘制教程

前言:学生们在学习ps软件的过程中非常的认真与努力,所以对于软件的使用可以说已经很熟练了,可以为什么当我们给学生安排一些原创设计需求的时候,学生却有种无从下手的...

41270
来自专栏VRPinea

《Raw Data》开发商的第三大作,音乐路线是否同样走得溜?

带上头显,瞬间进入一艘充满未来主义色彩的“太空飞船”中,炫酷的天花板、垂直的窗户、迷幻的隧道、超具动感和线条美的科幻场景充斥着双眼,一个完整的DJ舞台呈现在面前...

9720

扫码关注云+社区

领取腾讯云代金券