挑战 Chrome 的浏览器！Arc 有哪些值得关注的设计细节？

前言

2022 年开始，一款浏览器产品 Arc Browser 在互联网圈受到广泛关注。当我拿到内测版本后，大概经过 2-3 周的试用，就彻底地将默认浏览器 Chrome 替换成了 Arc。

无论是重构了标签栏体验还是开创性的 Easels 和 Boost，Arc 的每次重大改版都能掀起一波小浪潮，引发用户的自发宣传。其究竟以怎样的魔力吸引着用户？

更多浏览器细节设计：

注：有关浏览器发展史及 Arc 平台思维的部分根据 Not Boring 作者 Packy McCormick 的文章基础上翻译和修改，感兴趣的小伙伴可以阅读原文～

Arc 官网链接：https://arc.net/

一、浏览器简单发展史

阶段一 ：Mosaic、Netscape 时代

1993 年，由两名学生开发的第一个用户友好的浏览器 Mosaic 诞生。作为第一个引入了例如图像、可点击的超链接和简单导航的浏览器，Mosaic 随即在市场上引起了轰动。1993 年底就快速达到了 100w 的用户量，并占据了近 90%的市场份额。但由于一些所有权纠纷，创始人之一马克·安德森离开了 Mosaic。

1994 年，马克·安德森与吉姆·克拉克联手，重新创办了 Netscape（我们所熟知的另一个名字是：网景公司）并开始着手重建浏览器体验，马克召集了一群学生一起大量优化了此前 Mosaic 中的体验问题。很快，95 年初，Netscape 占据了 80%的市场份额。

1995 年 8 月，Netscape 以每股 28 美元的价格上市。当天公司的股价就上涨了一倍多。Netscape 看起来像是赢得了一场没有其他人参与的战争。

阶段二：IE 长达 8 年的统治

但就在 Netscape 上市后 10 天，微软推出了 IE 浏览器，第一次浏览器大战一炮打响。微软很快通过 Windows 系统预装 IE 浏览器的流氓条约迅速的挤掉了 Netscape，成为下一个市占率 80%的浏览器。

美国司法部门甚至启动了反竞争调查，但是为时已晚，Netscape 在 98 年出售了公司，微软一直到 2004 年都保持了高达 90%的市占率。

然而，IE 长期占领统治地位却不思进取，市场上出现了众多眼红的选手。04 年开始，Firefox 凭借更多好用的功能：选项卡、浏览器扩展、弹出窗口阻止... 吸引了很多用户，不断蚕食 IE 浏览器的市场份额（IE 的市场份额一度跌到了 60%以下）。但当 Firefox 增长到 20%后，他们发现增长长时间停滞了。尽管受到更多喜爱，但 Firefox 无法超越 IE 的霸主地位。

阶段三：一骑绝尘，Chrome 开启新时代

08 年，Chrome 工程师通过开发多重处理（为主浏览器、GPU、每个选项卡和扩展程序运行单独的进程）更大程度减少内存占用。此外 Chrome 还首次引入了浏览器顶部的搜索栏，可以通过输入指令、URL 抵达对应的网页。渐渐地，Chrome 的市占率超过了 Firefox。但一直到 2012 年初，此时 IE 尽管被竞争对手蚕食掉较多市场份额，但它仍然稳坐第一宝座，拥有 45%的市占率。

直到 Chrome 推出了移动端浏览器，这一杀手锏让 Chrome 的市占率迅速赶超 IE，最终形成了碾压局势。

从此 IE 一蹶不振，最终在 2023 年 2 月 14 日，IE 彻底退出历史舞台。

Chrome 主宰的浏览器市场看似稳固，但其实早已暗流涌动，微软早已带着 Edge 重新杀回市场，Vivaldi、Sigma OS、Sidekick、Brave 纷纷出现，浏览器产品纷纷强调着隐私安全、更强的性能、更快的浏览体验、更简洁的界面......

