前端技术|后端技术|网站源码|移动开发|UI设计|数据库|网站设计|网站开发|小程序|每日一句|福利|php知识-学习天地 www.lxywzjs.com
主页 > UI设计 >

2019,这些UI设计趋势值得关注......

时间:2019-07-21  编辑:

对于设计趋势,我们一直都在定期总结和梳理。但是以往的设计趋势总结通常只会聚焦在某个很小的、特定的点上。实际上,在设计越来越现代的今天,其实当下的语境是塑造各种设计趋势的根源,而它几乎是全部趋势的最好概括。我们以往所总结的「设计趋势」大多停留在风格和技法层面上,而现在当你观察设计领域所呈现出来的状态,会发现这些东西都是互相关联的,单独挑出其中的一种趋势,往往有以偏概全的嫌疑。

现在我们设计师所面临的状况,仿佛是所有的技术进步和全部的新工具,正在打造各种产品一齐解决用户所面临的全部问题。

设计越来越系统化,设计师的身份不再局限于视觉呈现这一个层面,对于产品、营销的要求早已成为很多企业招聘的基本要求。更系统的知识、更全面的方法支撑,让设计师能够在产品设计流程中作出更好的决策。

尽管我们还没有达到这个可预期的未来,但是我们仍然向着那个方向坚定不移地靠近着。

我们会将这些明显的设计趋势视作为当下设计不足的一种提醒,密切关注,确保我们能在现有基础上越做越好。下面,看看我们通过持续观察所预测的2019年的设计趋势。

更强的浏览器

毫无疑问,技术的发展让浏览器正在变得近乎无所不能,无论是桌面端还是移动端。

浏览器基础测试所呈现出来的数据,反映出的情况很明显,绝大多数的浏览器在性能上都在飞速地增长着。由于流式编译的流行,使得浏览器的设计和开发的效率越来越高,Mozilla 的报告显示,目前新的编译器比以往优化过的编译器还要快10到15倍。

如今,所有的现代浏览器都支持 WebGL 2 ,它支持全新的3D纹理和对象渲染,边度深度和顶点数组对象。

桌面端和移动端的浏览器正在弥合概念设计和实际可行设计之间的鸿沟,想到就能做到正在成为一件越来越真实的事情。

虽然浏览器本身性能一直在提升,不过浏览器的开发者仍然无法兼顾到全部的网站,尤其是以往设计得比较糟糕的网站。身为设计师应该多了解浏览器,并且尽量去发挥浏览器应有的性能。

目的明确的动画效果

近两年来动画效果的持续升温,这几乎成了设计师的新必修课。而浏览器和硬件的性能提升,使得动画效果近乎无处不在。可是,现在新的问题出现了,那就是设计师不仅要让元素动起来,而且要更加合理地运动。

动效设计是一个典型的多学科交叉之后的产物,设计师不仅要懂得物体运动的物理规则,而且要懂得在 UI 和网页中使用动效的心理学效应。

动效已经不仅仅代表着时尚,它是诸多知识的交汇处,设计师需要通过学习来了解如何合理、正确、有效地呈现动画,传递信息,确保体验,还不会让人厌倦。

以前,界面和界面之间的间隙是无人区,如今是动效设计师的后院。

动效让用户更深层地参与到 UI界面当中,并且每一个交互都更有意义。但是,动效能做的东西更多,UI界面中每个元素的运动和变化都有意义,都会有产出价值,你要怎么驾驭它们?这是2019年需要面对的问题。

哪怕是 LOGO,加入动效之后,都会呈现出不同的样子。你的LOGO 要带有什么样的感觉,传达什么样的情绪,有着什么样的变化?如果都没有,那么你应该想想了。比起简单的布局、光影和材质,动效所传递出来的信息量更大,表现出来的效果更神奇,能承载的故事性是令人咋舌的。那么,为什么不让动效来帮你做点什么呢?

不要太过放飞,还是让动画效果给你产出价值吧。

深度扁平和3D

如今3D建模和渲染已经非常普遍了。不过在此之前,很长一段时间内,为了确保速度和可访问性,设计师尽量在 UI 中少用3D建模和渲染,不过更好的浏览器和应用性能让这一点越来越容易实现和普及。

界面中的3D效果和现实的交叠,创造出一种超现实的质感。

这种设计方法,对于设计项目而言,是非常有用的,借助3D实现可视化效果,它可以兼容各种不同技术流程,并且更容易被用户所理解和接受。

在游戏和电影当中,3D效果有过很普遍的使用,不过它大多运用在较短的关键部位,借助意义明确的动画,3D作为强大的设计工具发挥着作用。如今,在移动端 UI 和网页中,也不是难以做到的。

至于扁平化的 UI 设计,在过去的几年中一直是主流。最近,我们发现扁平化的 UI 元素,在视觉深度上开始发生明显的变化,但是整体风格和使用方式上并没有明显变化。当然,在纵深上的变化,很大程度上是强化层次的象征意味,让用户更容易理解,而扁平依然是核心的特征。

深度扁平,就是新的扁平化设计。

