界面设计 视觉层次
重点 (Top highlight)
The recent plethora of software and tools — Sketch, Figma, Adobe’s Creative Cloud, Cinema 4D, Redshift, etc.— is making design accessible to more and more people, and enabling designers to translate and emphasize their vision in any shape or form.
最近使用的大量软件和工具( Sketch ， Figma ， Adobe的Creative Cloud ， Cinema 4D ， Redshift等)使越来越多的人可以使用设计，并使设计师能够以任何形状或形式来翻译和强调他们的视觉。
I can see these trends not only sticking but being used together in creative ways across the web and in many mobile applications. If used correctly, the combination of 3D illustrations, animations, and custom assets can provide users with an elegant flow. These are three trends that not only go well together but also individually.
我看到这些趋势不仅持续存在，而且以创造性的方式在网络上和许多移动应用程序中一起使用。 如果正确使用，则3D插图，动画和自定义资产的组合可以为用户提供优雅的流程。 这是三个趋势，它们不仅可以很好地融合在一起，而且可以很好地融合在一起。
3D插图 (3D Illustrations)
Thanks to several Instagram experiments conducted by 3D enthusiasts, 3D became increasingly popular in 2019. 2020, however, will be an even bigger year for 3D illustration in design.
得益于3D爱好者进行的多个Instagram实验，3D在2019年变得越来越流行。然而，对于3D插图设计来说，2020年将是更大的一年。
The prevalence of 3D illustrations is primarily because of more powerful tools such as OctaneRender, RedShift, etc. as well as cheaper graphics and video cards.
3D插图的盛行主要是因为功能更强大的工具(例如OctaneRender ， RedShift等)以及更便宜的图形和视频卡。
More powerful software and cheaper cards are allowing artists from different domains to experiment with 3D designs.
更加强大的软件和更便宜的存储卡使来自不同领域的艺术家可以尝试3D设计。
There are a million ways of conceptualizing flat design into 3D. I can see designers reimagining old ideas to form new experiments in the following ways:
有数百万种将平面设计概念化为3D的方法。 我可以看到设计师通过以下方式重新构想旧思想以形成新实验：
- Illustrations for SMBs, corporates, and hi-tech (AI, machine learning, big data, etc.) and IT-related companies 适用于中小型企业，企业和高科技(AI，机器学习，大数据等)和与IT相关的公司的插图
- Illustrations and animations for children 儿童插画和动画
- Geometric primitives (prims) for experimental illustrations 用于实验插图的几何图元(素数)
A few years ago, a web designer’s toolkit wouldn’t have consisted of any 3D software. Today’s designers, on the other hand, are learning illustration, photography, Cinema4D, animation, etc.
几年前，Web设计人员的工具包不会包含任何3D软件。 另一方面，今天的设计师正在学习插画，摄影，Cinema4D，动画等。
Designers have come a long way and I love to see them slowly maturing into superheroes!
设计师已经走了很长一段路，我喜欢看到他们慢慢地成长为超级英雄！
动画制作 (Animations)
In today’s fast-paced technological era, animation and motion graphic trends have certainly retained their pace. Recent advancements — many which were once considered impossible — in the 3D technology space have opened the doors to extraordinary possibilities.
在当今快节奏的技术时代，动画和动态图形趋势的发展必将保持其步伐。 3D技术领域中的最新进展(曾经被认为是不可能的)为许多可能性打开了大门。
2019 showcased a trend of 2D and 3D blends, empowering designers to add an extra layer of information in their art. Designers could now start creating more intricate objects and patterns by leveraging the combination of both 2D and 3D. This trend of using 2D and 3D in a fluid motion has allowed designers to create more realistic visuals and will certainly continue this year.
2019年展示了2D和3D混合的趋势，使设计师能够在其艺术作品中添加更多信息。 设计人员现在可以通过利用2D和3D的组合来开始创建更多复杂的对象和图案。 在流体运动中使用2D和3D的趋势使设计师可以创建更逼真的视觉效果，并且今年肯定还会继续。
In 2019 we noticed web animations being used in imaginative ways. A key example is Apple’s AirPods Pro page:
在2019年，我们注意到以富有想象力的方式使用了Web动画。 一个重要的例子是Apple的AirPods Pro页面 ：
2020 will undoubtedly witness an increase in transitions and scene-builds on the web, mainly due to exciting, new JavaScript libraries such as ScrollMagic. js, Three.js, Anime.js, Mo.js, Velocity, Scroll Reveal and so forth.
毫无疑问，2020年将见证Web上过渡和场景构建的增加，这主要归功于令人兴奋的新JavaScript库，例如 ScrollMagic。 js ， Three.js ， Anime.js ， Mo.js ， 速度 ， 滚动显示 等等。
I created my personal website using ScrollMagic, which is extremely light, yet powerful. Despite heavily relying on this library, I was able to achieve excellent web performance:
我使用ScrollMagic创建了我的个人网站 ，该网站非常轻巧但功能强大。 尽管严重依赖此库，但我仍然能够实现出色的Web性能：
Tools like SwiftUI will also empower iOS designers to code animations with tremendous ease. Here’s an animation that I created using SwiftUI in less than ten minutes:
SwiftUI之类的工具也将使iOS设计人员能够非常轻松地编写动画代码。 这是我用SwiftUI在不到十分钟的时间内创建的动画：
Such libraries and tools allow for complex 2D and 3D animations with good performance. Designers have started to create remarkable visuals, which developers can now easily code, in extremely creative ways.
这样的库和工具允许具有良好性能的复杂2D和3D动画。 设计师已开始创建出色的视觉效果，开发人员现在可以以极富创意的方式轻松编写代码。
Animations can seem like a shiny new toy, but we need to tread with caution. Overdoing animations can not only hurt the user experience but also performance.
动画看似是一个闪亮的新玩具，但我们必须谨慎行事。 过度动画不仅会损害用户体验，还会影响性能。
自定义与库存图片 (Custom vs. Stock Images)
Late 2019 witnessed a surge in custom illustrations, especially in commercial design. This trend has indeed carried over to 2020.
2019年末见证了自定义插图的激增，特别是在商业设计中。 这一趋势确实延续到了2020年。
Although a couple of years back, it was hard to persuade clients to adopt illustrations tailored to their business or industry, it has now become the industry standard.
尽管几年前，很难说服客户采用适合其业务或行业的插图，但现在它已成为行业标准。
Stock images usually apply to generic objects, those that are easy to visualize. With the rise of AI, blockchain, big data, and machine learning, custom illustrations have become the de facto of modern web and UI design.
股票图像通常适用于易于可视化的通用对象。 随着AI，区块链，大数据和机器学习的兴起，自定义插图已成为现代Web和UI设计的事实。
Skeuomorphism — the design concept of making items represented resemble their real-world counterparts — was a prominent trend when the iPhone first launched. It has since faded into oblivion. Nowadays, skeuomorphism is used in game design and/or rich media.
当iPhone首次推出时，拟物化(使物品具有代表性的设计概念与现实世界中的同类物相似)是一个突出的趋势。 从那以后它就消失了。 如今，拟态被用于游戏设计和/或富媒体中。
Designers realized that simple and easy-to-understand styles do a much better job of narrating a story. Clean styles also empower designers to frame unique illustrations.
设计师意识到，简单易懂的风格在叙述故事方面做得更好。 简洁的样式还使设计师能够构图独特的插图。
那么，有什么要坚持的呢？ (So, What’s Going to Stick?)
The only thing I’m sure about is being unsure. My predictions are based on mere observations, analyzing thousands of websites, designs, illustrations, etc.
我唯一能确定的就是不确定。 我的预测仅基于观察，分析了数千个网站，设计，插图等。
There’s currently a huge craze around neumorphism (soft UI), which is good for small apps like Music Player or Calculator. To achieve a neumorphic effect, all you need to do is tweak three shades of the same color to your liking:
目前，关于神经变形 (软用户界面)的需求非常旺盛 ，这对像Music Player或Calculator这样的小型应用程序非常有用 。 要实现亚变态效果，您需要做的就是根据自己的喜好调整三个相同颜色的阴影：
- The light shade for the top left corner drop shadow 左上角阴影的浅色阴影
- The medium shade for the background and color of the shape 形状的背景和颜色的中等阴影
- The dark shade for the bottom right drop shadow 右下角阴影的深色阴影
I recently created a concept for a Neumorphic Music Streaming Service based on the technique I’ve described above:
我最近根据上述技术为Neumorphic Music Streaming Service创建了一个概念：
Neumorphism is in its nascent stages, so I cannot be certain that it will stick. We need to allow it to grow and be incorporated into real-world applications.
神经同质化还处于新生阶段，所以我不确定它会坚持下去。 我们需要让它成长并整合到实际应用中。
For now, neumorphism isn’t a replacement for the flat design trend; it’s simply an addition.
目前，同质化还不能替代平面设计趋势。 这只是一个补充。
Gradients were also a fad back in the day. Many were unsure whether they will stick. But, today gradients graciously fit into UI design, providing elegant UX.
渐变色在当时也很流行。 许多人不确定他们是否会坚持下去。 但是，如今渐变非常适合UI设计，提供了优雅的UX。
I’m eager to see what trends designers adopt this year and how they combine several techniques to provide stellar user experiences.
我很想看看设计师今年采用的趋势以及他们如何结合几种技术来提供出色的用户体验。
翻译自: https://uxdesign.cc/visual-trends-that-ui-designers-should-keep-an-eye-on-e622d9086310
界面设计 视觉层次