百度 - 轻松建站从此开始!

澳门九五之尊开户_澳门九五之尊娱乐赌场

当前位置: 澳门九五之尊开户_澳门九五之尊娱乐赌场 > 互联网 > 澳门九五之尊开户:[系统] #原创# 扁平与拟物相融,苹果 macOS 11.0 Big Sur Beta 2 图标设计初探

澳门九五之尊开户:[系统] #原创# 扁平与拟物相融,苹果 macOS 11.0 Big Sur Beta 2 图标设计初探

时间:2020-07-23 07:43来源: 作者:admin 点击: 5 次
说明:#原创#标签为IT之家在IT圈所设的投稿栏目,具体投稿规则点此查看。一、分析我使用macOS有3年多了。虽然这算不上很久,但是我被macOS精致的界面和关注细节的态度所震撼。其中一个方面就是哪怕和iOS的应用图标相似,macOS的图标也总是有自己的特色。就应用界面设计来说,我特别喜欢这次整体的

申明:#原创# 标签为IT之家在IT圈所设的投稿栏目,澳门九五之尊开户:详细投稿规则点此查看。

一、 剖析

我利用 macOS 有 3 年多了。尽管这算不上很久,但是我被 macOS 精致的界面和关注细节的立场所震撼。此中一个方面就是哪怕和 iOS 的应用图标类似,macOS 的图标也夙儒是有自身的特色。

就应用界面设计来说,我特别爱好这次整体的气概替代,边栏和工具栏上的小图标利用了进一步优化的 SF Symbol 2 图标。整体效果十分清爽统一,边栏的整体高度也调整为了整个窗口的高度,这个效果期待了挺久的。

旧版:

新版:

这次更新包罗了十分多的内容,但这篇文章主要关注图标 (App Icons) 气概的改革。说实话,新版的应用图标让我有些摸不着思维,或者说有一些图标看起来十分稀罕。尽管整体连系了 iOS 图标和 macOS 写实的特点,但是在细节和光影表达上都有着明显的差异。

macOS图标圆角矩形化的主要目的是什么?

In macOS 11, the design language for app icons promotes consistency with all platforms while retaining the lifelike rendering style typical of macOS icons. App icons combine a rounded-rectangle shape, a front-facing perspective, and a consistent drop shadow to provide a unified visual experience.

来自 What's New in macOS

"在 macOS 11 中,应用图标的设计语言在保存 macOS 图标写实气概的同时提拔了图标设计语言跨平台的一致性。通过应用圆角矩形配景,正面透视以及统一的投影这些特征,新设计的图标提供了统一的视觉效果。"

由此可见,本次图标的更新主要目的在于提拔 macOS 和其他平台图标之间的统一性,让用户从其他平台迁移到 Mac 上时,也可以轻松识别出各种应用。但是我对此体现思疑,新版本兼顾了和 iOS 的统一性但是本身却缺乏统一性。依照粗略的统计,Big Sur 中大约有 4 种纷歧样的图标气概。我将不才文剖析每一种气概所对应的图标,同时参考开发者网站的指南并给出自身的看法。


1. 特别立体的图标

通过不都雅察能够发现以下的图标都是原本的 macOS 独有的或者起首出现在 macOS 平台的应用。这些图标的特点是将渲染的物体作为装饰附着在简略扁平的主体图标之上。

Although the design language strongly encourages visual consistency, it doesn’t preclude judicious expressiveness. For example, the Preview, Xcode, and TextEdit icons continue to combine depictions of the physical objects that best convey the app’s core purpose, while incorporating the new shape, perspective, and shadow.

来自 What's New in macOS

依照开发者指南,Apple 并不想由于圆角矩形的应用而限定合理的表达。在Apple 看来,开发者应该将最能表达应用核心功能的元素作为写实的装金饰,但也要和配景很好地交融。