回到文章的主人公 Arc，作为浏览器市场上的一个新进入者，又要如何破局？为何 Arc 的出现成功地捕获了众多注意力？

二、Arc 的平台思维

Arc 观察到，这几年 PC 应用逐渐呈现应用云化趋势，典型的案例就是大家从本地的 Sketch、Office 套件、Outlook 等产品转化到了 Figma、Notion、Gmail 这些以 web 技术为核心的产品。此外开发者也更乐于开发这些基于 Web 技术的应用，因为它具备跨平台、跨操作系统，云上协同，存储和同步等优势。

根据这一趋势，Arc 笃定未来会有更多产品会采用 Web 技术，因此人们将把更多的时间花费在浏览器上。

因此 Arc 希望自己不是一个单一的浏览器应用，而是去做一个类似 macOS 一样的平台，能够灵活调度所有的 web 产品。

而这一切，确实得从浏览器的底层体验开始改起。

三、Arc 优秀的使用体验

直戳痛点 —— 重构浏览体验

每当我们点击一个页面上的链接，传统浏览器就会打开一个新的标签，而我们时常来不及看太多信息却又害怕错过重点舍不得关闭。久而久之，我们的浏览器就呈现堆积了超级多标签页却没有时间去管理去阅读的状态。

Arc Browser 官网重点阐述了传统浏览器的痛点

另外，传统浏览器中打开的标签页和收藏的书签通常作为了两个概念，我们将大量的网址丢入收藏，因管理不便等原因，可能就再也没有打开过。对于常用的标签，虽然 Chrome 支持固定，但在重启浏览器后，可能会遇到固定标签直接丢失的场景。

Safari 虽和 Arc 类似，采用了竖向标签栏，并支持分组管理正在浏览的标签，但当选中标签页分组中的某个标签后，Safari 又横向展开了整个标签组下所有标签，不仅无法避免类似 Chrome 开启太多标签页的问题，还占据了大量的空间（包括左右和上下空间）。

让我们看看 Arc 是如何做的：

①标签栏设计

Arc 的标志性特征当属竖向标签栏，但不同于 safari，Arc 将左侧空间全部给到网页内容本身，顶部的信息应简则简。

其次 Arc 将标签页划分成三种，分别为收藏区（Favorite）、固定标签（Pinned Tabs）、今日标签（Today's Tabs）。

其中收藏区可设置最常访问的重要网址，最多可添加 12 个；

固定标签（Pinned Tabs）则是一个和书签功能合并的标签储藏功能，支持创建不同的文件夹进行收纳；

而今日标签（Today's Tabs）比较有意思，Arc 为了降低标签囤积行为，为今日标签设定了消失期限（默认仅 12h，可在设置项中修改）促使用户主动清理待看 Tabs，或者拉入 Pinned 进行主动分类。

为了避免用户在网页中经历多次跳转，Arc 也下了很大功夫：

②快捷访问

首先 Arc 特别定制了 Gmail、Outlook 日历、GitHub、Figma、Notion 等常用产品，支持快捷访问最近历史 。

支持常用网址内的快捷访问

甚至直接显示 Google Meet 中距离下一次会议的时间。

③临时页面

在 Arc 中，用户从任意应用或网址中打开的网页都呈现「临时页面」状态，用户可以在阅读后判断是将该网页扩展成 Tab 的形式进行收纳还是直接关闭。该功能可以有效降低降低标签堆积风险。

用 Arc 打开临时页面

④快速打开网页

虽然 Arc 给予了整洁的侧边栏和良好的 Tabs 的管理，但有时我们还是习惯于通过输入网址的方式对网页进行访问。Arc 则希望用更快速的方式解决这一痛点，用户可以设置需要快速访问的网页及访问时的缩写「代号」，省略掉输入完整网址的时间。输入「代号」后，按下 Tab 键（大小写键的上面）（按下时的视觉很炫酷），可以继续输入搜索内容，直接调出网页内容搜索结果。

⌘T即可在Arc在前台的情况下快速吊起搜索栏。