3D 和 CG技术的结合让用户在视觉上感觉仿佛是在和真实内容进行交互,这一点和深度扁平在内核上是一致的。从某种意义上来说,深度扁平也可以算是伪3D ,它是为了营造出真实的质感,而调整出拟真的光影效果(在纵深上)。

另外还有一种伪3D的处理方式,就是使用AE 这样的传统工具,在二维平面上模拟物体在3D的运动方式。

在接下来的2019年,我们有很大的机率会迎来拟物化设计的回归。如果扁平化设计在纵深上足够明显的话,它会更加接近等轴测的效果。如果真的要给未来一年的趋势进行界定的话,应该是保留扁平化设计的趋势,并且在界面中尽力探索还原真实世界的层次和质感。

当然,我们能拥有的选项太少了,要么做的更简单,要么更复杂。想要给人留下深刻的印象,必须是让人感觉印象深刻的,无论是彻底抛弃复杂性,还是使用疯狂的概念,都需要设计师拥有足够的勇气。最重要的始终是界面本身功能明确,否则设计的形式感就失去了意义。

我们可以使用令人深刻的图片,但是如果解决不了用户深层次的问题,还是没用。

超现实主义的设计

更好的性能和更好的技术并不一定能塑造优秀的设计,如果不能产生情感影响,那么技术也解决不了。具有讽刺意味的地方在于,如果你想最大程度地发挥影响力,不一定需要太强大的技术支持。而在设计领域,叛逆的设计一直都显得那么吸引人,这很大程度上是因为它们天然地与其他不同,让人忍不住被吸引。

有时候,我们需要一些不一样的东西来平衡常识,比如让魔鬼站在肩膀上,这样会更好玩。

一些特立独行的插画会让整个设计变得更加有趣:

这些风格独树一帜的 UI插画的目的只有一个:让视觉和内容保持新鲜。在很多同类设计当中,插画的风格称得上是八仙过海各显神通,其中不乏设计得并不好看的,因为它们的首要目标,是用独特的视觉来给人留下深刻的印象,哪怕用的是丑陋的视觉。这些先锋而独特的视觉设计,你会在接下来的2019年看到更多。

不过,并不是所有的设计师或者企业都能接受的路子。这就像之前的粗野主义设计风格,通常是一些大企业和品牌更容易接受这样先锋的设计,而在生死线上挣扎的企业,通常会选择更加稳妥的风格。

渐变 2.0,炽烈的色彩

对于色彩表现力的追求,也是一个非常明显的趋势,从最新的网站配图和配色上,就表现得非常明显。设计师在 UI 的可访问性的探索上,所投入的精力是令人震惊的。

扁平化之后所进化出来的「微妙的渐变」已经无法满足需求了,直接的反映就是大家在渐变的色彩梯度和纵深上,开始更加用力,更加大胆了。

就像之前我们将更加成熟的扁平化设计命名为扁平化 2.0 一样,如今我们也有了渐变 2.0 。所谓的渐变 2.0 也不难理解,使用不冲突的色彩来构建色彩变化,拥有清晰的光源,使用具体的形状或者形体来统筹色彩,构建纵深。

鲜艳的色彩不会平铺满整个屏幕,我们将会看到更加清晰的色彩组合和明确的图层,事实上,即使是单色为主的页面也可以借助渐变 2.0 来创造视觉美感。

更酷的地方在于,鲜艳的渐变色彩在深色系网站当中会变得尤为醒目和富有表现力。

当然,另外一方面,设计师也要考虑到色彩本身的可访问性,在色彩表现力并不那么突出的屏幕上会呈现出的效果,以及对比度过强的配色,会不会对整个页面产生喧宾夺主的效果。追随趋势的同时,注意平衡。

多变的字体

传统上,字体被视作为可有限调整参数的静态对象,设计师在设计字体时候需要仔细考虑字体的笔触和风格,兼顾到整体的视觉体验和可读性。

在需要设计多种字体的时候,字体设计师需要尽量为用户提供全部的字体,确保如今的用户能够实现承诺中的丰富的排版。如今的可变字体可以在一个字体中实现多种效果,让一个字体能够承载更多的变量,字体的粗细变化、类别也更加丰富了。

可变字体在响应式设计中蓬勃地发展着,设计师不得不绞尽脑汁地在不拉伸的前提下给各种屏幕,塞入他们所设计的字体。这仅仅只是一个开始,可变字体在接下来的2019年还会有更多的变化和发展。

Figma

如今,依然有很多人在问这两个问题:

设计师是否还需要学习代码?
开发者是否需要学习用户体验设计?

这两个问题都因为很多设计和开发之间存在割裂。可是,无论是设计师还是开发者都很难真正兼顾到全部的知识领域,好在还有其他的选择。在如今的很多新兴工具当中, Figma 就是其中一种,它让设计师无需考虑操作系统、集成开发环境,不需要管理插件、存储,也不需要管同步和协同的问题。

从某种意义上, Sketch 和 Adobe XD 没有做到的事情,它做到了,Figma 的组件通过 API 转换和 React 组件来进行前端效果的实现,设计师可以在它的帮助下输出实际可用的代码和数字产品。在2019年,这款工具非常值得关注。

Copyright © 2018-2022 php知识-学习天地版权所有
京ICP备17073872号

返回
顶部