新的图标的绘制体例为取消改变角度,并圆角化配景,把写实物体摆放在右侧。这些图标的配景用来解释申明应用的目的,而装饰的写实物品用来凸起核心功能。

和旧版图标比照,新版图标显得被圆角矩形约束住了,像纸张被僵硬地截取了一块,摆放角度的修改贫乏了机动,优雅的感觉。这是统一利用圆角矩形的带来的缺点之一。

相似的图标可能还包孕:Grapher,钥匙串拜候,体系信息,启动转换助理,数码测色器,色调同步适用工具,自动操作,图像捕捉,国际象棋等。

旧版文本编纂:

新版文本编纂:


2. 基于真实物体的扁平化图标

说真的,我挺爱好如许的气概的。他们既保存了所代表物品的真实细节,包孕光影和纹路,但是又没有做得太过复杂,整体保持了扁平,看起来比较谐和。我觉得这是几个气概内里最合乎 macOS 更新后的款式的图标。

此类图标的绘制过程为取消改变角度,压缩到圆角矩形的尺寸,保存边沿的细节用来表达应用的功能。

不过我以为此类图标谐和的起因可能是由于他们代表的物品很容易找到并接洽到圆角矩形图标上,不像音讯或者应用商铺,实际中是没有的。别的这些实物本人就能够填充整个图标而无需借用配景。不过我不知道为什么"词典"和"便笺"是带有透视角度的,而别的两个却没有。🤔

没有其他相似的图标。

旧版通信录:

新版通信录:

3. 扁平图标加上过重的投影

我觉得这些图标是最稀罕的而且暗影的效果有些过度了。第一眼看上去就感觉很冗冷炙、繁重,由于增多了太多的投影。

他们的绘制体例注重了解图标内的元素,把他们想像成立体的形态。这些图标强化了原有元素的立体效果,搭配材质的反光营造较强的视觉冲击力。

FaceTime 和信息带有绿色的反光,看起来就像是吹起来的润滑气球,不知道是不是想要和信息的谈天气泡接洽起来。这些图标和其他比拟差异太大,过度的投影和反光让这几个图标看起来十分稀罕乃至有些"脏兮兮的"。

相似的图标可能还包孕:股票,计算器家庭,QuickTime 和设置等。

旧版信息:

新版信息:


4. 扁平图标加上淡淡的暗影

这些图标看起来和 iOS 或者 iPadOS 上的差不久不多。要不是认真不都雅察,很难看出和 iOS 的区别。

他们的绘制体例是在 iOS 图标的根底上思考来自上方的光线,并把原有的元素当作资料移除后塑造出的形状。以 Safari 为例,新版图标在白色配景上移除了一个带有深度的圆,然后嵌入了一个指南针。

由于光线在图标上方,所以这些图标在上边沿的背光面加上了浅浅的暗影来增多立体感。或者也能够说每个图标都是好几层彩色纸片叠起来的,然后最上面的一层剪去了图案露出了下面的配景。这些图标努力用光影细节表现立体气概,但是在小尺寸下(放在 Dock 栏上时)和 iOS 的图标根本无异,在必然水平上丢失了 macOS 的特征。

相似的图标还可能包孕:日历,提示事项,备忘录,查找,博客,视频语音备忘录,工夫机器等。

旧版 Safari:

新版 Safari:

5. 非圆角包裹的图标

目前体系中我找到了这两个明显不是以圆角矩形为轮廓的图标,不过说实话,看起来还能够,至少没有呆呆的样子。

二、展望

当然,通过上述的差别气概的图标案例,我觉得切实指南中所说的统一性并没有到达。在 macOS 上利用圆角矩形图标可能可以提拔 macOS 和 iOS 的统一性,但是也在必然水平上丧失了 macOS 的统一性。Mac 究竟和挪动设施差别,macOS 包罗了大量的专业软件和工具,许多工具的差别外不都雅和特征在圆角矩形下很难得到表现。从主不都雅的层面来说,我以为圆角矩形的利用让本来多样、机动的图标变得有些呆板、束缚。