缩写「代号」可凭喜好任意设置，比如 twitter 的代号是 tw，youtube 是 yt，Google 就是 g～

设置方法

当你在 mac 上使用任意应用时，也可以通过 ⌥⌘N调起Arc 搜索框进行搜索，颇有一些Raycast（系统启动器）的味道。可能是避免对用户当前的操作形成过强干扰，Arc将搜索框特意放在了屏幕右上角。

全局搜索

⑤固定播放器 & 播放器小窗

想象一下，在 Chrome 这样的浏览器中，当你打开了无数标签页，如果此时有一个页面中的音频正在播放，你想要去关闭它，需要在一排中找很久，然后点开网页进行关闭。

使用 Arc 之前，我使用 Chrome 时的常态🥲

在 Arc 中播放任意音视频，切换到其他 Space 空间（下面会介绍到）或者 Tab，侧边栏都会出现控制器，点击直接回到对应页面。

另外我特别喜欢的细节就是播放任意视频时，切换到其他 Space 空间或者 Tab，会自动开启播放器小窗，在 iMac 这样的大屏下使用真的超级爽！在处理一些不太费脑的事情时还可以开个视频在旁边看～

甚至还有有趣的播放动画

如果说上述功能都还只是简单的小试牛刀，下面的这个能力将更加凸显 Arc 在成为一个平台而非简单的浏览器上的思考。

Space

通常我们使用浏览器时可能抱着不同的诉求，比如工作日我们沉浸在工作学习，周末更多是的影视娱乐。又或是在我们打开的几十个标签页中，总是有出于不同目的而查看的内容。

相较于其他浏览器动不动就塞满的标签栏，Arc 采取「Space」 的方式进行标签分类，用户可以将满足工作、学习、娱乐等不同场景诉求的网页保存在不同的 Space 中，每个「Space」可盛放不同的标签。并且可以通过修改 Space 的名称、图标和配色在情景之间构造视觉上、进而是心理上的区隔，将工作和生活或是不同工作项目、临时杂事彻底分开。

Arc 可建立多个 Space 分区

可通过左右滑动（MacBook 用户可通过触控板，Apple mouse 用户可通过鼠标中间的触控区）切换不同 Space。

左右滑动切换 space

改动 space 颜色（甚至支持多色渐变）

不得不说 Arc 的极客粉真的很多

⑥分屏和插件管理

这两个功能被优雅的收到了浏览器侧面的更多里，除了点击分屏，还可以通过 Tab 拖拽的方式开启分屏模式。

夸张的使用场景（适合一些特殊岗位，可以盯着多个大盘数据看）

⑦高调整花活 —— 亮眼且自带传播力的加分项

Boost

Arc 希望 Boost 能赋予用户改变每天赖以使用的产品的权利，让产品更好的反映用户的个性、审美和使用偏好，真正成为每天都在使用的产品的创造者。

6 月发布的 V2 版本中，Arc 对 Boost 的交互进行了极大得简化，在用户群中引发了轰动。

通过简单的操作便可更改网页特定元素的颜色，修改字体类型、字体大小，设置深色模式等。

Boost 能力展示

只需要点击下图中的 Zap this，就可以删掉你并不需要的「Shorts」 模块，用户可以用该功能屏蔽广告或社交媒体的信息流，让浏览行为更加专注。

Zap this

Boost 还支持用户通过 Code 的方式对网页进行更多自定义，可以删除更多不需要的元素、自定义网页布局等。

例如通过删除 Youtbe 网页推荐流，只保留搜索框，让自己访问 Youtube 时能专注于自己搜索的学习内容。

只保留搜索框的 Youtube. By：Kelvin

通过 Boost 能力让 Pinterest 上的图片展示 Prompt. By：hau

另外用户可以通过 Boosts 画廊与其他用户共享，还可以通过画廊使用其他用户的 Boosts。

精美的的 Boost 效果：Netflix & Spotify

Easels 画架

