应用的形状

Lobsters Hottest 新闻

摘要

一篇探讨macOS应用图标形状从Big Sur到Tahoe演变的博客文章,重点介绍了强制使用圆角方形图标的‘Squircle Jail’的引入及其背后的历史。

<p><a href="https://lobste.rs/s/47h4yu/shape_apps">评论</a></p>
查看原文
查看缓存全文

缓存时间: 2026/07/16 03:52

# Parakeet Blog: 应用形态演变 来源:https://parakeet.co/blog/the-shape-of-apps/ ### 2026年7月15日 •Louie Mantia (https://lmnt.me/)https://pdx.social/@louiehttps://bsky.app/profile/lmnt.me --- 尽管 iOS(原 iPhoneOS)上的图标一直是圆角方形,且苹果平台上这种圆角方形图标已存在超过 20 年,但 Mac 应用图标历来呈现出多种独特的轮廓,这些轮廓与颜色、光照和立体感等其他视觉工具共同协助用户识别。 由于 Mac OS X 时代的应用图标备受喜爱,因此对于长期使用 Mac OS X 的用户而言,强制规定应用图标必须为圆角方形,无疑令人心碎——这种感受完全可以理解。 究竟发生了什么?为什么会出现这种情况?我们又该如何应对? --- ## 打破边界 在向开发者介绍 macOS Big Sur 时,苹果公司特别提到了 Mac 应用图标丰富的历史。他们鼓励使用圆角方形应用图标,以便与 iOS 更加协调,但并未设置硬性限制。事实上,苹果自家平台上的一些图标公然突破了圆角正方形的边界——有时通过放置在图标上方的工具来实现,例如 TextEdit 中的钢笔,这成了 iOS 和 macOS 的巧妙融合。 macOS 11 的六个应用图标,展示了超出预期圆角正方形形状的多种方式。macOS 11 的六个应用图标,展示了超出预期圆角正方形形状的多种方式。虽然自 2008 年以来,开发者提交给 iOS 应用图标的都是全出血正方形图像,但对于 macOS 11 中这些新的圆角方形图标,苹果提供了一个模板,允许在 Photoshop 等图像编辑工具中组合应用图标,并在建议(非强制)的圆角方形之外完全控制画布。这个模板让设计师能够相对轻松地创建与 iOS 应用图标相同或相似的 macOS 应用图标,同时保留在 macOS 上继续使用任意形状应用图标的可能性。图标保存为资源目录。 macOS 11 应用图标 Photoshop 模板。macOS 11 应用图标 Photoshop 模板。**剧透警告:**并非所有人都使用了这个模板。我确信苹果公司的人认为,通过提供这个模板,可以避免开发者、设计师和公司在确定 macOS 应用图标尺寸和形状时进行猜测。 值得庆幸的是,一些设计师和开发者**确实**使用了它。更重要的是,有些人抓住了机会——像苹果那样——打破边界,创建了在 iOS 上无法实现的应用图标,但仍然巧妙地利用了圆角方形形状。 例如,这个 Sketch 图标的左侧略微半透明,模仿了侧边栏的外观。Transmission 的换档柄从顶部边缘伸出。Keka 的角色轮廓自然地近似于圆角方形图标形状。 Sketch、Transmission 和 Keka 的应用图标。Sketch、Transmission 和 Keka 的应用图标。这很棒。至少在一段时间内是这样。 --- ## Squircle 监狱 仅在 macOS Big Sur 发布五年后,macOS Tahoe 引入了新的应用图标样式和格式,不再允许应用图标拥有任意轮廓。而且你可能已经知道,试图这样做的应用图标会直接进入“Squircle 监狱”。此外,圆角方形形状也发生了变化,因此所有 Tahoe 之前的圆角方形图标都略微走样。 在我看来,Squircle 监狱有**三种**版本: 1. 正方形应用图标与官方形状不匹配,因此被遮罩为官方圆角方形形状。 2. Tahoe 之前的应用图标,系统会将其缩小并放置在中性浅灰色圆角方形背景上。 3. 应用图标被自愿缩小并放置在自定义颜色的圆角方形背景上。 第一种情况——通常来说——是件好事。例如那些具有圆角方形图标但外观不对的第三方应用:太大、太小或圆角半径不匹配。对于这些情况,操作系统会缩放方形图像,将其遮罩为标准圆角方形应用图标形状,并在必要时使用相同颜色填充角落。如果识别出前景和背景元素,会自动应用 Liquid Glass 效果。几乎所有这种情况都获得了不错的效果。 Adobe Illustrator、8BitDo 和 PS Remote Play 的应用图标与它们在 macOS 27 中的受限版本对比。Adobe Illustrator、8BitDo 和 PS Remote Play 的应用图标与它们在 macOS 27 中的受限版本对比。第二种类型的 Squircle 监狱更具争议性,因为这些应用图标是专门按照**适配**的意图绘制的。覆盖这种意图感觉像是对正确行为的惩罚。那些不久前还被系统鼓励的样式的应用图标,现在被缩小并放入圆角方形中,仿佛它是一个容器。所有利用之前圆角方形形状的图标突然看起来比以前糟糕得多。 Tes、OpenRCT2 和 Font Proofer 的应用图标与它们在 macOS 27 中的受限版本对比。Tes、OpenRCT2 和 Font Proofer 的应用图标与它们在 macOS 27 中的受限版本对比。然而,有许多任意形状的应用图标**并非**为了适配最近的 macOS 版本而制作,它们同样被缩小并放置在浅灰色圆角方形上。对于那些对其运行的系统几乎不熟悉的应用程序来说,这并不会让我反感。 Steam、BrickLink Studio 和 Audacity 的应用图标与它们在 macOS 27 中的受限版本对比。Steam、BrickLink Studio 和 Audacity 的应用图标与它们在 macOS 27 中的受限版本对比。这个概念的第三个版本始于 Big Sur,表现为那些“自首”进入 Squircle 监狱的任意形状应用图标。开发者将他们的图标缩小到自定义颜色的圆角方形中,使其看起来更符合系统风格,同时又不放弃在圆角方形时代之前可能使用的图标。 Nova、The Unarchiver 和 HandBrake 的先前版本应用图标与它们目前在 macOS 27 中的受限版本对比。Nova、The Unarchiver 和 HandBrake 的先前版本应用图标与它们目前在 macOS 27 中的受限版本对比。值得注意的是,平台上一些最好的图标看起来更糟,而一些最差的图标看起来更好。 --- ## 大规模设计 在 2007 年 Mac OS X Leopard 之前,图标比今天小得多。也就是说,即使它们以相同的物理尺寸显示,分辨率也低得多。那时,应用图标最大为 128×128 像素,而且由于显示分辨率也较低,你可以看到像素之间的间隙,你的大脑会填补这些间隙。这与 CRT 电视上旧电子游戏在视觉细节上比在现代高分辨率显示器上查看相同精灵素材时显得更丰富的情况类似。 为了支持 Mac OS X Leopard 的新功能 CoverFlow,最大图标尺寸增加到 512×512 像素。尽管这个数字似乎是之前分辨率的“4 倍”,但它包含的像素数量正好是 128×128 像素图标的**16 倍**。 2011 年,随着 Retina Mac 显示器的推出,分辨率再次增加,这次达到 1024×1024 像素。这是 128×128 像素图标像素量的**64 倍**,而五年前 128×128 还是最大图标尺寸。一个过去很容易在 2×2 像素方块中蒙混过关的细节,现在占据了 256 个像素。你再也无法蒙混过关了。在这种规模下,制作应用图标完全变了一个游戏。 2005 年 OS X Tiger 中的 128×128 Chess 图标,与 2020 年的 1024×1024 Jamalytics (https://parakeet.co/app-icons/jamalytics/) 图标对比。2005 年 OS X Tiger 中的 128×128 Chess 图标,与 2020 年的 1024×1024 Jamalytics (https://parakeet.co/app-icons/jamalytics/) 图标对比。非图标设计师可能不知道的是,除了这个增加的最大分辨率,图标设计师还需要继续制作所有之前的分辨率,包括先前版本的高 dpi 版本,并打包到 ICNS 文件中。 这对图标设计师来说,工作量比以往**大得多**。 在 iPhone 出现之前,苹果开发者社区相对较小。开发者通常熟悉苹果的平台设计。在 iPhone 之前出现的 Mac 应用,其图标通常是为 Mac OS X 专门设计的,不仅由专业设计师设计,而且由专业的**图标**设计师设计——这样的设计师为数不多。 iPhone SDK 和 App Store 导致开发者社区规模爆炸式增长。这揭示了一个明显的问题:并非所有 iPhone 应用开发者都知道如何以用户期望的苹果平台风格进行设计。事实上,只有极少数人知道。 2008 年 12 月 iPhone App Store 中排名前 21 的付费应用,其中大部分还有很大改进空间。2008 年 12 月 iPhone App Store 中排名前 21 的付费应用,其中大部分还有很大改进空间。每个开发者对于应用图标是什么以及如何设计都有自己的看法。有些人将这项任务与营销联系起来,有一段时间,“打折”或“获奖”字样的违规图标在 App Store 上屡见不鲜。 随着 iPhone 和 iPad 产品线的增长,制作应用图标的任务变得更加复杂。不知何故,iOS 和 iPadOS 应用图标所需的图标资源比 Mac 应用图标还要多。图标设计师可以轻松应对,但其他人则会感到头疼。优秀的图标设计师会在较小尺寸下润色甚至完全重绘图标,但其他人几乎不可能这样做。 而当企业界将 iPhone 视为一个巨大的新机遇时,又带来了另一个问题。 --- ## 企业同质化 许多 iOS 和 Mac 应用来自也在其他非苹果平台上分发软件的公司。每个平台都希望应用采用平台特定的惯例,但这是一场难以取胜的战斗。设计团队和开发团队——有时出于商业原因——会将公司放在首位,平台放在次位。他们的应用不仅仅针对一个平台;而是针对**任何和所有**平台,包括网页。 与其专门为 Mac 和 iPhone 精心设计和开发解决方案,那些不仅制作应用的更新更大的公司,往往在应用中附带**徽标图标**,而不是应用图标。我们都见过这种情况。 几年前,我写过关于图标不是标志 (https://lmnt.me/blog/icons-are-not-logos.html) 的文章。它们是不同的东西,服务于不同的目的。标志是用于**识别**公司或产品的独特标记,而图标旨在**告知**人们其用途。应用图标介于两者之间,在品牌与用途之间取得平衡。制作一个既能同时完成这两件事,又**尝试**在风格上与系统协调的图标,要求非常高。 大企业通常甚至不尝试取得这种平衡,不是因为它困难,而是因为这在被考虑的事项层级中非常低。制作一个好的应用图标不在他们的关注范围内。负责发布此软件的人不会阅读 HIG(人机界面指南)。他们甚至不知道那是什么。出于无知,他们只是把标志贴在圆角方形上。 Slack、Prime Video 和 Pinterest 的三个徽标图标。Slack、Prime Video 和 Pinterest 的三个徽标图标。如今,正是这些平淡无奇的大企业**徽标图标**占据了 iOS 主屏幕和 macOS Dock 的很大一部分,而不是过去主导我们设备的华丽、富有表现力的**应用图标**。 --- ## 咚咚咚 是扁平设计。 以苹果以往视觉丰富、高分辨率风格创建 UI 和图标需要洞察力、技能和对系统的了解。随着设计师和开发者行业日益壮大,且他们并不深入了解如何达到那种标准,我只能假设苹果感到有必要将应用图标和 UI 风格改为更容易被复制的东西。 iOS 7 的“扁平设计”外观并非为了时髦、满足高管的虚荣心,甚至不是为了改善用户体验。这是为了那些无法或不愿达到苹果之前平台风格所要求水平的新第三方开发者和大公司。 --- ## 第二轮 Liquid Glass 与其说是一种新风格,不如说是对 iOS 7 风格的改进。原则基本相同,包括将应用图标限制在圆角矩形范围内的决定——这次包括 macOS。因为虽然一些设计师和开发者确实关心让他们的 macOS 应用图标看起来很棒,包括正确利用圆角方形,但苹果知道并不是每个人**都能**,也不是每个人**都愿意**。 在过去近 20 年里,我们目睹的现实是,macOS Dock 中总有一些应用**不是**由那些在乎的独立开发者开发的。那些我们不想使用——但出于某种原因不得不使用——的应用看起来非常格格不入。 在某些时候,你可能下载过一款 macOS 游戏,其图标使用了整个 1024×1024 的画布,没有圆角。或者你可能需要一个工作用的应用,但它已经十年没有更新了,带有一个过大的光泽圆形图标。或者有一个非常有用的小众工具,却有着极其复杂的轮廓。 这种情况时有发生。 将所有此类应用图标遮罩为圆角方形,甚至对其应用 Liquid Glass 效果,旨在解决**这个**问题。这遵循了 iOS 7 的相同原则:让所有应用更容易在该平台上融入,特别是由不熟悉如何制作与第一方图标相得益彰的图标的设计师和开发者构建的应用。 为了明确我的偏好,我希望苹果能为设计师提供一种突破圆角方形边界的方法。我喜爱的一些应用图标正是这样做的。但同样,我最不喜爱的一些应用图标完全忽视了这种形状,尽管过去五年中每个系统图标都在使用它。每当**那些**应用出现在我的 Dock 中时,就像我衬衫上擦不掉的污渍。 尽管圆角方形限制带来了真正的损失,但设计方法不止一种。 --- ## 容器 vs. 画布 自从 App Store 存在**之前**,我就一直在设计 iPhone 图标。所以,我从事这个非常具体的工作比大多数人都要长。我设计圆角方形图标已经将近**20 年**了。我早期学到的一件事是,这种形状不仅仅是一个容器;它也可以是一块画布。 区别在于:如果你将圆角方形形状视为一个**容器**,你只能将图标放在**里面**;但如果你将这个形状视为**画布**,那么图标**就是**这个圆角方形本身。 2007 年的原版 iPhone 对其大部分图标使用了这种方法,但尤其值得注意的是 YouTube 应用图标,一台老式电视机填满了整个圆角正方形。 2007 年的 iPhone 主屏幕。2007 年的 iPhone 主屏幕。如果你在 iPhone 早期的设计师社区中活跃过,你可能记得早期的一些例子:边缘到边缘的扁平物体,以及透视强制以填充整个形状的立体物体。 一个被设计成边缘到边缘的图标不会让自己被扔进 Squircle 监狱,因为 Squircle 监狱的整个概念依赖于一个任意形状的图标被**包含**在一个圆角方形**内部**,而不是圆角方形**本身就是**图标,作为其形态存在。 --- ## 形态传达功能 2009 年,我接受了 MacStories (https://www.macstories.net/stories/louie-mantia-interview/) 的采访,分享了我创建 Flurry (https://freeware.iconfactory.com/preview/flrs)(一个下载

