梯度下降证明
When Instagram debuted their new minimalist logo in 2016, it featured a bold and bright gradient that immediately found itself at the bottom of an internet dogpile. What was once a nod to the leather-backed analog cameras that inspired the film-processed filters (and inspired countless wannabe hipster photographers) was now trying a little too hard to be modern and new-aged.
当Instagram在2016年首次推出其新的极简主义徽标时，它的特点是醒目明亮的渐变效果，立即在互联网的最底层出现。 曾经受到皮革支持的模拟相机的致敬，这激发了胶片处理过的滤镜(以及无数的想成为时髦摄影师的灵感)，现在却正努力地尝试现代化和新时代。
I myself remember remarking on how unsophisticated it seemed and reveled in reading the internet collectively dunk on the designers. According to the hive mind of online forums, these designers did nothing but slap on a preprogrammed Microsoft Paint gradient and call it a day.
我本人记得曾经评论过它看起来多么老练和陶醉于阅读互联网上集体灌篮的设计师。 根据在线论坛的顽固思想，这些设计师只不过是对预先编程的Microsoft Paint渐变打了个巴掌，就称之为“一日游”。
In hindsight, it seems that we were the fools. In the four years since Instagram’s redesign, we have come to love the new look and see the artificial bevels of the analog camera as dated and amateurish. Precipitated by the minimalist aesthetic of iOS 7's debut in 2013, gradients have taken over the mainstream visual design aesthetic and continue to influence everyone from high-profile tech companies to social media startups.
事后看来，我们似乎是傻瓜。 自从Instagram重新设计以来的四年中，我们开始喜欢这种新外观，并看到过时和业余的模拟相机的人造斜角。 受iOS 7于2013年首次亮相的极简主义美学所吸引，渐变色已取代了主流视觉设计美学，并继续影响着从高知名度的科技公司到社交媒体初创公司的所有人。
Even if a gradient isn’t at the center of the logo or design, odds are that one is featured elsewhere in interface whether it’s the backgrounds, buttons, or icons. This is especially true in the world of mobile app design where nearly every splash page showcases a colorful gradient, inviting the user in with a warm and welcoming huge.
即使渐变不在徽标或设计的中心，也很可能在界面的其他位置显示渐变，无论是背景，按钮还是图标。 在移动应用程序设计世界中尤其如此，几乎每个启动页面都展示出丰富多彩的渐变，从而吸引用户的热情好客。
There is a good reason for this resurgence of gradients, however. With the resolutions and clarity of modern devices, we can see more colors than ever on our smartphones, laptops, and televisions, providing us with a visual treat every time we open our daily apps or surf the internet. They can add visual depth to an otherwise boring background and do so without expensive photography or illustrations. Furthermore, they’re infinitely flexible allowing it to conform to nearly any design context with some simple CSS implementation.
但是，这种梯度的重新出现是有充分的理由的。 借助现代设备的分辨率和清晰度，我们可以在智能手机，笔记本电脑和电视上看到比以往更多的色彩，从而在每次打开日常应用程序或浏览互联网时为我们提供视觉享受。 他们可以将视觉深度添加到原本无聊的背景中，而无需昂贵的摄影或插图。 此外，它们具有无限的灵活性，可以通过一些简单CSS实现使其几乎符合任何设计上下文。
The question remains though, will we one day look back on these logos and trends with the same disdain as we did with Instagram in 2016 or as we did with parachute pants in the 1980’s?
但是问题仍然存在，我们是否有一天会像2016年使用Instagram或1980年代使用降落伞裤一样，不屑一顾地回顾这些徽标和趋势？
In short, probably yes to some degree. As it happens, designers are already getting tired of gradients as we’re seeing a resurgence of more well-defined, amorphic color blobs imitating the movement and feeling that comes from gradients. Inspired more by Google’s Material Design philosophy, designers and users alike enjoy the contrast inherent in these new designs and if nothing else, it’s a change of pace from what we have been seeing for the past seven years.
简而言之，在某种程度上可能是肯定的。 碰巧的是，设计师们已经对渐变感到厌倦，因为我们看到了越来越清晰的，无定形的彩色斑点的出现，它们模仿了渐变带来的运动和感觉。 受到Google的材料设计哲学的启发，设计师和用户都喜欢这些新设计的内在对比，如果没有别的，这与我们过去7年所看到的相比已经有了很大的变化。
Of course, the waxing and waning of trends in any industry is nothing new. Clothing trends come in and out of fashion and our recent obsession with the ’80s has been made clear by popular shows such as Stranger Things. What are designers to do then? Keep pace with modern trends through continual redesigns and trend forecasting or adopt a more longterm approach?
当然，任何行业趋势的日新月异都不是什么新鲜事。 服装的流行趋势日新月异，而我们最近对80年代的痴迷已经通过诸如Stranger Things之类的流行节目得以阐明。 那设计师要做什么？ 通过持续的重新设计和趋势预测来跟上现代趋势，还是采用更长期的方法？
The answer to this question largely depends on your goals as a designer and for the product but a middle ground does exist those looking to create great modern designs that won’t become a novelty in a couple of years.
这个问题的答案很大程度上取决于您作为设计师和产品的目标，但是那些寻求创建出色的现代设计并在未来几年内不会成为新颖的人确实存在中间立场。
Focus less on the trend and more on the utility.
少关注趋势，而多关注实用程序。
The trend exists for a reason and designers need to be aware of the utility behind the trend and what the benefit is to the user. So when you are designing an interface and feel the need to utilize a gradient, do so with these three principles in mind to ensure your design remains relevant and impactful for years to come.
趋势存在是有原因的，设计人员需要意识到趋势背后的效用以及对用户有何好处。 因此，当您设计界面并感到需要使用渐变时，请牢记这三个原则，以确保您的设计在未来几年内保持相关性和影响力。
1.了解你的动机 (1. Know Your Motivation)
As with every other aspect of the design, gradients need to have a specific motivation and not used simply because it’s a trend. Every implementation should be founded in research and a proper understanding of the target audience.
与设计的其他各个方面一样，渐变需要具有特定的动机，而不能仅仅因为它是趋势而被使用。 每种实施方式都应建立在研究和对目标受众的正确理解的基础上。
Part of this process is identifying the brand adjectives that you want the product to embody and can often include emotions that you might want the users to feel. Due to the abstract and minimalist nature of gradients, they can be a great tool in communicating and reinforcing these emotions with supreme efficiency.
此过程的一部分是确定您希望产品体现的品牌形容词，并且通常可以包含您可能希望用户感受到的情感。 由于渐变的抽象和极简主义性质，它们可以成为以最高效率传达和增强这些情绪的绝佳工具。
If you’re creating a meditation app and want to convey the calming sensation of the ocean tide, reach for a gradient that captures the same hues and consistent movement of the ocean waves. If you’re creating a health and fitness app and want to inspire users to get up and go, reach for a variety of bright and energetic tones with quick stops in between. Referencing real-world images is a great way to start with this approach.
如果您要创建冥想应用程序，并想传达海浪的平静感觉，请尝试一个渐变，以捕捉相同的色调和海浪的一致运动。 如果您要创建健康和健身应用程序并希望激发用户起床和走动，请在它们之间快速停下来，尝试各种明亮而充满活力的音调。 引用真实世界的图像是从这种方法开始的好方法。
2.这是旅程，而不是目的地 (2. It’s The Journey, Not The Destination)
Just because two colors work well together in a traditional color palette doesn’t mean that the spectrum in between is going to be just as inspired. When picking which tones to use in your gradient you need to realize that the impact of the gradient lies in the journey between them and not in the colors themselves. On a two-tone, linear-gradient your chosen colors serve only as the bookends to the larger narrative.
仅仅因为两种颜色在传统调色板中可以很好地协同工作，并不意味着两者之间的光谱将同样受到启发。 在选择要在渐变中使用的色调时，您需要意识到渐变的影响在于它们之间的行程而不是色彩本身。 在双色调线性渐变中，您选择的颜色仅用作较大叙事的书挡。
Often the journey in between these colors can be boring, muddled, and downright ugly. In these cases, adding a third or even fourth complimentary tone can mediate these awkward transitions and bring new life to your design.
这些颜色之间的旅程通常很无聊，混乱并且彻头彻尾的丑陋。 在这些情况下，添加第三甚至第四互补音可以调解这些尴尬的过渡，并为您的设计带来新的活力。
Additionally, making adjustments to the direction, proximity, and opacity of the stops within your gradients will help you better communicate the story within your colors. The Mesh tool in Illustrator is a great resource for designers as it allows for freeform customization of these elements, resulting in gradients that evoke the right emotion while looking handcrafted and wholly unique. Take a look at how Hulu and Spotify implement these principles to get pages that feel more like a watercolor painting than a computer-generated background.
此外，对渐变中色标的方向，邻近度和不透明度进行调整将有助于您更好地传达色彩中的故事。 Illustrator中的“网格”工具对于设计师来说是一个很好的资源，因为它允许对这些元素进行自由形式的自定义，从而产生渐变，在看起来手工制作且完全独特的同时唤起正确的情感。 看一下Hulu和Spotify如何实现这些原理，以使页面看起来更像一幅水彩画，而不是计算机生成的背景。
3.要微妙 (3. Be Subtle)
Keeping in the spirit of minimalism, less is often more with gradients. Exercising restraint in your colors and transitions can mean the difference between being obnoxious and sophisticated. Sometimes all that you need is a slight shade change to give your gradient the depth that it needs or a slight tint adjustment to imitate a light source, giving it a more grounded feeling.
秉承极简主义的精神，渐变往往少花钱多。 在颜色和过渡上行使克制可能意味着讨厌和老练之间的区别。 有时，您需要做的只是稍微改变阴影以使渐变达到所需的深度，或者稍微调整色调以模仿光源，从而给人一种更加扎根的感觉。
In general, the flashier you are with gradients or the more you lean into the trend, the more you are tied to the temporality of that trend.
通常，梯度越闪耀，或者您越倾向于趋势，就越倾向于该趋势的时间性。
If you did a double-take at the Lyft app icon earlier in this story you may have doubted if there was a gradient present at all. In fact, there is a gradient but it is ever so subtle. It presents Lyft’s brand color in a clear and consistent way but with an understated accent around the letterings and corners, resulting in a more visually engaging app icon that isn’t yelling for your attention.
如果您在本故事前面的Lyft应用程序图标上进行了两次操作，您可能会怀疑是否存在渐变。 实际上，存在一个渐变，但是它是如此微妙。 它以清晰一致的方式呈现Lyft的品牌色彩，但在字母和角处带有低调的重音，从而使应用程序图标更具视觉吸引力，并没有引起您的注意。
Gradients are an incredible tool in our design toolbox, the trick is just to know when to reach for them and how to use them. Drop your thoughts in the comments below on how you have been using gradients recently and what tricks you’ve found to be most effective.
渐变是我们设计工具箱中令人难以置信的工具，诀窍只是要知道何时可以使用它们以及如何使用它们。 将您的想法留在下面的评论中，以了解您最近如何使用渐变以及发现最有效的技巧。
Can’t get enough of gradients? Check out these other great articles on UX Collective.
无法得到足够的渐变？ 在UX Collective上查看这些其他精彩文章。
翻译自: https://uxdesign.cc/designing-future-proof-gradients-97121f1bc903
梯度下降证明
6304
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