Easels 其实就是画板能力，但与其他画板产品的拼贴图片、形状所不同，Easels 可以抓取任何网站上的一部分，粘贴到个人 Easels 中并且形成可交互块，打造成一个个人仪表盘来使用。你也可以将任何自己想要的窗口自由组合在一个页面中使用，用鼠标在其上绘图，或者添加文本或框，方便进行快速演示，不用拘泥于特殊的格式。

一位用户将他正在经营的产品在不同数据网站上常用的数据图都拼贴在了 Easel 中，方便每日查看。

另外一位用户则将所有社交媒体、邮箱信息添加到了一个 Easel 中集中管理。

四、还想再夸一夸的

高调的视觉风格

作为设计师，看到 Arc 这样的产品出现时内心是欣喜若狂的。

从注册页到给「Space」自定义颜色，Arc 属实把弥散渐变玩的明明白白。在浏览器市场、工具类产品都在追求简洁、不打扰的趋势下，Arc 的视觉风格确实吸引眼球。

Arc 注册页面

在一些采访中，Arc 多次表达了对于灯光和情绪表现的艺术作品的喜爱。Arc 希望浏览器成为一个家，一个让人感到舒适的地方，而非只是一个没法留下深刻印象的普通工具。通过色彩，可以让用户专注到原本忽视的内容上去。

浏览器一直被设计成查看互联网的被动消费工具。我们希望用户参与其中，与它一起创造

Robert Irwin: Scrim veil—Black rectangle—Natural light, Whitney Museum of American Art, New York

这样的理念反应在 Arc 的窗口设计中，除了色彩和透明度的调整，还增加了背景模糊效果，甚至支持了噪点大小的调节。通过自定义，浏览器体验变得更加前卫且个性化。

此外 Favorite 的图标选中态也是我个人超级喜欢的细节，选中 Figma、Gmail、Google 这样多彩的 logo 时显得十分精致。让人没想到的是，即便是选中了单色的 logo，也会呈现丰富的光感变化，不会显得异常单调。

深思熟虑的动画反馈

Arc 在很多地方通过动画增强反馈。

下载文件时，图标会经过高弹跳落到 Library 中，为用户寻找下载文件做了足够的指引。

下载动画

在一些暗含更多功能的场景，Arc 给图标 Hover 态增加了动画，例如 View Library 图标，其中承载了下载、Space、Boost、Easels 管理等功能。

View Library 的 hover 动画

又例如网页的设置入口，其中承载了截图、share、插件管理等能力。

设置入口的 hover 动画

为了庆祝用户制作好 Boost 并且分享，Arc 制作了心脏跳动的效果。

分享 Boost

极致的交互细节

除了前面花大篇幅介绍的对标签体系的重构，Arc 在一些细节思考上也十分到位，其设计团队真的是在均匀发力（尽管这在商业上不一定是正确的），但让我联想到乔布斯时期 Apple 的出品态度，Arc 在设计细节上的坚持还是非常任性的。

通过触控区域切换到最后一个 Space 时，再次拖拽，会出现另外一种新建 Space 的方式：

关闭标签时，Arc 对不同的标签属性做了区分，当用户点击关闭固定标签（Pinned Tabs）时，Arc 做了防错的二次确认机制，而今日标签（Today's Tabs）作为临时的标签则可以立刻关闭。

这个观察源自 Micoxx

不管是调节「Space」的色彩还是使用 Boost 自定义网页，在 Arc 使用过程中反复出现色轮的设计。官方公布了内部色轮的设计思考和原理，值得一看：

色轮中包含一个主要点和一个次要点，当移动滚轮时，其实是在选择颜色范围，页面上的所有颜色都会映射到该色调范围哪。当页面颜色越浅，其输出色调就越接近主点。页面颜色越深，其输出色调就越接近次要点。

而两个点的点距中心距离代表饱和度值，输出的饱和度是该值和页面颜色饱和度值的混合。

不过，用户在使用的过程中还是不关心这些的，按感觉一顿调整就完事了。

色轮的迭代过程，Arc 尽可能将操作简化了