相似文章

解放图标

Hacker News Top

本文批评苹果在 macOS 26 Tahoe 中强制统一使用圆角方形图标,认为这损害了可用性和创意,并对 macOS 27 Golden Gate 的改进表示欢迎,同时敦促苹果恢复具有辨识度的图标形状。

天哪,macOS 27 Golden Gate 移除了菜单项中的愚蠢图标

Hacker News Top

Apple 的 macOS 27 Golden Gate 移除了 macOS 26 Tahoe 中引入的备受争议且令人分心的菜单项图标,并更新了《人机界面指南》,建议谨慎使用图标。这一变化被视为 Apple 软件设计方向改善的标志。

Clarus、Moofo 与 Lackey

Hacker News Top

1980 年代苹果 Macintosh 团队苦于缺乏美术功底,请来 Susan Kare 手绘经典 UI 图标,诞生了 Cairo 字体和传奇的 dogcow 图标,用于页面方向设置对话框。

在 2026 年使用 SwiftUI 构建纯正的 Mac 应用

Lobsters Hottest

这篇文章讲述了作者完全使用 SwiftUI 构建 macOS 应用的经验,讨论了在实现原生 Mac 体验时遇到的挑战和限制,例如选中状态和非活动窗口的行为,并得出结论:SwiftUI 在 Mac 上尚不足以构建‘纯正 Mac’应用。