From Invisible to Crafted: Designing Browsers at Apple and The Browser Company
打开互动全文版(中英对照 + 朗读 + 问答)→前苹果 Safari 设计师 Charlie Deets 揭示设计无处不在的隐形浏览器与打造个性化体验的差异,并分享包括拥抱冲动在内的设计原则。
Former Apple Safari designer Charlie Deets reveals how designing a ubiquitous, invisible browser differs from crafting a specialized experience, and shares his design principles including embracing impulsiveness.
当每个人都能执行时,设计师能带来什么独特的东西?
What's the special sauce that designers bring to the table when everybody can execute?
我可以把东西收回来。我可以让它更简单,让用户更容易理解。我关心确保那个按钮完美工作。我本可以进去修复它。但如果我一直停留在这种思维层面,我在创新方面就比在执行方面更独特,因为现在每个人都可以执行。
I can pull things back. I can make it simpler. I can make it more understandable for the user. I care about making sure that button works exactly right. I could have gone in and fixed it. But if I keep staying on this end of the equation where I'm thinking in this realm, I'm more novel over there than I am in the execution realm because everyone can kind of execute right now.
你是如何创造这些将好产品与伟大产品区分开来的小瞬间的?
How do you create these little moments that separate good products from great ones?
决策中的冲动可能带来问题,因为你会做出糟糕的决定。但在设计中,我认为你应该一直鼓励冲动。因为当一个随机的想法冒出来时,就顺着那条路走下去。试一试,看看会发生什么。如果你不玩一玩,不随便折腾,你就不会遇到那些时刻。
Impulsiveness in decisions can be problematic because you can make bad decisions. But impulsiveness in your design is actually something I think you should facilitate all the time. Because trying out a random thought that pops into your head—go down that path. Try it out. See what happens. If you're not playing or you're not messing around, you won't come to those moments.
欢迎来到 Dive Club。我是 Rid,这里是设计师永不停歇学习的地方。本周的嘉宾是 Charlie Deets,他是 The Browser Company 的设计师,正在开发 Dia。他将带我们了解一些精致的工艺细节。但我们还会深入探讨 Charlie 的个人设计原则,以及它们如何塑造他的实践。不过在此之前,这一集其实从苹果开始,因为 Charlie 在设计 Arc 或 Dia 之前,是 Safari 的设计师。听他说两家公司的差异非常有趣。
Welcome to Dive Club. My name is Rid and this is where designers never stop learning. This week's episode is with Charlie Deets, who's a designer at The Browser Company where he's working on Dia. So, he's going to give us a little tour of some of the finer craft details. But we're also going to do a deep dive into Charlie's personal design principles and all of the ways that they shape his practice. But before we get into all of that, this episode actually starts at Apple because before Charlie was designing Arc or Dia, he was one of the designers working on Safari. And it's fascinating to hear him talk about the differences between the two companies.
我是苹果公司人机界面设计团队的一员。那是一个有点过渡的时期。至少对我来说,我在不同团队参与多个项目。有一天,我的经理来找我,说大概是时候聚焦并深入某个领域了,并告诉我一些选项,其中之一是 Safari。我一直很喜欢纯实用驱动的应用,那些不一定花哨但运行良好的东西。那是我的舒适区。Safari 在很多方面正是如此。大多数使用 Safari 的人甚至不知道他们在用 Safari,它就像那种隐形的表面。我很好奇那是什么感觉,于是见了团队,开始和他们合作。太棒了。技术上非常深入,他们处理的事情总是丰富的。它是跨平台的——所有平台都有 Safari——而且使用率极高。我觉得这是完美的场景。我和团队很合得来,最终在苹果的整个时间都在做这个。
I was part of the Human Interfaces design team at Apple. It was in a slightly transitional period. At least for me, I was working on a bunch of projects across various teams. My manager came to me one day and said it's probably time to focus and go deep on something, and told me some of the options. One of them was Safari. I've always been in love with pure utility-driven apps, things that aren't necessarily flashy but work really well. That's my comfort zone. Safari couldn't be more like that. Most people that use Safari literally don't know they're using Safari. It's that type of invisible surface. I wondered what that was like, so I met the team and started working with them. It was awesome. It was technically extremely deep. The things they were dealing with were always rich. It was multiplatform—all the different platforms have Safari on it—and it's extremely highly used. I thought this is a perfect scenario. I clicked with the people on that team and ended up doing that for the entirety of my time at that company.
你说它在很多方面是隐形的界面,你甚至不知道自己在用 Safari。但作为一个设计浏览器的人,你具体做了哪些工作?我们能否更深入地探讨一下设计这类产品的独特之处?因为大多数听众,包括我自己,可能实际上不会有那种体验。
You say it's like the invisible interface in many ways and you don't even know you're using Safari. But what were some of the things you worked on as somebody who's designing a browser? Can we go a little deeper into what makes designing this type of product unique? Because the vast majority of people listening, myself included, probably won't actually get that experience.
有趣的是,像 Safari 这样的产品定位是无所不在,而 Dia 或 Arc 则更注重打造一种体验。这是同一个领域,但从完全不同的角度。Safari 做的事情可能会颠覆现有工作流程,而且它已经存在了几十年。人们以非常特定的方式依赖书签栏。在那里冒险会带来巨大的后果,而且用户群极其广泛。你不能只为某一类用户设计,必须始终为所有用户设计。你的决策是一个复杂的矩阵。你不能简单地说这是更好的体验,然后百分之百推行,因为总有弊端。使用方式总是一个渐变谱。比如,想想标签页。有些人一次用一个标签,有些人用四五个,有些人用更多,还有人用多个窗口,有人用配置文件。他们希望打开多个窗口,因为他们知道那个窗口空间是他们想去的地方。你不能在不考虑所有可能用例的情况下对标签页做出决定。这对我来说总是很有趣的思考方式,因为它让我跳出自我。我可以想这是我想要的使用方式,但我几乎必须立即否定它,因为那只是谱系中微小的一点。这很有挑战性。
It's interesting the positioning of something like Safari which is meant to be ubiquitous versus something like Dia or Arc which are more crafted to be an experience. This is the same realm I've been working in but from totally different perspectives. With Safari, doing something that disrupts prior existing workflows—Safari has been around for decades. People rely on their bookmarks bar in a very particular way. Taking risks there comes with huge consequences and with such an incredibly wide user base. You can't design for any one particular type of user. You have to always be designing for all users. Your decisions are this matrix of complexity. You can't just say this is the better experience and roll with that 100% because there's always downsides. It's always a gradient of usage. For example, let's think about tabs. Some people use one tab at a time. Some use four to five. Some use a bunch more. Some are doing multiple windows. Some are using profiles. They want to have a bunch of windows open because they know that window space is where they want to go. You can't make a decision for tabs without considering literally every possible use case. That is always a very interesting way for me to think because it takes me out of myself. I could say this is how I want to use it, but then I have to immediately dismiss that as just one tiny speck in the spectrum of different ways it's going to be used. That's always challenging.
插播一条快速信息,然后我们继续。我提前看到了 DES 的新内测版本,我告诉你,他们把无限画布提升到了一个全新水平。不仅仅是随机模型或一次性原型。你可以直接在画布上运行真实产品页面。想想这对并行探索意味着什么。你可以随意分支,让智能体并排探索多个想法,这对团队对齐非常完美,因为你们有一个空间来审查原型、留下评论,甚至让智能体根据反馈采取行动。这很了不起。但问题是,DES 每周只接纳几个团队。但如果你访问 dive.club/desen,就可以预约与他们的联合创始人 Gab 聊天,告诉他是 Ridd 推荐的,就能插队。所以去 dive.club/desen 吧,就是 dsn。如果你还没有尝试 Paper,尽管感觉这个播客里每个人最近都在谈论它,他们刚刚让入门变得更容易了,因为现在你可以直接从 Figma 复制粘贴到 Paper 的画布中。所有图层及其属性,包括图片和 SVG,都会瞬间导入。这非常重要,你今天就可以试试。去 dive.club/paper 开始吧。现在,回到正题。
A quick message and then we can jump back into it. So, I got a sneak peek of DES's new private beta release and let me tell you, they are taking the infinite canvas to a whole other level. It's not just random mock-ups or one-off prototypes. You can run real product pages directly on a canvas. Just think about what that unlocks for parallel exploration. You can branch as much as you want. Get the agent to explore multiple ideas side by side, which is perfect for aligning the team because you have one space to review prototypes, leave comments, and even get the agent to act on the feedback you receive. It's a big deal. But here's the thing. DES is only onboarding a few teams every week. But if you go to dive.club/desen, you can book a chat with their co-founder, Gab, and tell them Ridd sent you to jump the queue. So head to dive.club/desen. That's dsn. If you still haven't tried Paper, even though it kind of feels like everybody on this podcast is talking about it lately, they just made it way easier to get started because you can now copy and paste from Figma directly into Paper's canvas. All of the layers and their properties, including images and SVGs, are imported in an instant. It's pretty big deal and you can try it out today. Just head to dive.club/paper to get started. Now, on to the episode.
当你为这样渐变的用例进行设计时,是否意味着你必须更加数据驱动,因为你要看到所有不同的视角?比如,告诉我当你为十亿用户以一百万种不同方式使用产品而设计时,你如何弄清楚这些用例是什么。
When you're designing for a gradient of use cases like that, does that mean you just have to be more data driven and everything because you have to see all the different perspectives? Like, talk to me about how you even figure out what those use cases are when you're designing for a billion people using a product a million different ways.
你可能觉得数据驱动是一种方法,也许确实如此,但根据我的经验,主要还是靠反馈。人们会说‘这个对我不起作用’。你很快就能听到,因为浏览器的另一个特点是人们非常依赖它。如果他们的工作流程受到任何干扰,他们会非常迅速地表达不满,因为他们真的很依赖这个工具,但同时他们大多没怎么思考它。所以直到你做出改变并开始测试,你才会发现。在 The Browser Company,我们的方法是:一旦有了想法,就放到内部构建中,每个人立即使用,因为你不知道什么会奏效,直到它落到人们手中。所以我们迭代非常快。如果失败了,我们马上停止,重新开始。我们一直这样工作,我认为这是非常有效的方式,因为我们在表达工作方面是一个相当公开的公司,但失败、放弃和重新开始的事情比我们表达出来的多得多。最终进入公众应用的决定都经过了一个过程。这个过程与 Apple 设计的刻意性截然不同。我们的设计非常自发,由感觉驱动。这在我们的思考方式中极其重要。它有没有让你说‘这更好?’这是一种感觉吗?例如,我们最近一直在思考清晰度,像一股清新的空气。我们有一个叫做“晨间简报”的功能,在你一天开始时,它会出去看看你的世界里发生了什么,然后给你一份关于最重要事情的简报。设计是这样的:当你打开它,首先看到一幅画和一个小副标题描述你的一天。它总是乐观的一面——‘你的上午很忙,但下午你有时间工作’——然后你需要与之互动。有开放的空间。当我向上滚动时,我看到前两三个任务,但不会感到不知所措。如果我打开另一个工具,可能会看到 12 件事情要做。但这里一次只给你一点点,让你一直感到舒适。所以这种为感觉而设计非常重要。
You would think data-driven would be a way to do it, and it probably is, but in my experience it's mostly feedback. People will say, 'That's not working for me.' You hear it quickly because another element of browsers is that people rely on them so much. If their workflows are interrupted in any way, they are extremely quick to be vocal about it because they rely on it as a tool, but at the same time, they're mostly not thinking about it. So you don't find out until you make the change and start testing it. At The Browser Company, our entire method is: as soon as we have an idea, we put it in an internal build, and everybody uses it immediately because you have no idea what's going to work until it's in people's hands. So we have extremely quick iteration. If it's failing, we stop right away and start again. That's how we work, and the company has always worked that way. I think it's an extremely effective way of doing it because we're a pretty public company in how we express our work, but the amount of things that fail and drop and start over is a lot more than we ever express. The decisions that end up in the app publicly have always been through a process. It's a very different process from the deliberate nature of Apple's design. Ours is really spontaneous and driven by feelings. That's extremely important in how we think about it. Did it make you say, 'This is better?' Is it a feeling? For example, we've been thinking a lot about clarity, like a breath of fresh air lately. We have something called the Morning Brief at the beginning of your day. In India, it'll go out and see what's going on in your world and deliver a brief about the things most important to you. But the design is: when you open it, the first thing you see is a painting and a little subtitle describing your day. It's always on the optimistic side — 'Your morning is busy but your afternoon you have time to work' — and then you have to engage with it. There's open space. When I scroll up, I see my first two or three tasks, but I'm not overwhelmed. If I open another tool, I might see 12 things to do. But this gives you a little at a time to make you feel comfortable. So that design for feeling is really important.
我们再深入一点。作为设计师,你还需要做出哪些心理转变?从一个虽然技术上设计的是同样的表面区域,但不再是纯粹实用性的世界,转变为你在创造所谓的体验。你所描述的 Dia 远远超越了 Safari 那种原始的隐形。你在某种程度上应该知道你在使用 Dia。它确实比 Arc 整体存在感更弱。当我开始使用 Arc 时,你能感觉到——就像这些人在享受乐趣。就这样,对吧?就像……
Let's go a bit deeper. Are there other mental shifts you've had to make as a designer? Moving from a world where, even though you're designing the same surface area technically, it's no longer just pure utility. You're creating what you call an experience. Everything you're describing with Dia is so many levels past the raw invisibility of Safari. You're supposed to know you're using Dia to some degree. It's definitely toned down in overall presence from Arc. When I started using Arc, you could feel it — it was like these people are having fun. End of story, right? Like...
我的侧边栏上有个牛仔布大脑,你知道,Arc 就是那样的。尤其是那个时刻,我就想,‘哇,他们做这个东西太开心了。’这引起了人们的共鸣,因为如果你关心产品开发,每次小更新你都能参与其中,并想,‘哇,这对我来说很有趣。真不敢相信你想到了这个。’Arc 的问题在于:它没有一个完全定义的身份。这是一个巨大的实验,在很多方面都成功了,但想法太多。到了某个点,你不得不问,‘它到底是什么?’我认为 Dia 从那个点出发。我们实际上从一开始就定义了我们要创造什么。我们想要一个更容易的上手过程。当你第一次使用 Arc 时,有太多新东西——如果你愿意探索就很好。但对于一个那天早上刚从 Chrome 切换过来的人,他们可能会想,‘我不知道我今天有没有精力学习这个全新的系统。’使用 Dia,你可以像 30 分钟前使用 Chrome 一样开始使用它,然后随着时间的推移引入复杂性。也许当你开始使用足够多的标签页时,会弹出一个提示:‘你知道可以使用侧边栏吗?也许现在是开始使用的好时机。’所以你引入了 Arc 中存在的复杂性,但以与你的交互方式有意义的方式随时间引入。如果你是一个一直只用四个标签页的人,你永远不会看到那个提示,而且它可能与你无关。所以从第一天起就做出这样的决定,是 Dia 成功的因素。
I had a denim brain on my sidebar, you know, like Arc was there. Especially for that moment, I was just like, 'Wow, they are having so much fun making this thing.' And it resonated with people because if you care about product development, with each little update you could be part of it and think, 'Wow, that was fun for me. I can't believe you thought that.' There's the downside of what happened with Arc: it didn't have a totally defined identity. It was a huge experiment that ended up working in a lot of ways, but it was overflowing with ideas. At some point you had to question, 'What is it?' I think Dia starts from that point. We actually defined what we were trying to create from the very beginning. We wanted to have an easier on-ramp. When you first got into Arc, there was so much new — great if you're willing to explore. But for someone who switched from Chrome that morning, they might think, 'I don't know if I have it in me to learn this whole new system today.' With Dia, you can start using it exactly like you were using Chrome 30 minutes earlier and just go with it, then introduce complexity over time. Maybe a little popup fires off once you start using enough tabs: 'Did you know you can use a sidebar? That might be a good time to start.' So you introduce the complexity that existed in Arc, but over time in a way that's meaningful to how you interact. If you're the person who uses four tabs all the time, you'll never see that, and it's probably not relevant. So making decisions like that from day one has been a success in Dia.
这个话题有很多可以聊的。我想用你的个人设计原则作为起点,因为你在网站上写过它们。你能给我们概述一下吗?然后我们可以用它们作为视角来审视你的工作,讨论设计过程以及你在 Dia 上纠结的事情。
There's a ton to talk about around this topic. I want to use your personal design principles as a launching point because you've written about them on your website. Can you give us the rundown? Then we can use those as a lens to view your work and talk about the design process and things you're wrestling with with Dia.
这是一种不断演进的思想,但就目前而言,我认为有三个价值观对我有效。它们相互配合,形成了我相信的东西。首先,简洁设计的概念总是吸引我,但它有缺点。其次,追求实用的决策在很多情况下最终非常有价值。你可以非常异想天开,有不同类型的设计适用于不同情况,但在处理实用型应用时,实用的决策通常最有价值,并且如果用户来自其他产品,造成的干扰最小。最后,以极高的质量做这些事情——一个非常高的工艺水准。
This is an evolving type of thought, but where I'm currently at, I think there are three values that work for me. They interplay together to create something I believe in. First, the concept of simple design is always attractive to me, but it comes with downsides. Second, aiming for practical decisions ends up being really valuable in a lot of situations. You can be extremely whimsical, there are different types of design beneficial for various situations, but when working on utility-style apps especially, practical decisions are often the most valuable and cause the least interruption if users are coming from something else. Finally, doing these things at an extremely high level of quality — a craft bar that's really high.
很多时候你可以通过那个步骤把个性加回来。但真正的作用是,如果你有一些简单实用的决策并执行得非常好,它会让你对你所交互的体验产生信心。我喜欢的应用类型,比如 Things 3,一个待办事项列表,它真的很有效,因为它是经过深思熟虑的。同时,它就是好用。现在有趣的是,我认为人们有自己的思维框架非常重要,用来定义他们想用设计做什么,因为工具在快速变化。很容易被工具牵着走,让工具引导你的路径。但如果你始终拥有这个如何思考的框架,那么你就会用工具来执行那个框架,而不是被工具影响,执行那些不符合你目标的事情。所以我认为现在比以往任何时候都更需要这些系统。每当我提到价值观或原则,每个人都似乎回避它们。没有人想思考或谈论它们。但在许多作品的过程中,如果你有这样的东西,它会变得有主题性,人们知道你想做什么,你就会得到你想要的那种工作。所以从长远来看,这对你很有好处。
So you can add back the personality through that step a lot of the time. But what it does is if you have these simple practical decisions executed at a really high level, it gives you a feeling of confidence with the experience you're interacting with. The type of apps I'm drawn to, like Things 3, a to-do list, it really works because it's been thought through all the way. At the same time, it just works. What's interesting now is that I think it's really important for people to have a framework of thinking for themselves, defining what they want to do with design, because tools are changing rapidly. It's easy to get pulled into the tool and let it guide your path. But if you constantly have this framework of how to think, then you use the tools to execute that framework, rather than being affected by the tool and executing things that don't match your goals. So I think it's more important than ever to have these systems. Whenever I bring up values or principles, everyone seems to avoid them. No one wants to think or talk about them. But over the course of many works, if you have something like that, it becomes thematic, and people know what you want to do, and you'll get the type of work you want. So it benefits you a lot in the long run.
我暂时先搁置“简洁性”这个话题,因为我想马上回到它。但让我们更明确一点,因为我觉得你刚才以一种有趣的方式谈到了被工具牵引。你能不能分享一个假设或例子,说明那种失败状态是什么样的?不根植于价值观,让工具把你拉到你本不该去的地方,那是什么样子的?
I'm going to put a pin in simplicity because I want to come right back to it. But let's add a bit of clarity because I think you were talking about being pulled by the tools in an interesting way. Is there a hypothetical or an example of that failure state that you can share? What does it look like to not be rooted in values and let the tools pull you toward a place where you probably shouldn't have ended up going?
我现在可以用以前不会的方式写代码、写生产级代码。有时候直接去做这些改动非常吸引人。但我发现,在 The Browser Company 这样的规模下,持续创建设计并与工程师分享比深入具体工作更有影响力。如果我分发更多的设计,我也就分发这些设计附带来的问题。而如果我试图自己搞定所有事并修复问题,我会浪费本可以用来执行其他有助益的设计的时间。我在思考我在这等式中的独特价值是什么。因为有了这些价值观,我倾向于往回缩减。我可以往回拉,让它更简单,让用户更容易理解。是的,我关心按钮是否完美工作。但如果我一直停留在等式这一端,在这个领域思考,那我在执行领域的新颖性就不如这里,因为现在每个人都能执行。
I can write code and I can write production code now in a way that I couldn't before. Sometimes it's very intriguing to just go make those changes. What I find a lot of the time is that at the scale I work at The Browser Company, it's more impactful to keep creating designs and sharing them with engineers rather than going too much into the work specifically. If I distribute more designs, I am distributing the problems that come with them. Whereas if I try to do it all myself and fix the problem, I would be wasting time that I could have spent executing other designs that are helpful in other ways. I'm trying to think about what my special sauce is in the equation. Because of these values, I tend to reduce things back. I can pull things back, make them simpler, make them more understandable for the user. Yes, I care about making sure that button works exactly right. But if I keep staying on this end of the equation where I'm thinking in this realm, I'm more novel there than I am in the execution realm, because everyone can kind of execute right now.
对,完全正确。每个人都能执行。就在昨天,我在玩一个 Mac 应用,启动本地预览构建时,我有了一个关于选项卡内加载状态的想法。实际上我在一次探索中做过类似 dia tabs 的东西。我后来走了不同的方向,但我想,“哦,我把它搬到这里来,就能删除整个其他原语了。”哇,真是个绝妙的想法。我仍然觉得这是个好主意。但我开始构建它,然后意识到我们没有很好地处理这种错误情况。然后我突然开始审视 Aurelius 中所有不同的错误情况和所有失败状态。我有了那一刻,“哦,这是个陷阱。我走得太远了。我现在花了 90 分钟设计错误状态,坦白说这些根本不是我该考虑的。这不是我的独门绝技。我的独门绝技是这个组件可能的系统级想法。如果我当时停在那里,我现在可能已经在做其他能发挥我独门绝技的事了,而不是迷失在这些错误状态中。”现在这个陷阱每天都会出现。当你说现在每个人都能执行时,找到那条界线就成了设计师的新挑战。你真的在执行层面实现差异化吗?也许,也许不是。
Yeah, that's totally right. Everybody can execute. Even yesterday, I had this idea where we were spinning up local preview builds in this Mac app we're playing with. I had this idea for a loading state inside the tab. I actually worked on something similar to dia tabs in one of my explorations. I ended up going a different direction, but I thought, "Oh, I'll just bring that in here and it'll allow me to delete this entire other primitive." Wow, that's such a good idea. I still think it's a good idea. But I started building it, and as I started building it, I realized we're not handling this type of error case well. Then all of a sudden I'm looking at all the different error cases in the Aurelius and all these failure states. I had this moment of, "Oh, this is a trap. I've gone too far. I'm now 90 minutes into designing for error states that frankly I have no business thinking about. It's not my special sauce. My special sauce was the system-level idea for what this component could be. If I had stopped there, I would probably already be working on something else where I could deploy my special sauce, and I wouldn't be lost in these error states." That trap exists every single day for me now. Figuring out where that line is, is the new challenge for a designer when you said everybody can execute now. Are you really differentiating on the execution level? Maybe, but maybe not.
说出来有点不好意思,但在个人生活中,我写代码比以往任何时候都多。每天晚上,我用 Claude Code 作为消遣,捣鼓我的个人网站什么的。但在工作中,我实际上更多转向了 Figma。我的意思是,我甚至更远离原型设计,这听起来很疯狂,因为我一直认为自己是个原型设计师。但我现在认为,“就这样吧。我们先把它跑起来,细节后面再解决。这是视觉效果。这是基本工作方式。我们先做起来。”然后我们再回头慢慢加入魔法。我发现这现在反而有点新颖。不是每个人都这样工作。我对此有点紧张,因为这在这个时代听起来太激进了,但这很有效,因为人们编码的速度非常快,他们实际上可以处理更多的设计。也许这就是我应该做的,因为我确实知道怎么做那个部分,而且不是每个人都有那种特定技能。所以——
I feel embarrassed saying this, but it's almost in my personal life, I write more code than ever. I'm in Claude Code every night as my downtime, working on my website or whatever. But at work, I've actually shifted more towards Figma. When I say that, I mean I'm shifting even more away from prototyping, which sounds insane because I've always considered myself a prototyper. But I actually think, "Hey, this is it. Let's get it going and figure it out down the road. Here's the visual. Here's how it basically works. Let's get it going." Then we come back to it and add the magic slowly over time. What I find is that it actually feels kind of novel right now. Not everyone works this way. I'm nervous about it because it sounds so radical for this moment, but it's been effective because people are just cooking up code so much faster that they can actually handle more designs. Maybe that's what I should be doing, because I do know how to do that part for sure, and not everyone has that particular skill set. So,
有趣的是,我们生活在一个这样的时代,这种观点竟然被认为是极其新颖的。
It's funny that we live in a day and age where this is an incredibly novel take.
对吧?是啊,感觉有点反直觉,因为当然我更想参与到最终结果中,但某种程度上依赖大公司的经验。沟通也是一种设计技能,比其他任何东西都重要。
Right? Yeah, it feels backwards because, well, of course I would want to be more involved in the outcome, but kind of relying on bigger company experience. Communication is also a skill of design more than anything.
能够快速沟通、传达信息,设定我们做什么和不做什么的边界,以及做到什么程度——这也是我一直在投入的事情。我有多快能给你所需的信息?我能多快做出一个稳固的决策?今年我在 Obsidian 里建立了一个叫“决策”的文件。每当我做出一个设计决策,我就把它写进去,然后几周或几个月后回过头来看它是否成功、失败,或者需要改变什么。我基本上是在复盘,看看自己到底在哪里做出了糟糕的决策。因为未来我最大的价值在于能做出更成功的决策,而这正是设计将要变成的东西。
And being able to communicate quickly, get it through, set the boundaries of what we're doing, what we're not doing, how far to take it. That is something I've been investing in more as well. Just how fast can I get you the information you need? How quickly can I make a decision that's sturdy? This year I started a file in my Obsidian called 'decisions'. Anytime I make a design decision, I write it in there, then go back weeks or months later to see if it was a success, a failure, or what had to change. I'm essentially going back to see where I'm actually making bad decisions. Because the highest value of me in the future is if I could make more successful decisions, and that's what design is going to turn into.
你是否能看到,基于这些决策日志和反思,自己在哪些地方调整了作为设计师的实践?
Are you able to see places where you've tweaked your practice as a designer based off of those decision logs and reflecting on them?
对我来说,最大的弱点是冲动。如果我不停顿一下,有时我会做出一个在当时看起来完全没问题的快速决策。但通常决策需要的意识层级比你预期的更多。它当时可能看起来简单,但每次在做决策前停顿一下,重新考虑更深层次的选项,能防止你把自己逼进一条糟糕的路。我喜欢快,快速回应,快速行动。但事实是,如果我过于迅速而不重新考虑,错误往往就出在这里。重新考虑常常会拖慢别人的速度,他们不喜欢听到我们已经深入其中、几乎完成了,但有时只是停顿一下,问问自己“我们走在正确的道路上吗?这是我们想要的结果吗?”在最终确认前再多过一遍,这本来可以帮我避免几次失误。
Yeah, for me the biggest weakness is impulsiveness. If I don't take a beat sometimes I might make a quick decision that seems fine in the moment. But often decisions require an extra level of awareness than you expect. It may seem simple in the moment, but at least taking a beat before the decision and reconsidering the deeper set of options every time prevents you from pigeonholing into a bad path. I like to be quick, respond quick, act quick. But the fact is that's where I make my mistakes if I'm too rapid and don't reconsider. Reconsidering often slows people down, and they don't want to hear that we're deep in something and almost done, but sometimes just taking a beat and asking, 'Are we on the right path? Is this the outcome we want?' and going through it one more time before saying yes could have saved me a few times.
没错。这很有意思,也和你之前说的联系起来了。我发现,那个额外的反思循环和练习,往往是我达到简洁的唯一方式。我的第一反应可能是正确的想法,我们投入了很多重复练习。这对我来说并不罕见。有时我会回到那个想法,但然后就像这样:好吧,知道方向是对的,但再多过一遍,问自己:我能提炼、删减或合并什么?
Yeah, totally. It's interesting too, even to connect with what you were saying before. It's that extra loop and practice of consideration that I find often is the only way that I can get to simplicity. I might have the right idea as my knee-jerk reaction. We put in a lot of reps. Like that's not uncommon for me. Sometimes I return back to the idea, but then it's like, okay, knowing that this is directionally correct, but then going through it one more time and be like, what can I distill or cut or combine?
对,这是我认为苹果做得比任何人都好的地方。部分原因在于一年一度的发布周期。在周期中的任何时刻,你都可以问自己“这真的是正确的方式吗?”然后回到起点。人们几乎预期那种中断是过程的一部分。过程本身很大程度上就是可以说:“实际上,我们走错了路。从这个位置重新开始。”我认为这需要很大的信心和较低的自我意识,还有情感上的觉察和舒适感。当你深陷其中时,说“我们要重新开始,而且现在我们只能明年再做,因为没时间了”是很糟糕的。所以有时候这确实是正确的选择,而这样做需要很大的信心,因为你需要相信大家能一起挺过去。
Yeah, this is something I think Apple just does better than anyone else. And I think it's partially because of the one-year release cycle. At any point in that cycle, you can kind of be like, 'Is this really the right way?' and you can go back to the beginning. People almost expect that disruption as part of the process. It's very much part of the process to just be like, 'Actually, we're on the wrong path. Let's start over from this position.' And I think that requires a lot of confidence and low ego, emotional awareness and comfort. It sucks to be deep in something and be like, 'We're starting over, and by the way, now let's do it next year because we just don't have time.' So sometimes it really is the right call, and it requires a lot of confidence to do something like that because you need confidence that you're going to stick together through it.
我们来聊聊你一直做的这类产品中的简洁性。我读过你关于简洁的文章,你提到老式计算器,它们非常专用,只做一件事:计算。我的问题是,当你在开发一个不仅是一个浏览器,而且是一个 AI 贯穿产品内核的浏览器时,它能做任何事,你如何考虑唤起简洁的好处?
Let's talk about simplicity through the lens of the type of product that you've been working on. I read your writing on simplicity and you reference old calculators, how they're very purpose-built, they do one thing: calculations. My question is, how do you think about evoking the benefits of simplicity when you're working on something not just like a browser, but also a browser in a world where AI is just woven through the fabric of the product, so it can kind of do anything?
我认为这往往是在某个层面上满足预先的期望。例如,做 WhatsApp 时,我比以往任何时候都更多地进入了这种心态。它是一个聊天应用,你应当能在里面聊天。任何超出这个范围的东西实际上会削弱它在你生活中的有用互动。这是创始人的理念:他们有一种不可思议的驱动力,让它变得简单、快速、安全。他们对产品应该是什么有着非常强烈的价值观。我看到如果你在产品生命周期中坚持这些价值观,人们会相信它、信任它。WhatsApp 非常流行,人们用它来沟通,这让我非常兴奋。但对于任何实用工具,如果你依赖它为你完成一项任务,并且你希望它做好那件事,那它就必须是焦点。在你提到的那篇文章中,我描述了如果你的计算器开始有软件更新或新功能可以开启,你会说“我只是想算个数。”而现在软件已经远远超出了那个点,我们接受了所有这些行为,而这些行为在一个你用自己的钱买的硬件设备的世界里可能是不可接受的。但付费产品有点像那样:如果你为某样东西付费,你期望从中得到一些东西,而那种体验应该是首要的。当然还有空间在旁边尝试其他小功能,但焦点应该放在你获得的价值上。而且在那篇文章中,我也展示了相反的情况:没有产品真正完全以那种方式成功过。
Yeah, I think it's often about meeting prior expectations on one level. For example, working on WhatsApp was where I got into this mentality more than ever. It's a chat app; you should be able to chat in it. Anything beyond that actually dilutes the fact that it's a useful interaction in your life. This was from the founders: they had an incredible drive to make it simple, fast, secure. They had really strong values about what the thing needed to be. And I saw that if you hold on to those values through a product's life, people will believe in it and trust it. WhatsApp is very popular and people use it to communicate, and that got me really excited. But for any utility product, if you're relying on it to do a task for you and you want it to do that one thing, it's got to be the focus. In that writing you referenced, I described that if your calculator started having a software update or a new feature to turn on, you'd be like, 'I'm just trying to make a calculation.' And software is so beyond that point now where we accept all these behaviors that probably wouldn't be acceptable in a world where you're thinking about just a hardware device you bought with your own money. But a paid product is kind of like that: if you pay for something, you expect something out of it, and that experience should be primary. There's still room to try out other little features on the side, but the focus should be on the value you're getting. Also, in that piece, I show the contrary: no product ever really fully succeeds that way.
我不确定我有没有提过,但我想到了 Notion。Notion 在某种程度上几乎什么都能做。我最初的想法是,‘哦,那是个不错的简单文本应用。’但它已经进化了很多。我认为简单设计的反面是,很多时候人们希望工具更少。如果我能用 Notion 做,我就会用 Notion,因为我本来就在用 Notion。
I think I don't know if I said it, but Notion kind of comes to mind. Notion does kind of everything in some ways. The way I thought about it originally was, 'Oh, that's a nice simple text application.' But it's evolved so much from there. I think the counterpoint to simple design is that people want fewer tools a lot of the time. If I can do it in Notion, I'll do it in Notion because I already use Notion.
完全同意。
Totally.
因此,增加复杂性是有价值的。你可以看到——我认为微软或许是有史以来最好的例子。我不常听到‘哦,微软设计是简洁的巅峰’这样的话。它其实是相反的。但人们获得了价值,因为你可以在里面做各种不同的事情。他们并非每件事都做得完美,但你可以在里面做所有事情——这就是那种感觉。作为设计师,我们比历史上任何时候都更能感受到这种拉力,因为我们可以将那么多新功能外包给模型本身。所以无论你从模型的哪个入口点进入,你几乎可以做任何事情。只需要一套非常基础的基元,就能让人真正做任何事。而那种同时向各个方向成长的诱惑从未如此强烈。
And so there's a value to adding complexity. You see this — I think Microsoft is maybe the best case of this ever. I don't often hear, 'Oh, Microsoft design is the pinnacle of simplicity.' It's kind of the opposite. But people got value because you had all the different things you could do out of it. They don't do all those things perfectly well, but you could do all the things out of it — that was the vibe. We're experiencing the pull of that as designers more than any other point in history, because we get to outsource so much of that new functionality to the models themselves. So wherever your entry point is to the model, you kind of can do anything. It takes a very barebones set of primitives to allow someone to literally do anything. And that temptation to grow in every direction simultaneously has never been more present.
我想稍微反驳一下你的一些说法。因为今天大多数人——绝大多数,大概 99%——并没有真正把 AI 作为浏览体验的核心部分,除了可能在 Chrome 顶部看到 Google 预生成的答案,对吧?所以 DIA 的价值主张,至少我理解的是:‘嘿,实际上 AI 应该更集成到你的浏览器里。用 DIA 吧。’我想象你会感到压力,要把人们吸引到一些更有趣的 AI 用例上,而这些用例可能与浏览器核心要完成的任务并不直接相关。这在多大程度上引起了你的共鸣?作为设计师,那是什么样的感觉?
I'm going to push on some of the things you're saying a bit. Because most people today — by most, it's probably 99% — aren't actually really using AI as a core part of their browsing experience, other than maybe a pre-generated answer by Google at the top of Chrome, right? So the value proposition of DIA, at least as my interpretation of it, is: 'Hey, actually AI should be a little bit more integrated into your browser. Use DIA instead.' I would imagine you'd feel a little bit more pressure to pull people into some of these more interesting AI use cases that are potentially tangential to the core jobs to be done you associate with a browser. How much does that resonate, and what is that like as a designer?
我认为 DIA 的演进是这样的:我们从‘什么是互联网电脑’这个想法开始,现在有了这项新技术作为其中一部分。早期我们接触的 LLMs 水平让我们觉得它有点像带聊天的浏览器。那是我们的第一个落脚点。后来 LLMs 变得更好,我们意识到浏览器可以制作东西。它可以为你生成报告、演示文稿——可以做所有这些好东西。于是它演变成了一个你还可以制作页面的浏览器。那是下一个想法。我们现在意识到,这个产品真正有价值的状态是:浏览器就是上下文——而且是毫不费力的上下文。你只需要在浏览器里做你的工作,但浏览器是有能力的。所以我认为 Morning Brief 算是定义了第一步。它就像:你生活中的所有事情,我可以用一种帮助你前进的方式向你汇报,而你什么都不用做。我只是在为你增加价值,因为你已经在使用你正在使用的工具。随着技术在我们脚下变化,我们不断进化,能做更多事情。但最终目标是互联网电脑。我知道这听起来很夸张,但它确实存在,这应该成为你进入那种计算的界面。它能做的事情越多越好,因为你花了那么多时间在浏览器里——为什么不把功能放在那里呢?
I think the evolution of DIA has been: we started from this idea of what is an internet computer, and now you have this new technology as part of it. The level of the LLMs we were dealing with early on made us think of it as kind of a browser with chat. That was our first landing point. Then the LLMs got better, and we realized the browser can make things. It can make you reports, presentations — it can do all this nice stuff. So then it evolved into a browser where you can also make the pages essentially. That was the next thought. What we've come to realize now is that the truly valuable state of this thing is that the browser is context — and it's effortless context. You're just doing your work in the browser, but the browser is capable. So I think the morning brief kind of defines this as the first step. It's like: here's all the things in your life, and I can report back to you on them in a way that helps you move forward, and you don't have to do anything. I'm just adding value because you're using the tool you already use. It's a constant evolution as the technology changes underneath us of what we're capable of doing. But the end goal is an internet computer. I know that sounds really bombastic, but it is a thing, and this should be your interface into that type of computing. The more that it can do, the better, because you spend so much of your time in the browser — why not have the features there?
有一个我总在问自己的问题。如果公司反过来申请与你交谈,而不是你去找他们,会怎么样?这个问题正是全新 Dive 人才网络的基础,而且它正在发挥作用。现在,我正在帮助许多我认识的最令人兴奋的初创公司,雇佣收听这个节目的设计师和开发者。所以,如果你好奇外面有什么机会,也许你想加入我的名单,或者你甚至正在寻找下一个设计人才,请访问 dive.club/talent 立即加入。
There's one question that I can't stop asking myself. What if companies applied to talk to you rather than the other way around? And that question is the foundation for the all-new dive talent network and it's working. Like right now, I'm helping many of the most exciting startups that I know to hire the designers and builders who listen to this show. So, if you're curious what might be out there, and maybe you want to get on my list, or maybe you're even looking for your next design hire, head to dive.club/talent to join today.
我记得在飞机上读 Josh 关于互联网电脑的初步文章,觉得非常引人注目。我也记得大概几年前采访过 Nate Parrot,他是浏览器公司的第一位设计员工。他提到的一件事——可以说是你们内部在纠结的一个原型——是:‘有没有一个新标签主页?如果你按 Command T,会看到什么?’在某种程度上,Daily Brief 是同一个想法的延伸。那个脉络一直存在。几乎任何设计过浏览器的人都想过这个。为什么它现在奏效了?需要什么?关于 Morning Brief 最终变成什么样,内部有哪些争论?不同的设计探索,什么没有发布——你能做些什么来稍微澄清那个设计过程是怎样的?
I remember sitting on a plane reading Josh's initial post about the internet computer and finding it very compelling. I also remember interviewing Nate Parrot, the first design hire at the browser company, probably a couple years ago now. And one of the things he talked about — call it a prototype that you all were wrestling with internally — was: 'Is there a new tab home screen? If you hit Command T, do you see anything?' In some ways, the daily brief is an extension of that same idea. That strand has been forever. Almost anyone who's designed a browser has thought of this. Why did it work now? What did it take? What were some of the internal debates in terms of what the morning brief became? Different design explorations, what didn't ship — anything you could do to add a little clarity around what that design process was?
我们做的第一件事是引入了一个叫 New Chat 的功能。这是浏览器里更高级别的 LLMs。我们当时觉得,‘哇,它什么都能做。’有点让人不知所措。但我们内部讨论了一下:‘如果它能自动完成这些,那该多酷。’就这么简单。所以,把它直接交付给你。我什么都不想做——只需要把我用它的常见操作的价值给我。每个人都在问:‘我有什么没跟上?’人们提取出来的就是这类问题。于是 Morning Brief 就出现了,它回答了那些问题,而你什么都不用做。然后我们立刻看到它引起了人们的共鸣——他们觉得它很有价值。所以那是一个很好的产品起点。
The first thing we did was we introduced something called New Chat. This was a higher tier of LLMs in the browser. We were like, 'Wow, it does all this stuff.' It was kind of overwhelming. But we had an internal discussion: 'It would be so much cooler if it just did this automatically.' It was that simple. So, deliver it to you. I don't want to do anything — just give me the value of the common things I'm doing with it. Everyone was asking, 'What am I not caught up on?' Those were the types of things people were pulling out. So the morning brief came to you and answered those questions without you doing anything. Then we immediately saw that it was hitting with people — they found it valuable. So that was a good starting point for a product.
考虑到你在做的所有事情,我们能谈一下实用性吗?我觉得各地的设计师总是感受到一股推动力,要做新奇的事情——创造改变行业的模式。浏览器的‘下拉刷新’之类的东西是什么?我相信你经历了很多。你如何保持脚踏实地?如何知道什么时候该超越显而易见的解决方案,什么时候该选择人们熟悉的东西?
Can we talk about the practicality piece a little bit, given everything that you're working on? I think designers everywhere always feel this push to do the novel thing — to create the pattern that changes the industry. What is the pull-to-refresh for the browser kind of thing? I'm sure you're experiencing a lot of that. How do you stay grounded? What does it take to know when to push past the obvious solution versus when to just pick the thing that people are familiar with?
这个团队恰好是一群都愿意尝试提出新范式或新体验并向前推进的人。
This team happens to be a team of people that are all willing to try to come up with new paradigms or new experiences and push forward.
然后我觉得我们也有这种相反的观点,即有时明显的解决方案就是正确的解决方案。在 Dia 中,例如书签栏:我们试过所有方法。我们试过一个小背包,你可以把东西扔进去。我们想要书签,是为了支持从 Chrome 过来的用户,他们需要访问自己的书签。我们觉得可以把它们做得非常棒。我们有一篇设计文章,展示了八种不同方向的截图,我们选了其中一个,但事实上我们尝试了好几个月。最终,我们发布了一个功能几乎与 Chrome 一样的书签栏。这就是选择了明显的解决方案。不是我们想让它变得基础;作为设计师,那听起来不是我们想做的,但到了某个时候,自我就消失了,你意识到想要这个功能的人只是想以同样的方式使用它。你可以像普通书签栏一样开启或关闭它。可以创建文件夹,以常规方式打开。它满足了期望,并且缺点很少,除了我们想用它做一些神奇的事情之外。但这不是一个容易的过程;得出这个结论非常困难。我们就是找不到明显更好的方案。例如,有一个想法是,你每次拖动标签页时,稍微向上拉,页面会向下移动,你可以把它放进小存储区。感觉很不错,很酷,但它不够易发现,交互时间也长。它有一些缺点,比如动画状态和元素移动。书签栏就是这样——如果你想要这个东西,所有书签都在那里,很密集,可以直接点击。我们就让它看起来尽可能漂亮,然后继续做下一件事。
And then I think we also have this counter opinion which is sometimes the obvious solution is the right solution. In Dia, for example, the bookmarks bar: we tried everything. We tried a little backpack where you throw stuff in. We wanted bookmarks to support users coming over from Chrome, they need access to their bookmarks. We thought we could make them amazing. We have a design article showing a small screenshot of eight different directions we chose, but we tried everything for months. In the end, we shipped a bookmarks bar that is nearly identical in functionality to Chrome. That was choosing the obvious solution. It was not that we wanted to make it basic; that didn't sound like what we wanted as designers, but at some point egos go away and you realize people who want this feature just want to use it the same way. You can turn it on and off just like a normal bookmarks bar. You can have folders and open them normally. It met expectations with low downsides, other than us wanting to do something magical with it. But it wasn't an easy process; it was very difficult to come to that conclusion. We just couldn't find something remarkably better. For example, one idea was anytime you took a tab, you could pull it up a little, the page would move down, and you could put it in little stashes. It felt awesome and cool, but it was less discoverable and a longer interaction. It had downsides like animation states and stuff moving around. The bookmarks bar, if you want the thing, all bookmarks are there, dense, pressable. Let's just make it as pretty as possible and move on to the next thing.
如果你作为设计师有固定的新颖性预算,你更兴奋或更愿意把它花在哪里?
If you think about having a fixed budget for novelty as a designer, where have you been more excited or willing to spend it?
Dia 的第一阶段是,我们能不能把新颖性预算几乎全部花在正在开发的技术的新功能上?我们最初只发布了一个顶部栏,一个书签栏和基本的固定标签页。非常基础。那不是探索的起点。我们在某个时候决定,新颖性预算将完全用于学习使用这个应用所需的新东西,我们希望在这个领域有成长空间。所以,你对现有界面越熟悉,你需要动脑的地方就越少。当 Via 推出时,把聊天直接内置到浏览器里有点新颖。我们尝试了很多不同的集成方式,最终选择了最符合预期的:侧边栏作为主要交互方式,因为你可以同时拥有页面上下文和聊天,而且效果不错。那件事就是尽可能减少新颖性。
The first stage of Dia was like, can we keep our novelty budget almost entirely on the new features of the technology being developed? We shipped only with a top bar to start. We shipped with a bookmarks bar and basic pin tabs. It was bare bones. That wasn't where the exploration started. We decided at some point that the novelty budget would be completely on the new things you have to learn using this app, and we wanted room to grow in that area. So the more comfortable you were with pre-existing UIs, the less you'd have to take on mentally. When Via came out, it was a little novel to have chat built directly into the browser. We tried many different ways to integrate it and went with the most expected one: the sidebar as the primary interaction because you have the context of the page and the chat, and it works. That was about reducing novelty as much as possible.
你一直在一些小地方花费新颖性预算,通过引入一些 Arc 的功能并重新评估哪些需要存在。你能谈谈这个过程吗?也许给我们一个幕后视角,看看你如何考虑将 Arc 空间引入 Dia,以及那是什么样的?你如何为 Dia 中这个更精细的愿景找到正确的实现方式?
You have been spending it in little places by bringing in some of the Arc functionality and re-evaluating what needed to exist again. Can you talk about that process? Maybe give us a behind-the-scenes of how you're thinking about bringing Arc spaces into Dia and what that's like. How do you find the right implementation for this more refined vision in Dia?
我们有一个清单,列出了 Arc 做得非常好且人们热衷的所有功能,我们按照人们认为最重要的顺序逐一检查。曾经有一段时间没有侧边栏,那对我们来说是一个关键时刻。我们一直考虑侧边栏或顶部栏,但我们希望 Dia 在 V1 中足够差异化,这样它就不会像 Final Cut Pro 7 对比 X 那样直接竞争。当苹果发布 Final Cut Pro X 时,它没有匹配所有功能,人们很不满。同样,Lightroom CC 和 Lightroom Classic 之间也没有完全匹配。当你遇到这种接近但不匹配的情况时,只会让人失望,直到你把它补全。但我们希望 Dia 足够差异化,让你觉得这是一种不同的浏览体验。不过,我们很喜欢 Arc 中的所有功能,也希望它们在 Dia 中出现,因为我们也想享受在 Arc 中喜欢的东西。所以我们倾听用户,看看什么是对的。我们从侧边栏开始。也许在那之前就开始了,但侧边栏是一个大项目。对于我们从 Arc 引入的每一个功能,我们都会重新考虑:哪里可以改进?它如何适应 Dia 的不同之处?我们能做得更好吗?以侧边栏为例,Dia 和 Arc 的一个主要区别是 Arc 是一个单窗口应用,这对浏览器来说有点不寻常。如果你打开另一个窗口,所有内容都会同步。但 Dia 允许实例化窗口,所以你可以有一个完全不同的窗口。需要考虑的是:如果一个在配置文件 X,另一个在配置文件 Y,重叠部分是什么?实例之间共享什么?所以每个功能我们都会走过整个过程。我们还进行广泛的设计。想想侧边栏现在在左边。还能做什么?展示垂直标签的其他方式?我们试过其他方案,但侧边栏最终勾选了最多选项。所以我们选择了它。有趣的是,行业中的其他产品也经历了完全相同的侧边栏练习,每个人都得出了同样的结论:'是啊,我们做的对了。'
We have a checklist of all the things Arc does really well that people are passionate about, and we have been moving down it one by one in order of what people say is most important. At one point, there was no sidebar, and that was a moment for us. We always considered a sidebar or top bar, but we wanted to differentiate Dia enough in V1 so that it wasn't a direct competitor like Final Cut Pro 7 vs. X. When Apple released Final Cut Pro X, it didn't match all features and people were upset. Similarly, with Lightroom CC and Lightroom Classic, there wasn't a total match. When you have that close-but-not-matching situation, it leads to pure disappointment until you build it up. But we hoped Dia was differentiated enough that you'd see it as a different browsing experience. However, we love all the features in Arc and want them in Dia because we want to feel satiated by the stuff we enjoy in Arc too. So we listen to people and see what's right. We started with the sidebar. Maybe we started before that, but the sidebar was big. For every feature we introduce from Arc, we take it through the full process of reconsidering: where could it be improved? How does it fit in with the differences of Dia? Can we do it better? With the sidebar, one main difference between Dia and Arc is that Arc is a single-window application, which is unusual for a browser. If you open another window, everything is synced between them. But Dia allows instanced windows, so you can have one window completely different from another. There are considerations: if one is in profile X and another in profile Y, what is the overlap? What is shared between instances? So every feature, we run it through the whole process. We also design widely. Think about sidebar on the left right now. What else could you do? What are other ways to show vertical tabs? We tried other things, but the sidebar still checked the most boxes. So we went with it. Funny thing is, other products in the industry went through the exact same exercise with sidebars and everyone arrived at the same conclusion: 'Yeah, ours got it right.'
嗯。
Yeah.
现在很多浏览器都提供侧边栏……
And now there are a lot of browsers that offer a sidebar...
……而且它们看起来一模一样。
...and they all look exactly the same.
好了,我们来谈谈质量这一块。
Okay, let's talk about the quality piece a little bit.
我很想看看这在 DIA 中实际是什么样子的,以及你们有意在哪些方面超越基准,从工艺角度推陈出新。
I'd love to see what that looks like in practice in DIA and where you all are intentionally trying to go above and beyond and push past the baseline from a craft standpoint.
我认为 DIA 中的许多品质时刻都来自非常微小或近乎隐形的瞬间。比如我们团队的 Casper 给这些按钮添加了非常棒的交互状态:当我重新加载时,它会旋转,变成 X,然后弹回。点击箭头时它们会移动。这些只是应用中的小细节,但你可能经常操作,通过它们你能感受到精良。我参与的一个让我仍感兴奋的是 URL 栏。我们显示域名和页面标题,而非域名和 URL,但并不会限制你的操作。我一悬停,就能看到 URL;不悬停时,显示有时更有用的页面标题。这是一个极其微小的细节,但它增加了价值。你再也看不到带有数字的杂乱 URL,只需知道自己在哪个页面。对我来说,这感觉像是 URL 栏的下一个进化。
I think a lot of the quality moments in DIA come from really small or nearly invisible moments. Like Casper on our team added these really nice interaction states for the little buttons: when I reload it spins, turns into the X, and pumps back out. The arrows move when you tap them. These are small moments in the app, but things you may do a lot, and you get a sense of the refinement through them. Something I worked on that I still feel excited about: the URL bar. We show the domain and the page title rather than the domain and the URL, but you're not blocked in any way. As soon as I hover in, I have access to the URL; when I'm not hovering, I have the page title, which can sometimes be useful. This was an extremely small moment, but it adds value. You don't see complex dirty URLs with numbers ever; you just have a sense of the page you're on. That felt like the next evolution of a URL bar to me.
我真的很喜欢这个例子,因为你只有从第一原理出发、用非常细致的视角审视浏览器的用户体验,才会想到这一点。我不确定我需要多久才能想到这甚至是一个可以做的事。非常酷。
I really like that example because you only arrive there if you are going through a browser's UX from first principles with a very fine comb. I'm not sure how long it would have taken me to arrive at that as even a potential thing that you could do. It's very cool.
另一个:如果你用 Command+Shift+C 复制页面链接,它会快速改变 URL 栏,告知你发生了什么。另外,如果 URL 带有跟踪器,它会移除跟踪器并给你一个干净链接,同时提醒你文本显示“已复制无跟踪器的链接”之类的。这是另一种品质姿态。
Another one: if you copy a page link with Command+Shift+C, it'll quickly change that URL bar to give you the status of what happened. Also, if you have a URL with trackers, it removes those trackers and gives you a clean URL, but also alerts you in the text: "Copied a link without trackers" or something. That's another gesture of quality.
帮别人逆向工程一些这类东西。也许回到我们之前讨论的:这些的执行细节都不复杂。关键在于你发现它们并产生创意的能力。你有没有什么建议给那些想找到这些品质细节的设计师?
Help someone reverse engineer some of this stuff. Maybe going back to what we were talking about earlier: the execution level details are not that crazy for any of this. It's your ability to see them and have the creative idea. Do you have any advice for a designer who wants to find those quality details?
我想说这是对我之前冲动讨论的反驳:决策中的冲动可能有问题,但设计中的冲动我建议你始终鼓励。尝试脑海中冒出的随机想法,顺着那条路走,看看会发生什么。Casper 是个好例子:他到处看按钮,问“我能用它们做什么?”然后灵感就来了。他直接把它们放进应用,然后你就能发现是否有价值。我觉得就是浪费时间。我可以专注于重要的任务,但如果你不玩耍或胡乱折腾,你就不会遇到那些时刻。
I would say this is the counterpoint to my impulsive conversation earlier: impulsiveness in decisions can be problematic, but impulsiveness in your design is something you should facilitate all the time. Try out random thoughts that pop into your head, go down that path, see what happens. Casper is a good example: he's looking around at the buttons, asking "What can I do with them?" and ideas come to him. He'll just throw them into the app, and then you find out if they're valuable. It's about wasting time, I guess. I can stay on task with important things, but if you're not playing or messing around, you won't come to those moments.
我喜欢这个。“我能用它们做什么?”这个问题太有意思了。就拿那个 URL 栏来说,我认为这是一个改进。从来不会有人带着问题来找你,说“我的 URL 栏有问题”。你只有通过玩耍才能到达那里。
I like that. The question "What can I do with them?" is so interesting. Even looking at that URL bar, I think that's an improvement. Nobody ever is going to come to you with a problem and say, "I have this problem with the URL bar." You only arrive there through play.
这里还有一个不解决问题但某种程度上又解决了的例子。当我打开一个新标签页时,有一个动画:类似棱镜的效果向上移动到输入框,将你的视线聚焦到正确元素上。你可以说这不是问题,但它确实有所帮助。另外,能放动画的地方不多。页面切换时应该有交叉淡入淡出,但总觉得更慢。我试过很多次在页面间加状态变化;它必须瞬间完成。但你可以在后台做些事,比如加载新标签页。页面加载完成后,我可以在动画播放的同时开始操作,但它仍然给我一个进入体验的过渡。
Here's another one that doesn't solve a problem, but it kind of does. When I open a new tab page, there's this animation: a sort of prism effect moves up into the input, focusing your eye to the correct element. You could argue it wasn't a problem, but it actually helps a bit. Also, there aren't many moments where you can fit animations. Moving between pages should have a crossfade, but it always feels slower. I've tried many times to have state changes between pages; it has to be a snap. But you can do things on the back end, like loading a new tab page. The page is loaded, I can start taking action while that animation plays out, but it still gives me a segue into the experience.
是的。而且能放动画的地方不多。比如页面切换,应该有交叉淡入淡出,但总觉得更慢。
Yeah. And there aren't a lot of moments where you can actually fit animations in. For example, moving between pages should have a crossfade, but it always feels slower.
这是一个完全没必要存在的东西。我们团队的工程师 Adam 把它做成了一个指尖陀螺,毫无理由。这个元素也在整个应用中使用。当我收到聊天回复时,它会从新标签页变到这里,并显示当前状态。它起到了某种焦点作用。所以这个持续 UI 最终成了推动你前进的一种方式。
Here's one that doesn't need to exist. Adam, an engineer on our team, made this thing a fidget spinner for no reason. This element is also used throughout the app. When I'm getting chat responses, it changes from the new tab page into here and gives status about what's occurring. It acts as sort of a focal point. So that continued UI ends up being just a way to drive you forward.
你们在这些交互上做了不少工作。老实说,我正在用 Arc。我现在就在用 Arc 录制这个。我还在犹豫。我非常接近回到 DIA 了。空间功能对我来说很重要。这种交互细节水平在过去八个月左右进步很大。真是华丽的东西。
You guys have done some work on these interactions. I'll be honest, I'm using Arc. I'm recording this in Arc right now. I'm on the fence. I'm getting really close to coming back to DIA. Spaces is a big thing for me. This level of interaction detail has come a long way in the last eight or so months. That is gorgeous stuff.
Arc 目前的状态是经过大约五年开发的。我认为这对 DIA 的用户来说是一个有点困惑的过渡时刻,因为我们才投入一年,人们就开始评判它。我们的想法是,我们一直在不断投入努力,无论是微交互还是主要功能。我是说,我非常关注它,因为我投入太多了。
Arc in the state that it's in was developed for like half a decade. I think that was a bit of a confusing transition moment for users with DIA because we had only had like a year into it when people really started judging it. The idea is that we've just been pumping non-stop effort into both the micro interactions as well as the main features. I mean, I pay a lot of attention to it because I'm so invested in it.
但现在这个程度,你真的能欣赏这些东西和整体体验。大概 6 个月前,我们想,“哦,人们喜欢 Arc。”我们希望他们也喜欢 DIA。那么如何让他们达到那种状态呢?如何让他们拥有那种对 Arc 的喜爱感?这是不同的应用,整体体验也不同。所以并没有现成的剧本可以照搬。我们必须从一些新的角度思考,但试图带回那种感觉、那种情感,让你更投入,而不仅仅是纯粹的实用性。在切换话题之前,你还有什么其他工艺细节想展示吗?
But it's really at the level now where you can appreciate these things and the overall experience. About maybe 6 months ago, we were like, "Oh, people love Ark." Like we want them to love DIA. So how do we get them there? Like how do we get them to have that feeling that they loved about Arc? It's like it's a different app. It's like a different experience overall. So, it wasn't like it was a playbook that we could just like do exactly the same. It's like we had to think about these things from some new perspectives, but trying to bring back that feeling, emotion, and getting you invested in the thing more than just uh pure utility. Before we switch, any other craft details that you wanted to show?
所以,我们在 Arc 和 Dia 中都有的另一个交互是能够在窗口内分割标签页。我们希望让操作更清晰,因为它可能不是最常见的交互,但在很多场景中非常有用,比如你只是想比较信息,或者在一个标签页里做一件事,同时在另一个标签页查看信息。所以我们构建了这个范式:你可以拖出标签页,然后——这应该归功于 Adam Stern,他是我们设计团队的工程师——它会引导你了解将要发生的事情。基本上,拖放目标上的文字让你更清楚地知道你要做什么。不过它也有一些缺点,比如拖动标签页的空间更小了,而在 Arc 的范式中,你可以拖到整个窗口的一半。但我们认为教育元素很重要,让用户更清楚会发生什么。嗯,这是他想出的一个很酷的小交互,我真的很喜欢它。
So, another interaction that we have both in Arc and Dia is being able to split tabs within your window. And with that, we wanted to make it like more clear how to do it because it's not maybe the most common interaction, but it ends up being really useful in a lot of situations where you just are trying to compare information or do one thing in one tab and see the information in another tab. So, we built this paradigm where you could drag out the tab and then, Adam Stern built this, I should say. He's an engineer on our design team, and it just kind of guides you to what will happen. And basically just the language on the drop target then allows you to know more clearly what you're going to do. Like, it actually comes with some downsides. There's like a less space for you to drag the tab, whereas in the arc paradigm, it's like just the whole half of the window. But the education element we thought was like important to this, making it more clear like what is going to happen and yeah it was like a cool little interaction he came up with and really like that one.
太棒了。Charlie,非常感谢你的展示,我们快到结尾了,但我保留了一个最深刻、最引人入胜、最重要的问题。那就是:你最喜欢的名叫 Gabe 的设计师是谁?
That was amazing. Charlie I appreciate the tour and we're approaching the end here but I have saved the deepest most gripping most important question of all. That question is who is your favorite designer named Gabe?
Gabriel Valdivia。这根本不算是问题。呃,他可能是我最喜欢的设计师。没有其他了。
Gabriel Valdivia. Like this isn't even a question. I um he might be my favorite designer. End of story.
哦,他听到这个要飘了。
Oh, and his ego is going to explode when he hears that.
嗯,我昨晚给他发短信,问了一些快速的问题,我们可以用来结束这次谈话,其中一些实用且有教育意义,另一些则更有趣。第一个问题,我认为每个听众都能从你身上学到很多:作为设计师,你在展示和让人们对自己的作品感到兴奋方面,有哪些不太明显的技巧?
Well, I uh I was texting him last night and I asked for a few quick hitting questions that we could ride off into the sunset with and there's some some practical and educational and others are a little bit more playful. The first one I do think that we everybody listening has a lot that they could learn from you on, which is what are some of the less obvious tips that you've added to your practice as a designer when it comes to presenting and getting people excited about your work?
是的,我对这个问题感触很深。好问题,Gabe。你做得很好。它有背景。我有一个相当特别的呈现信息策略:我非常积极地引导对话到一个特定的点。我希望大家在谈话时能达成共识。这通常需要我尽可能快、尽可能清晰地提供背景,让大家跟上我的思路。因为通常来说,设计师有时对问题拥有最多的背景信息,因为他们深在其中,脑子里反复思考各种事情,对吧?但也许我处于另一个位置,我来这里是为了帮助做决定,而且我只从某一个角度思考过。所以,一是传播背景,给每个人同样的起点,然后非常清晰地框定我们要解决的问题,这样每个人都可以说,“好,我们都同意这一点,这是已经发生的,这是我们目前的状态。但这是我们的下一步。”而且,我的工作是提供解决方案,如果人们不喜欢,我能坦然接受。但更重要的是,我提供一个需要回答的问题,这样无论我们进行什么对话,结束时我们都能同意我们回答了那个问题。在实践中,我常常不立即展示设计。我会先像这样过度解释。我尽量把呈现的信息缩减到要点,因为人们会问他们需要知道的问题来填补空白。没有人对此有意见。人们会提问,但更重要的是让信息易于消化,让大家达成共识,并保持高层次的概述。我认为这就是我在大公司和个人交流中的策略。我觉得总体上很有效。
Yeah, I think this one I actually feel really strongly about. So, great question, Gabe. You're doing wonderful. It's got the context. I have a pretty particular strategy for presenting information, which is I really aggressively guide the conversation to a certain point. Like I want people to be on the same page when they're having the conversation. And that often requires me giving context as fast as possible, but as clear as possible to get people up to speed with where I'm at. Cuz like in general, I often think that designers have sometimes the most context on a problem because they're in it, you know, like they're like thinking through all of the various things from and it's just it's repeating in your head, right? But like maybe I'm in another position and I'm coming to this to kind of like help make a decision and I've thought about it from just one particular angle. So like one spreading that context out, giving everyone like the same starting point, but then also framing very clearly what the problem is we're trying to solve so that everyone can be like, "Okay, we all agree to this point that this is what has happened and this is where we're at. But this is the next step for us." And like, yeah, my job is to provide a solution and be cool about it if people don't like it. But like, but it's more important that I provide a question to have an answer to so that at the end of whatever conversation we're having, we can all agree that we answered that question. And then like in practice like I often think you know it's like I don't show the design necessarily right away. I like kind of overexplain it like this first. I try to reduce the information that I'm presenting down to just like the essential points because people are going to ask whatever question they need to know to fill in the gaps. Like nobody has a problem really with that. Like people will ask the questions but it's more so like trying to make it digestible so that everyone's on the same page and keeping it really high level to do that. I think that that's kind of like my strategy for conversations in both big companies and in one-on-one environments. It's like I think it feels pretty effective in general.
你能分享一个真实的或假设的例子,说明一个好的基础性回答问题是什么样子的吗?
Is there an example either real or hypothetical that you could share about what a good like foundational question to answer looks like?
在会议场景中,我试图聚焦的问题通常希望是比更大问题低一个层次的,对吧?希望我已经做了工作,我们处在正确的领域,并且正在解决正确的大问题。我经常呈现的问题是:如果我们走这条路,有这些缺点;如果走那条路,有那些缺点;这边有这些优点,那边有那些优点。这就像一个矩阵,我们可以指点细节,我们会处理这些,但如果我们走这条路,我对下一步有信心,可以推动项目前进。人们总是可以随时跳出这个框架,说“我们不在正确的问题空间里”。但为了对话的推进,把它限制在需要下一步解决的事情上。这通常是把问题降低一个层次,这与向高管汇报不同。高管需要的是元决策的背景,他们做的是真正复杂、可能更模糊的决定。但如果是设计评审之类的,我们就来解决当前这个问题吧。
The type of question I would try to focus like a meeting scenario on is often hopefully lower level than the bigger problem, right? like hopefully I've done the work that we're in the right space already and I'm solving for the right general problem. What I often will present as the problem is something like okay if we take this path forward these are the downsides if we take this path forward these are the downsides here's the advantages you get on this side here's the advantages this side this is like a matrix now that we can kind of point our fingers at details we'll deal with those but like if we go this path I have confidence in my next steps and I can move this project forward people will always feel comfortable like breaking out of that and being like we're not in the right problem space if that's the case. But like for the sake of a conversation, limiting it to whatever needs to be solved next to move forward. And that's often sometimes like bringing it down a level, which is sometimes different than like if you're going to like be presenting up to like an executive or something. And they like they really need the context of the meta decision. Like that's the type of decision they're making, the like really hard complex one that may be more vague or whatever. But if it's like, you know, design crit or something like that, it's like, let's just like solve this one right now or
好的,我还有两个 Gabe 的问题要问你。下一个是:你如何应对高压设计环境带来的恐慌?
Okay, I have two more Gabe questions for you. The next is, how do you manage the panic that comes with high pressure design environments?
我患有终生的焦虑症。感到紧张是我的常态。设计很棒的一点是,不知怎的我把那种焦虑转化成了动力。我常常会兴奋起来。
I have a lifelong anxiety disorder. It's just natural for me to feel like tuned up. What's cool about design is somehow I've turned that anxiety into just like motivation. Often I like get excited.
和 Gabe 共事经常给我这种感觉:我们俩合作时通常都很焦虑,但又特别兴奋,互相推着往前走,然后就变得特别疯狂。我觉得把焦虑转化成能量和动力,能让我保持干劲和兴奋。我把设计和兴奋联系在一起,这就是我的应对方式。最难的是尽量去掉一点个人色彩。在设计领域成长时,最难的是你会对自己的想法充满热情,但有时别人就是觉得它们不好,甚至你可能是对的。你的想法或执行可能很好,但人们会因为各种你预料之外的原因否定它。但愿意顺其自然,尝试别人的建议也很重要。我小时候是独生子,所以对我来说,挑战之一就是在设计过程中真正做到协作。但当你的内在自信达到一定程度时,协作就容易多了,因为我会说:'好,我试试。' Gabe 扔给我一个东西,我会说:'好,我试试。' 我甚至不质疑。即使我不喜欢,也会说:'试试看,看看结果。' 人们真的很欣赏愿意协作的设计师,愿意配合你的想法,而且带着兴奋感。如果他们看到结果后说'不,这不是我想要的',那我们就达成共识了。你可能会更喜欢我原本的想法,然后我们就继续推进。这是一种保持快速推进的方式。我总是在努力确保我把创造力和脑力资源投入到那些我知道是坏想法的事情上。我会投入时间,但我不想为了自己的私利而破坏想法。我一直
Working with Gabe often does this to me a lot, which is like when we work together, we're both probably really anxious, but we get really excited and push each other and we're just like do it. It becomes really frantic. I think turning the anxiety into energy and motivation keeps me going and excited. I associate design with being excited. That's how I deal with it. The hardest part is trying to remove the personal element a little bit. The hardest part about coming up in design is you're going to be passionate about your ideas and sometimes people are just going to think they're bad and you might even be right. It's still a good idea or good execution and people might be down on it for all sorts of reasons you can't expect. But being willing to go with the flow, try out what other people suggest. I was an only child growing up, so one of the challenging parts for me was being truly collaborative in the design process. But at some point when internal confidence comes up to a level, it gets way easier to be collaborative because I'm like, 'Yeah, I'll try it.' Gabe throws me something, I'm like, 'Yeah, I'll try it.' I don't even question it. Even if I don't like it, 'Let's try it. Let's find out.' People really appreciate collaborative designers, people who are willing to work with you and whatever you're thinking about, but also coming with excitement. If they see it back and they're like, 'Nope, that's not what I was hoping it would be like, then boom, we're on the same page now. You're probably going to be more into the thing that I was into and we're moving forward.' It's just a way to keep it going really fast. I always struggle to make sure that I'm dedicating the amount of creativity and mental resources to the things that I know are the bad ideas. I'm going to put in the reps, but I don't want to sabotage the idea for my own selfish gain. I've been
这只是个样品,它看起来就是这样的。你想看它的样子。这就是它的样子。我们希望很快就能继续推进。
It's just a sample, this is what it looks like. You wanted to see it. Here's what it looks like. We're going to hopefully be moving on quickly.
看起来和我预料的一样糟糕。
Looks just as bad as I knew it was going to look.
好,在结束之前最后一个问题。你什么时候把 Bread Time 带回来?
All right, last question before I let you go. When are you bringing back bread time?
好,这就是那个秘密单集。我记得大概是两年前录制的,我们用视频形式录的,很现代。我们俩当时都说'现在还不是时候'。我们录完了,两人都说'现在不是时候'。其实非常有趣。录完之后六个小时,我都在想'我等不及再来一次了'。然后我们都意识到,现在专注于主要工作非常重要。这很容易变成一种严重的分心,因为我们做的时候是全情投入的,占据了大量脑力和时间,而且我们希望再次以同样的热情去做。但做这种事情,比如公开露面,是一种压力。把自己推出去,对于任何一个上过你这样的节目的人来说,都很危险,这也是其中一部分。你会以不同的方式思考如何把自己展现给世界。所以我们觉得现在不是合适的时机,也许未来会再考虑。你什么时候要做设计播客节目的话,提前告诉我一声,我好想办法养家糊口。我只需要提前几个月通知。
Okay, there's the secret episode. We recorded it, I think 2 years ago, but we recorded it video style, all modern. We both were like, 'Not now.' We finished it and we both said, 'Not now.' It was very fun. For the six hours after we recorded, I was like, 'I can't wait to do this again.' And then I think we both realized it's really important for us to focus on the things we're doing in our primary work right now. It would end up becoming a pretty serious distraction because when we did it, we were all in; it really took up a lot of our mental space and time, and I think we would want to do it with that same level of passion again. But doing this type of stuff, like being in public, it's a stressor. Putting yourself out there, for anyone who's going to be talking on a show like yours, it's dangerous, and that's part of it. It's going to be on your mind in different ways to put yourself out there. So I think we just decided now is not the right time, maybe again in the future. Just give me a heads up when you're going to come for the design podcast game so I can figure out other ways to feed my family. I just need a few months heads up.
我们不会是竞争对手,但我们会是一个奇怪的东西,希望人们能欣赏。
We will not be a competition, but we will be a weird other thing that people can appreciate hopefully.
嗯,总是很有趣。听你们俩说话很有趣,但我真的很感谢你今天来。你让我思考了很多。我脑子里还萦绕着一些秘诀,以及创意与执行的想法。非常感谢你带来这个视角,分享了一些幕后故事。很高兴能叙叙旧。
Well, it's always fun. It's fun to listen to both of you, but I just really appreciate you coming on today. You've given me a lot to think about. I still have some of the secret sauce and creativity versus execution ideas bouncing around in my brain. I really appreciate you bringing that perspective and sharing a little behind the scenes. Always good to catch up.
是的,非常感谢你邀请我。我提前跟你说过,但我真的每集都看。我觉得你做得非常好。所以能来这里非常荣幸,我很感激。意义重大。谢谢。
Yeah, thank you so much for having me. I told you off fair, but I watch every episode of the show. I really think you're doing a great job. So it's very much an honor to be here and I appreciate it. Means a lot. Thanks.