ncnn 内存节省模式_为什么混合模式可以节省很多精力

ncnn 内存节省模式

Before becoming a UI Designer (still not sure what this actually means), I had been working for years as a Graphic Designer and I remember that joyful moment when I discovered that in Illustrator, I can adjust the (so-called) transparency settings of a layer which, as a result, will interact with the underlying objects from a colour perspective. WOW.

乙 EFORE成为UI设计师(还是不知道这实际上意味着)，我已经工作了多年作为一个平面设计师，我记得快乐的时刻，当我发现在Illustrator，我可以调整(所谓的)透明度设置因此，从颜色的角度来看，它将与基础对象交互的一层。 哇。

This is feature is probably familiar to all of you, but its possibilities had massive effects on my graphical creations since that moment of discovery and while I could talk for hours about how to use them properly, I am here to write about something much more practical and more UX-y too.

大家可能都熟悉这个功能，但是自发现那一刻起，它的可能性就对我的图形创作产生了巨大的影响，尽管我可以讨论几个小时的正确使用方法，但我还是在这里写一些更实用的东西还有更多UX-y。

考虑发展 (Having development in mind)

We may have numerous brilliant (and sometimes even far-fetched) ideas that really contribute to achieving user satisfaction (and creating beautiful interfaces), but we should take into consideration that some ideas might be harder to implement and we should help our coder colleges instead of simply multiplying the time they spend giving birth to our designs.

我们可能有许多很棒的(有时甚至牵强)的想法，这些想法确实有助于提高用户满意度(并创建漂亮的界面)，但是我们应该考虑到有些想法可能难以实现，而应该帮助编码学院简单地乘以他们花在创造我们设计上的时间。

We need to find a way to make deadline-friendly decisions, meaning that both us, designers and our programmer colleges would be pleased with not only the results of our hard work, but the process too.

我们需要找到一种做出对截止日期有利的决定的方法，这意味着我们，设计师和程序员学院都将不仅对我们辛勤工作的结果感到满意，而且对过程也感到满意。

本文的实际主题 (The actual topic of this article)

I have started a new job in November 2019, and the tricky part about it is that I am not only the UX Designer on a project, but I have minor coding tasks too. This way I am able to see both sides of the story which helps me better handle UX-related decisions. Let me share a recent experience with you.

我于2019年11月开始了新工作，其中棘手的部分是我不仅是项目的UX设计器，而且还有少量的编码任务。 这样，我可以看到故事的两面，这有助于我更好地处理与UX有关的决策。 让我与您分享最近的经验。

I have discovered that using design components with multiple state possibilities (hover, checked, active, disabled, focused, marked etc.) can really complicate things, because besides making sure that every change in state is visually obvious, we need to guarantee that the sub-components wrapped into the parent still remain consistent and aesthetically satisfying.

我发现使用具有多种状态可能性(悬停，选中，活动，禁用，集中，标记等)的设计组件确实会使事情复杂化，因为除了确保状态的每一个更改在视觉上都是显而易见的之外，我们还需要确保包裹在父级中的子组件仍然保持一致并且在美学上令人满意。

We have two options. Either we create custom designs (for every single element) for every single state value (and all of their combinations — which will require a lot of time, especially for the developer team) or we simplify the process by changing the blend mode of some child elements with one line of code. This way we will make sure that we avoid lack of contrast, we maintain consistency and we will be ‘rewarded’ for the results.

我们有两个选择。 我们要么为每个状态值(及其所有组合-需要大量时间，特别是对于开发人员团队)创建定制设计(针对每个元素)，要么通过更改某些子项的混合模式来简化流程 一行代码的元素。 这样，我们将确保我们避免缺乏对比，保持一致性，并为结果“获得回报”。

In the first row, the only thing I did was to change the background colour. It is obvious, that everything got messed up. In the second row, I created a second version of the card (so we have a default one and a marked one having blend modes set up), and the 3rd and 4th versions were created only by changing the background colour. Thanks to ‘Difference’ and ‘Color Burn’ in the bottom section, and ‘Multiply’ for some other elements, the correct colours were generated.

在第一行中，我唯一要做的就是更改背景色。 显然，一切都搞砸了。 在第二行中，我创建了卡的第二个版本(因此我们有一个默认版本和一个设置了混合模式的标记版本)，第3版和第4版仅通过更改背景颜色来创建。 多亏了底部的“ Difference”和“ Color Burn”，以及其他元素的“ Multiply”，生成了正确的颜色。

Needless to say, to achieve these results without adjusting transparency settings, the developers would need to work significantly more. But this way we can create a purple, a pink and a brown version in just 10 seconds.

不用说，要在不调整透明度设置的情况下获得这些结果，开发人员将需要做更多的工作。 但是通过这种方式，我们可以在短短10秒内创建紫色，粉红色和棕色版本。

简单CSS解决方案 (Simple CSS solution)

".custom-tag" {mix-blend-mode: overlay;
}

Guess what, Microsoft Edge doesn’t support mix-blend-mode, but every decent browser (Chrome, Safari, Firefox, Opera, Edge Chromium) does.

猜猜是什么，Microsoft Edge不支持mix-blend-mode ，但是每个不错的浏览器(Chrome，Safari，Firefox，Opera，Edge Chromium)都支持。

Don’t be disappointed if you develop in Swift or Kotlin/Java, CSS is not the only programming language (okay, CSS is only a style sheet language) that can handle blend modes.

如果您使用Swift或Kotlin / Java开发，请不要失望，CSS不是唯一可以处理混合模式的编程语言(好的，CSS只是样式表语言 )。

Note: my example was only a corner case of blend mode usage, there are many more scenarios when you should give this technique a try (all the best UI softwares — Figma, Sketch, Adobe XD — have built-in blending features). Do you ever use different blend modes in your designs? Let me know!

注意：我的示例只是混合模式使用的一个极端案例，应该尝试一下该技术的情况还有很多(所有最佳UI软件-Figma，Sketch和Adobe XD-都具有内置的混合功能)。 您曾经在设计中使用过不同的混合模式吗？ 让我知道！

翻译自: https://uxdesign.cc/why-blend-modes-save-us-a-lot-of-effort-9c3bf8d75c1f

ncnn 内存节省模式