UI界面

iOS14和macOS Big Sur对UI设计意味着什么?

随着iOS14和macOS Big Sur的推出,我们见证了UI Design的下一个重要风格趋势。虽然改变并不像7年前的iOS那样具有革命性,但是无疑它们都呈现了UI设计人员未来将要遵循的设计趋势!而macOS Big Sur是进十年来mac系统最重大的一次界面更新,其实更多的是在细节上相对iOS14的一种系统设计上的统一。

扁平设计不再流行

首先让我们说清楚-简约并不意味着扁平。有些人倾向于将这些术语用作一件事是不对的。新的Apple操作系统依然保持着极简主义,但是它们的外观细节上获得了更多阴影,纹理和3d形状。正如苹果公司人机界面副总裁Alan Dye所说的——“深度,阴影和半透明性用于创建层次结构,新材料丰富而充满活力……” Apple降低了视觉复杂性,并使设计更加简约。有些元素比较扁平,但感觉却相反。

新的细微功能

人脑是需要一个提示来识别物体,我们称之为反馈设计,这是人机交互中非常重要的一个环节,这也是为什么许多按钮仍带有阴影的原因。但是,这版本的macOS工具栏图标丢失了形状以消除视觉复杂性,所以重塑后的反馈会鼓励用户去操作。

对于设计师来讲,不要害怕不强调所有选项,并非每个按钮都需要具有形状。只要设计足够的反馈一样可以起到被点击的效果,例如当用户将鼠标悬停在其表面上时,可能会出现更多的色彩更有趣的动画,并尽可能消除视觉上的复杂性。

制作数字材料

从Google的Material Design开始,向我们展示了digital paper的愿景,然后Microsoft引入了Fluent Design,它具有多种数字纹理的概念。看起来苹果遵循了。

这是一个很好的决定,因为数字材料比原始像素正方形更令人愉悦。它们使用户界面更加人性化。发挥数字材料的概念。使用深度,阴影和半透明来创建视觉层次。如果您还不熟悉Material DesignFluent Design System,请阅读他们的指南以了解概念。

细微的效果营造出质感

有些微小的细节会有所作为。对于设计师来说,主要可见的东西是下一代模糊效果-称为渐进模糊。这是关于使模糊级别渐变,而不是将其隐藏在不透明度或阴影下。

了解在新OS的何处以及如何使用渐进式模糊。考虑一下如何将其应用到您的设计中。哪些设计工具现在可以达到这种效果?

“深度,阴影和半透明性用于创建层次结构。” –艾伦·戴(Alan Dye)

图标中的新拟态

在过去的几年中,macOS风格使应用程序图标扁平化,并以圆形符号围绕符号。这已经改变了!现在,大多数图标都具有“类似于iOS的形状”,但它并不平坦。它是拟态的!我个人认为,macOS中的许多新图标看起来都很漂亮,但有些图标的设计不是那么好(例如Stock应用程序图标)。浏览新图标的库。了解其他阴影和渐变如何改变完全适合Big Sur图标样式的平面iOS图标的感觉。考虑对某些元素使用3D形状。

使用小部件显示即时信息

iOS 14为小部件带来了全新的方法。它们直接显示在主屏幕中。这些小部件在iPad OS上看起来几乎相同,并且与macOS Big Sur上的新部件非常相似。Apple建议我们将小部件集中在一个组件上。仅显示与之相关的信息,仅此而已。显示随时间变化的动态信息也很重要,因为小部件不仅仅是为了打开应用程序。考虑您应用中的哪些信息对用户来说最重要。这种类型的内容可能是有用的小部件的基础。尝试直接在主屏幕中显示的小部件的新尺寸(小,中和大)。记住,要支持黑暗模式!

生态系统整体方法

所有Apple Systems iOS,iPadOS,macOS甚至watchOS都可以作为单个生态系统工作。他们具有相同的字体,图标和几乎相同的视觉样式。一致性使用户感到熟悉和自信。它建立了更多的信任并与品牌建立了更好的联系。如果要创建可用于所有设备的全渠道解决方案,请观察Apple应用程序如何在平台之间发生变化。哪里保持一致性?在哪里进行更改?哪些功能已添加到不同的平台?

学到更多

官方的人机界面指南始终是深入分析新样式和功能的最佳来源。随时在这里阅读它们:

总结一下

苹果推出了许多新的启发性的东西。尽管iOS 14中的小部件,渐进式模糊为移动操作系统带来了很多新鲜体验,但是Big Sure彻底改变了我们使用Mac的方式。

本文由「设计创意1984」编辑整理,仅供分享交流,版权归原作者所有,欢迎转发。

微信扫一扫下面二维码关注我们
每日分享设计素材、设计资源、设计灵感图片
并分享一些看过的好书和好的电影给大家
... 人山人海中,谢谢遇见你 ...

设计创意1984【微信小程序】也正式上线啦
欢迎大家微信扫一扫下面二维码关注

(0)

本文由 Jackchen Design 1984 作者:jackchen 发表,转载请注明来源!

关键词:, , ,

热评文章

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注