之前Apple图标设计指南指出 macOS 图标设计必要思考以下几点(只枚举了局部):

Consider giving your app icon a realistic, unique shape. In macOS, app icons can have the shape of the objects they depict. A unique outline focuses attention on the object and makes it easy to recognize the icon at a glance.

If you’re creating a macOS version of an iOS app, design a new version of your app icon. Your macOS app icon should be recognizable, but not an exact copy of your iOS app icon. In particular, the macOS icon shouldn’t use the same rounded rectangle shape that the iOS icon uses.

来自 App Icon

思考给你的图标真实而奇特的外不都雅

若是你想要构建基于 iOS 版本的 macOS 应用,应当给 macOS 版本的应用设计新的图标

因而这一次 Apple 对于跨平台统一性的立场我有以下两点质疑:

统一性的提拔是否必然要基于轮廓形态的统一?究竟 watchOS 的图标仍是圆形的呢

统一性的提拔是否指的是照搬局部其他平台的图标?和 iOS 相似的图标但带有 macOS 的本身特色真的违犯了统一性吗?同样 watchOS 和 iOS 图标的差异是否真的影响了统一性?


👆富裕特色的 macOS 旧版图标

连系开发者网站上的指南,我想谈谈自身对理想状态下对 macOS 图标的期待

1. 保持圆角矩形的图标气概

找到一个在图标类似性和保持 macOS 写实气概特色之间的均衡点。总体上能够更像 macOS ,就像上面枚举的的第二种气概,在圆角矩形的根底上绘制 macOS 奇特的图标并加上恰到好处的光影纹理细节。如许就要求每一个图标去思考采用如何的配景,由于某些元素不能填充整个圆角矩形。别的能够增多本来 macOS 的细节,好比旧版圆形图标周围的一圈金属环,在新版上能够改成圆角矩形的边框。总之,必要更多地从 macOS 的角度去思考 macOS 特有的细节和特征而不是在 iOS 图标上一味应用投影和反射。

2. 回归愈加多样化的图标罗列体例

之前版本的 macOS 有不少图标都是呈必然角度倾斜的。如许的设计让图标看起来愈加自然有生机,同时没有圆角矩形的限定,图标绘制有了更大的发挥空间,元素也不消担忧若何填充配景。但是为了形态上的统一性,能够让特定类型的应用利用某一种图标形状。好比基于纸张的应用(像邮件、日历、提示事项、备忘录)统一利用倾斜的长方形;媒体相干的应用(新闻、音乐、博客、应用商铺)利用圆形的图标;体系工具相干的利用无倾斜正方形的图标;专业软件用倾斜长方形搭配写实装金饰。

之前在圈子里也看到了良多关于 Big Sur 图标设计的优异文章,此中一个有意思的不都雅点就是若是这一次交融了扁坦然安祥写实气概的图标是为了加强实际做准备呢?尽管新的图标尽管气概上有差异,但是若是都是为了加强实际做探究,那意义是很大的。若是在交互的时候按拍照对挪动表示出相似改变的动画和光影效果,连系材质的表达,效果能够十分冷艳!但是若何将更多的图标统一为这种气概,并把应用界面融入加强实际的交互就要拭目以待了。

十分感谢大家急躁浏览!以上是我对 macOS Big Sur 应用图标的小我看法,此中未免带有一些主不都雅色调。图标设计当然无法用量化的尺度去权衡好坏,但是上文给出的多种气概的分类是有据可依的。我希望这篇文章能够让大家对了解图标更新背后的起因和设计理念的转变有一些帮手,也欢迎大家在评论处说说自身的看法。

(责任编辑:)
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
发布者资料
查看详细资料 发送留言 加为好友 用户等级: 注册时间:2020-08-14 04:08 最后登录:2020-08-14 04:08
栏目列表
推荐内容