苹果是如何打造Soft-UI设计未来的?

用户头像
上海/UI设计师/6年前/191浏览
苹果是如何打造Soft-UI设计未来的?

iOS、MacOS的UI设计更新,反映了怎样的行业发展方向?

iOS、MacOS的UI设计更新  

反映了怎样的行业发展方向?


6月23日,苹果在WWDC大会上将万众期待的iOS14、iPadOS14等全新系统如期发布,大多数苹果用户想必已经有所了解了。现在,先把技术放在一边,让我们关注一下在用户界面方面,它是如何改变的 👇



它通过Aqua完成了第一次位图表现,并用更现代的风格,构建了一个全新的、一致的设计语言。




主要的Mac OS设计风格


移动端和PC端操作系统的变化,某种程度上,表明了目前哪种设计风格最好。苹果的更新中,确实与微软UI设计有相似之处。有趣的是,十多年前,苹果嘲笑Windows Vista抄袭了他们的创意,而现在,他们却将微软的部分设计融入到了他们自己的产品中。


言归正传,接下来让我们谈谈,苹果这几年在UI上都有哪些改变吧~






01 更多的圆角 



一些新用户可能不记得这一点,但苹果一直倾向于圆角。在这个过程中,它们也确实变得越来越圆。


最初的iPhone操作系统有方形的按钮和面板。但我们都知道,由于原始的条件反射,我们的潜意识会把锋利的角作为“尖牙”。而这会让它们感觉更让人警惕,看起来也不那么友好。所以,苹果公司慢慢地改进了这些按钮,使之成为我们现在所熟知和喜爱的、更圆润的版本。


左:旧版本    右:更圆更自然。



但他们并没有就此止步,将图标的角半径也进行了修改。现在,类似风格的图标也出现在了Mac OS上。


UI开始匹配实物曲线



窗口、面板和操作列表也更圆了一些,这种变化主要始于iPhone X。它拥有一个非常圆润的显示屏,操作列表也就被相应的圆角化了。






02 透明与背景模糊 




在iOS7发布时,透明与背景模糊开始流行起来。很多人讨厌这种结合了超薄字体与极简主义的外观。但是,大多数人还是非常喜欢背景模糊效果的。


现在,无论是侧边栏(之前的几个Mac OS版本)还是工具提示中,背景模糊都变得越来越突出。在许多情况下,特别是侧边栏,通过部分背景的显示,背景模糊表现了某一窗口与整个操作系统的“连接”。


微软也使用了一种非常类似的,基于层的透明方法。



分层使用了相同的概念,即让更轻的表面更贴近用户,随之,更低的级别变得更暗。这样,即使没有半透明的效果,也显示出了层次结构。





03 统一图标(部分) 



我相信这种变化将是渐进的。苹果希望在Mac OS图标风格中保持足够的“现实主义”,同时使其更接近移动操作系统。


以下便是finder图标到目前为止的变化:

可以看出,图标显然是简化了。舍弃了矩形变成了统一的圆角正方形。由于某些原因,微笑变得更淡了(可能日后会更改)。同时,由于角度的变化,它看起来更加友好了。


Mac OS的工具栏图标也变得与典型的ios/ iPad OS图标更加一致。图标样式是圆形的、友好的、开放的。笔画足够粗,易于理解,也没有任何不必要的装饰。





04 Skeuomorphism? 



Mac OS是拟物元素的最后堡垒之一。现在它们被合并成了新拟物态,并与现代的扁平风相结合。这给予了操作系统一个现代的新外观,同时也保持了它特有的风格。


在一个更小限度的新设计出现之前,这可能是一个中间地带,毕竟我们喜欢自认为熟悉的东西,而一个彻底的改变可能会与IOS 7的情况类似。






05 其他方面 



之前的Mac OS版本也从移动操作系统中引入了深夜模式和San Francisco(字体)。似乎,现在苹果的设计系统,在所有平台上都倾向于接近一致。


而San Francisco作为一种现代的无衬线字体被广泛运用,也再一次证明了简约即正义。


作为一个拥有数百万用户的公司,其UI设计的总体方向总是有效的。像圆角、柔和的阴影、微妙的渐变等元素都在更新中被保留了下来。





当然,为“所有人”设计的产品需要遵循最常见的“友好原则”。但这并不意味着,我们在做任何事情时,都应该使用同样的规则。如果你在制作高度专业化的定向产品,你仍然可以使用尖角、完全不透明的图层等等。


但我不认为苹果没有做足功课,他们肯定对大多数人喜欢什么做了广泛的研究。所以,这正是一种行业趋势,即已经持续了一段时间的:现代Soft-UI。


1
阅读原文
|
举报
|
收藏
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
UI通用设计素材1
【新年UI图标】会员icon
科技医疗透明柜UI界面设计
高级表盘系列UI源文件
【新年UI图标】30个图标
【新年UI图标】体育icon
盲盒APP UI设计
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
我的钱包-UI界面设计-app
UI界面 组件
高级感金属拟物 UI设计组件库
3D渐变流体抽象矢量UI背景图
户外旅行飞机情侣假日出行
【新年UI图标】秒杀icon
Security Camera UI kit
钱包ui模板
拟物风质感写实UI卡片合集源文件
【新年UI图标】旅行icon
3D卡通UI界面图标可爱插画免扣素
APP/小程序商业项目UI模板|99个高保真UI+79个原型
【新年UI图标】汽车icon
新能源APP应用UIKit
UI 登录界面设计模板包
【新年UI图标】礼物/活动icon
【新年UI图标】钱包icon
你可能喜欢
相关收藏夹
大家都在看
登录注册