营销高手

①擅长高调造势

海外产品通常注重多渠道营销，Arc 宣传新功能的手段极其丰富，制作精心配乐的宣传视频、使用场景录屏等已经算是常规操作 —— 这些都成为了爱好者们帮助Arc免费传播的素材。Arc毫不避讳宣传团队成员并让团队员工出镜，在Youtube、Twitter上成员会介绍开发进展和功能设计思考，然后由官号进行转发。作为初创团队此举可以极大地拉近和用户的距离，快速看到用户反馈，也能增强团队成员的成就感。

另外官方 Twitter 会积极转发用户富有创造力的使用场景返图，达到功能宣传目的的同时形成正向互动。

Arc 的 Twitter 有近 9w 粉丝

Arc 通过 Easel 承载每周功能更新说明，在其中放出负责具体功能的成员名字甚至 twitter，看似随意的拼贴和划线就很容易让用户感到异常亲近。

②打造仪式感，拿捏用户心理

按下排队按钮，你就开启了一段新的旅程

要问 Arc 团队对细节的追求有多极致？在此之前我从没见过可以将 wait 体验拉满的产品。

加入 Waitlist 时的祝贺邮件，保留神秘感的同时不忘宣传理念。就连发送安装包的前一天，还会邮件提前预告一下（也能防止用户没看见注册邮件）。

③极致又带有传播力的拆箱体验

想象一下用户从排队申请内测，到经过漫长的等待后终于获得下载链接时的心情，Arc 在首次启动软件时将用户的期待值拉满，也属实拿捏住了用户体验新产品时迫不及待想要炫耀的心理。

有人将 Arc 的使用体验比喻为“骑了一辈子手动自行车后突然跳上了摩托车”，这样的体验必然要来一次华丽的开幕。

被很多用户截图分享的 Arc 启动动画（一定要打开声音感受下）

④更多细节体验

在 Arc 设置页，你还可以看到专属身份卡

就在你制作好一个 Boost 并打算分享至社区时，Arc 会邀请用户签名

五、一些不得不提的小坑（谨慎种草）

1. 同步功能

①Arc 目前使用 Apple ID 同步的方式而非账号同步。

当我发现两台电脑登录了同样的账号却没能同步标签时感到非常困扰，重视体验的 Arc 没有在新手引导提及这一点，最后我还是去官方渠道找到了答案。另外因为我习惯将个人设备和办公设备设置为不同的 Apple 账号，这种同步方式让我挣扎了很久要不要将默认浏览器迁移至 Arc。

②不过一旦下定决心修改 Apple ID 并迁移后还是蛮香的，Chrome 经常同步不及时，需要重启浏览器后生效，Arc 的同步速度明显更快。

不过我最近使用过程中又遇到了 Today’s Tab 不会在两台设备中同步的问题，咨询了官方应该是其产品策略的改动所致且没有明确后续是否会做修改（这明显不符合我的使用习惯）

2. Space 删除恢复

如果你不小心删除了一整个 Space（没有二次确认，真的很容易误删），只有当时使用⌘Z恢复的机会，并没有类似“回收站”的能力。

2. 没有导出标签的功能

从 Chrome、Safari 迁移易，想要迁移回去就难了...

这点给想要迁移主力浏览器的朋友们提个醒，Arc 毕竟是一家尚未盈利的创业公司，未来产品走向还真的不好说。

如果你和我一样已经迁移了...嘛，只能祝愿 Arc 的发展越来越好...

六、更多规划和疑问

1. 关于功能的实用性

通常 Arc 的大功能一出来，评论区就会有用户批评其过于关注极客用户的诉求，而非先解决 Windows 版本的开发问题、提高稳定性、减少内存的占用、电量消耗等。Boost、Easels 等能力确实亮眼，但从用户使用情况来看，光凭借这些能力确实很难带来更多浏览器用户。

