深色模式的浪潮逐渐消退,现在只留下两极分化的评论。爱的人放不下,恨的人咬牙切齿。但无论如何,深色模式已经成为移动终端和网页终端的设计标准,七个原则可以让你理解“深色模式”。
基于以下两点,大多数人喜欢深色模式:
1.色彩的高对比会削弱背景,更注重内容展示;
2.新鲜感,黑色视觉效果更酷;
了解这七个原则是更好地设计深色模式UI的关键。
从视觉到设置七个原则
1.使用低饱和度颜色
在深色模式下,界面本身相对较暗,使用明亮的颜色对用户不友好,导致阅读能力差。因此,在设计中需要避免使用高饱和度的颜色。
2.避免纯黑色
虽然人们对深色模式的印象是“黑色”,但纯黑色甚至纯黑色并不是真正展示的好选择。纯黑色会增加对比度,正如第一点所说,会损害阅读能力。
在Material Design——谷歌设计规范,建议使用较深的灰色(#121212)作为背景色。
3.避免阴影
阴影的作用是帮助我们看到视觉层次,然后它们在黑暗模式下并不实用。如果你想在黑暗模式下突出视觉层次,你需要通过颜色、透明度等方式创建界面层次。
4.用色层创造视觉层次
在深色模式下,即使是非100%的黑色也很难看到阴影效果。因此,如果你想突出视觉水平,你需要使用颜色水平来实现它。这类似于绘画素描的逻辑。在多层中,调整对立面的颜色深度、亮度和透明度是实现视觉水平的关键。
5.遵循设计规范
苹果和谷歌的设计规范包含了深色模式的所有主要平台的原则。根据其设计规范调整设置,以确保设计内容符合主流生态系统。
点击查看Apple和Google设计规范:
●深色模式-iOS
●深色模式-macOS
●Google-黑色主题
6.检查对比度
深色模式中的对比度很容易被忽略。根据大多数设计习惯,文本将通过调整颜色深度或自重来显示。直接效果是辅助内容的颜色较浅,字体较轻。
在深色模式下,这种调整往往会失效,过浅的文字看不清楚,破坏可读性。因此,对比度的敏感性在深色模式下尤为重要。
7.用户自由开关
最后,将深色模式的使用权交给用户决定是非常重要的。
正如一开始所说,关于深色模式的公众舆论存在严重的两极分化。因此,为深色模式设置灵活的开关方案,让用户可以自由选择是否使用。
谈完设计原则后,我们来谈谈设计工具。
在需要深色模式开发的背后,通常会有一个数字化的生产和研究团队,设计师只是团队的一部分。
在团队发展中,设计师最重要的只有两点:“专业工作+团队合作”
复制DT是一种更了解中国设计师的UI设计工具
●Sketch/无缝迁移Figma,轻松继承设计资产。
●实现灵感的专业矢量设计工具和丰富的层效果。
●设计稿一键发布到复制客户合作平台,团队无需切换工具即可轻松评审查看,开发一键下载切割图。
●免费使用!没有时间限制,没有数量限制!
以上是小编今天分享的七个原则,让您了解“深色模式”。我希望这篇文章能对那些想要零基础学习UI设计的人有所帮助。学习是一个漫长的过程。如果你想更快地学习UI设计,你可以来优曼UI设计培训班学习,让你更快地掌握UI设计技术,7天的免费试用体验。