对此，我专门去看了 Arc CEO 和设计主管的对话录屏，其中 CEO 有反复提及此类疑问，但是他们的讨论并没有给到我解释和答案。给我的感受反而是Arc的设计团队目前还是以尽可能追求cool、sex、wow的极致体验为核心，很多边界场景是日常工作中不得不考虑的。

2. 为什么 Win 版本迟迟没出现？

Arc 过去一直对外宣称在积极安排 Windows 版本的开发（官方预计 Q4 发布），但迟迟没能发布的原因是其花费较多时间探索如何使用 Swift UI 开发 Windows 版本，这是一个极其大胆的想法，他们需重新构建语言环境、开发工具。不过此举一旦成功便意味着团队可以在双端共用一套代码，后续可以将更多的精力放在新功能而非同时开发两套代码上。这大约有 60%的成功率，但 Arc 愿意在产品初期就去尝试。

Arc 展示用 Swift 搭建 Win 版本缺少的东西

3. 关于 Arc 还没有触及浏览器内核

Arc 仍然是基于 Chromium 开发，这被许多用户认为 Arc 的创新是极为表面的，也有用户维护 Arc 说这些创新是他们所需要的，他们都受够了堆积如山的标签栏。

我的理解是，站在巨人的肩膀上，的确是初创公司现阶段更合适的一条路。

Medium 作者 Andrew Zuo 这样写道

3. 关于商业化

Arc 目前还没有任何商业化方向上的行动，而大家都心知肚明的是：仅依赖融资的产品研发是不可持续的。

Arc 承诺不会学习 Chrome 出卖用户数据换取巨额广告收入，而是更多参考 Notion、Slack 等产品用更高级的功能换取付费。但团队没有披露太多具体的能力规划。

因此在商业化上，我仍然为 Arc 感到忧心。

4. 关于 AI

在大模型叙事的今天，许多用户认为 Arc 必须积极跟进 AI 能力才能最终赢得游戏胜利，否则无法真正颠覆巨头。

Arc 在 AI 上的态度应该也如前面叙述的能力一般：虽然很多事情可以被插件解决，但 Arc 还是希望重新理解和思考清楚，并呈现更简单的交互操作，最终将主动权交给用户。

在官方最新发布的视频中，CEO 展示了内部正在探索的 Demo：通过 GPT4 撰写代码并改变网页上的内容（更像是 Boost 能力的延伸）。同时 CEO 表示团队目前还有很多事情要做（也就是前面用户反复提及的 windows 版本、提高稳定性、减少内存的占用、电量消耗等）所以暂时还不会发布 AI 相关的能力。

简化亚马逊商品文本

说实话这和我想象的 Arc + AI 不太一样，我想象的将会和快捷搜索、快速调用等能力结合，这是更多浏览器普通用户所需要的，但这的确需要和大模型产品有更多的合作，并且对于初创团队来说，这将带来不小的资金消耗（但也可以作为 Arc 商业化的方向）。

小结

基于对浏览行为的底层思考，怀揣浏览器平台化的愿景和初生牛犊不怕虎的挑战精神，Arc 对浏览器体验进行了较为全面的创新。凭借极度细致的洞察、 炫酷的视觉表现、高调的营销，Arc 一出现就引发了大量注意。

虽然目前来看 Arc 并不足以对 Chrome、Apple store 生态的垄断地位产生威胁，但我觉得 Arc 先放眼未来可能产生的变革趋势的创新思路是对的，至少在众多新兴的浏览器挑战者中，它已经成为了最亮眼的那一个。如果未来真的有一天更多应用转向了 web 技术（当然，这其中阻力重重），那浏览器甚至 OS 系统的变革也就到来了。

现在 Arc Browser 正以平均每周 1-2 次的速度更新着（精神可嘉！！），团队招揽了大量 Google 背景的顶级人才（包括前谷歌浏览器的联合创始人兼副总裁 Darin Fisher），我们有理由相信 Arc 渐进创新的思路背后还有一整套更宏大的规划。

Arc 向一个遥远的未来发起了挑战，期待有一天 Arc 能够成为浏览器行业的搅局者。