00:00:00对我来说,氛围设计和氛围编程,是这二十年来我见过的最接近 Flash 的东西。
00:00:07这位是 Tom Cracker,Pencil 的首席执行官。
00:00:10Pencil.dev
00:00:11它就叫作 Pencil。
00:00:13一个名为 Pencil 的新应用。
00:00:14Pencil.dev
00:00:15我开始觉得,我们正在发现前所未见的、与 AI 互动的新型用户体验。
00:00:22这些光标追踪、扫描之类的功能仅仅是冰山一角,我们还会看到更多类似的东西。
00:00:29比如像 Banana 这样的图像生成器,它们能生成精美的照片,但插画呢?
00:00:34我认为在 2026 年下半年,插画将会大放异彩。
00:00:39在设计方面,是否有某些特定模型明显优于其他模型?
00:00:45我想我最喜欢的是……
00:00:48我先问你一个破冰问题。
00:00:51早些年,你对 Adobe Flash 非常熟悉。
00:00:54你现在还懂 ActionScript 吗?
00:00:56当然,我是伴随着 Flash 长大的。
00:00:59那是我进入科技领域的起点。我从七岁就开始用 Photoshop 了。
00:01:09后来,因为我父母开了一家设计公司,我放学后总待在那儿,设计师们会教我各种工具,从 Photoshop、Illustrator 到当时的 CorelDRAW,当时主要是做平面印刷设计。
00:01:2690 年代末互联网兴起,我开始对互动内容产生浓厚兴趣。我开始钻研 HTML、DHTML 之类的。很久以前的事了。然后 Flash 出现了,那是 Flash 3 版本。
00:01:45我当时惊呼:哇,天哪,这是什么?
00:01:48它是动的,有动画,还有音频,各种元素都有。
00:01:55我立刻爱上了 Flash,开始用它做网站,后来还在布拉格的一个叫作 "Junior Internet" 的会议上获了奖。
00:02:07如果你去问布拉格那些记得 "Junior Internet" 的人,你会发现它开启了很多人的职业生涯。后来我开始钻研——Flash 曾是当时实现在线流媒体视频的唯一途径。
00:02:25所以我为各种新闻机构等开发了视频播放器。
00:02:29那是我进入 Adobe 的契机。因为我们使用了大量的 Flash 媒体服务器,Adobe 注意到了,最后邀请我担任他们的 Flash 技术布道师。
00:02:44这就是我故事的起源。在那之后,我开始开发设计工具,在设计会议上演讲,接触了无数的设计师。
00:02:55是的,这就是我的起步经历。
00:02:59我也看过你在游戏展会等活动上演讲的视频。
00:03:06你当时在 Adobe 也做游戏开发吗?
00:03:09没错,确实做过。
00:03:10Flash 当时被用于各种互动项目,包括游戏。后来我成了 Adobe 的游戏布道师,协助各家公司把应用或游戏引入 Flash 平台。
00:03:26我会去各种游戏会议演讲,与开发者交流,帮他们把游戏移植到 Flash 平台,比如著名的《机械迷城》(Machinarium)。
00:03:40那是第一批通过 Adobe Air 从 Flash 移植到 iOS 的游戏之一。那是 Flash 在 iPad 上运行的一个重大突破时刻。
00:03:55那是一个非常关键的时刻。
00:03:56它后来成了 App Store 的当月最佳游戏,变得非常受欢迎。
00:04:04你当年也是 Newgrounds 社区的一员吗?
00:04:08不是,那是什么?
00:04:11Newgrounds 当时是所有 Flash 游戏和动画的汇集地。
00:04:18在 YouTube 出现之前,它非常火爆。
00:04:21我以为你说的是 Miniclip。
00:04:23哦,Miniclip,我记得。
00:04:24Miniclip 才是我的童年回忆。
00:04:28但我当时整天泡在 FWA 这类获奖网站上。
00:04:35不过我们现在扯得有点太远了,都聊到互联网和交互网页的史前时代了。
00:04:43我想这些早期的经历最终促成了 Pencil 的诞生。
00:04:49但后来你还为 Illustrator 写过一个叫作 DrawScript 的脚本或工具。
00:04:55能聊聊那个吗?
00:04:56当然。DrawScript 是 Illustrator 的一个插件,它能把绘图转换成 JavaScript 代码。本质上是通过代码重新绘制你画的内容。
00:05:18这就是它的核心逻辑。
00:05:19我研究了你从设计到代码的职业轨迹。在你的职业生涯中,是什么让你产生把设计“代码化”的想法的?
00:05:35是什么激发了这种渴望?
00:05:37主要是因为当时根本没有把图形转化为代码的方案。
00:05:45你想实现图标之类的功能,但当时的 SVG 限制很大,支持度也不高。但你又想在 HTML 的 Canvas 上绘制特定内容。
00:06:04而这个工具恰好能帮你实现,因为一旦有了代码,你就能赋予它交互性,比如把它做成游戏之类的。
00:06:15你可以操控它、让它动起来、制作动画等等。
00:06:23所以,那就是通往那一领域的大门。
00:06:29在 Adobe 期间,你也参与了 Adobe XD 的开发。
00:06:34它最初的愿景是什么?
00:06:36它是为了取代 Dreamweaver 吗?XD 是怎么诞生的?
00:06:42那是 Sketch 兴起的时代,Photoshop 也被大量用于网页设计等领域。
00:06:54但我们意识到,如果能有一个全新的产品,专门为网站和应用设计而生,那就太棒了,尤其是当时正处于移动应用开发的鼎盛时期。
00:07:12所以我们想以一种全新的视角,从基本原理出发去审视这一切。
00:07:18如果我们能从零开始,那会是什么样?于是我们制定了这些原则:它应该是轻量级的、易上手的、快速的,并且能让你画出大量的画板。
00:07:35在当时的 Photoshop 里,一开始你只能处理单一的东西。但你真正想要的是跨越所有不同屏幕展示完整的流程。
00:07:49Adobe XD 就是为此目的而设计的工具。
00:07:54原型设计也是其中的一部分。
00:07:57你可以把这些屏幕连接起来,添加滚动区域等等。
00:08:03是的。
00:08:05我现在直接跳到 Pencil,因为看你从 Adobe 到开发这个集成了大量 AI 的产品的过程非常有趣,它有点像 XD,但更智能。
00:08:17你是在什么时候开始意识到大语言模型 (LLM) 和智能体 (Agent) 的强大能力的?
00:08:24在那之间我做过几家创业公司。后来我像全世界所有人一样,开始钻研 Cursor 和 Claude 代码。当时我在做别的东西,但在用 Cursor 时我突然想到:天哪,我该怎么告诉模型,我想让这个按钮长成我脑子里构思的样子?
00:08:52或者有一个导航栏,它应该固定在顶部,里面有哪些按钮等等。
00:09:00我感觉我一直在给模型写“小作文”,试图用文字去描述我想象中的视觉效果。
00:09:09我找了一圈,发现根本没有现成的解决方案。
00:09:11我翻遍了 VS Code 市场和其他地方,没有任何工具能让你简单地画个东西,然后告诉 AI “照着这个做”。
00:09:23那是大家还没开始搞 MCP(模型上下文协议)的时候。最初的想法很简单:我有这种 JSON 格式,而模型非常擅长读取结构化数据并将其转换为任何代码。
00:09:38于是我做了一个原型,并把它发布了出去。
00:09:41那是 2025 年 5 月的事,结果它走红了。
00:09:45社交媒体上的播放量达到了一百万。X(原 Twitter)上有 85 万,LinkedIn 上大概有 40 万。
00:09:53我当时心想:哇,看来这不只是我一个人的困扰,其他人肯定也想这么做,他们需要这种辅助。
00:10:03当时没人真正提供这种从快速视觉构思到代码的辅助工具。
00:10:10工具做出来后,又激发了我许多灵感。比如,我突然意识到我其实可以生成这些设计。
00:10:23不只是我画给它看,我也可以直接告诉 AI:“嘿,帮我画这个,生成那个。”
00:10:30就在那一刻我意识到,我们正处于“氛围设计”时代的边缘。
00:10:39那个走红的演示,就是 Cursor 的设计模式演示吗?
00:10:42是的,叫作 "Cursor 设计模式"。
00:10:45没错,其实我们现在的核心依然是那个。
00:10:49它就像是在所有基于 VS Code 的 IDE(如 Cursor、Windsurf、Digravity 等)内嵌的一个画布。
00:10:59基本上它是你 IDE 内部的一个可视化自定义编辑器。
00:11:07你可以随心所欲地操作,在画布上选中内容,可以复制粘贴到聊天框生成链接,也可以直接指给它看,它就知道你选中了什么。
00:11:21然后它会提取信息,并根据你的要求进行转换。
00:11:28无论你用的是 React 还是其他库都没关系,它本质上是一个与技术栈无关的平台或框架,能让你快速构思,然后转化为任何你想要的东西。
00:11:45那它是使用原生 CSS,还是集成了 Tailwind、Shadcn 之类的库?
00:11:52老实说,你可以自由选择。底层只是定义设计外观的结构化 JSON,然后我们内置了一些转换规则,比如转换成 Tailwind。
00:12:10但你也可以编写自己的一套规则,来完美适配你特定的代码库。这个我们称之为 "pen" 的文件就存放在你的 Git 仓库里。
00:12:23这样任何工程师或 AI 智能体都能直接访问它,并将其转换为任何内容。
00:12:32所以你可以围绕它制定规则,让它完全符合你的需求。
00:12:39我认为这是最关键的一点。
00:12:41我第一次用 Pencil 时觉得它很神奇。我一直在想它的技术实现逻辑。
00:12:49我看到了 pen 文件里的 JSON,但我不明白它是如何转化成我可以交互的 UI,让我能拖动方块、改变背景颜色的。
00:13:01而且智能体也能理解它并做同样的操作。
00:13:05你是如何想到把人类设计和智能体设计结合在同一个文件里的?
00:13:12这涉及多方面。我们真心想构建一个极致熟悉的环境,让你从打开它的第一分钟起就能立刻上手。
00:13:23让你觉得:好吧,我在这儿不会迷路。这是一个可以缩放的画布。
00:13:29侧边有属性栏,另一边有图层面板,一切都非常亲切。
00:13:36但与此同时,它也开启了一些以前没人真正解决的新领域,比如:我该如何与设计进行“交流”?
00:13:47这给了我们创新的机会。视频里展示的最新的功能,就是多个智能体像交响乐团一样,协同进行设计工作。
00:14:02而且说实话,每天都能发掘出更多可能性。
00:14:10随着每一个新模型的发布,我都在不断发现以前无法实现的各种新机会。
00:14:24随着我们与用户的交流,观察他们如何交互,我们也一直在涌现新的想法。
00:14:32现在他们甚至想实现远程控制之类的。能做的实在太多了。
00:14:39这太疯狂了。
00:14:40我很好奇你最初是用哪个模型的。你是什么时候意识到模型其实可以胜任设计的?因为最初那几代并不太行。
00:14:50我想后来他们可能特意在训练数据里加入了一些设计相关的内容。
00:14:54是的,目前仍然存在差距。
00:14:57但我认为随着每个新版本的发布,情况都在变好。
00:15:01我想我们是从 Sonnet 3.5 或 3.7 开始的。
00:15:10起初,你必须事无巨细地告诉模型具体长什么样。
00:15:18但随着技术的进步,我们现在已经到了你可以直接说“帮我设计一个网站”的阶段。
00:15:27它就能做得相当不错。
00:15:31第二件大事,随着模型和智能体的进化,出现了一个叫作“引导询问”(elicitation) 的概念,它会反问你:“你到底想要什么?”
00:15:46这非常像你作为客户去咨询代理公司。设计师或项目经理做的第一件事就是采访你,试图挖掘尽可能多的信息,以便为你构建正确的产品。
00:16:10我们不能指望 AI 一次就全对。虽然它们现在非常强大,但我认为目前智能体之间越来越多的这种对话是一个巨大的突破。
00:16:22起初是“给我设计个东西”,它出来的结果可能完全不是你想要的。
00:16:29但现在通过对话,它能提取出你的真实需求和偏好。
00:16:34这样它的产出就会越来越接近你的目标。
00:16:40这是一个重大的区别。
00:16:43我猜你在开发 Pencil 时测试过很多模型。
00:16:48是否有某些特定模型在设计能力上显著优于其他模型?
00:16:54我最喜欢的是 Opus 4.6。观察社区的情况,它现在基本上是设计的行业标杆,代表了目前的最顶尖水平。
00:17:10它处理结构化数据非常出色。
00:17:15在布局方面,它出的错最少。
00:17:22对于很多其他模型,我们基本上必须去纠正它们的一些行为。
00:17:28但这没关系。这只是一个发现细微差别并确保我们能纠正它们,或者告诉智能体“这里做错了,再来一遍”的过程。
00:17:42通常这样做就行。Opus 唯一的挑战是速度相当慢,尽管它在其他方面很惊艳。
00:17:54我第一次感受到真正的魔法是 Cursor 的 Composer 发布时。我当时心想:哇,这太快了。
00:18:04这简直是在随着我的思考同步进行设计。
00:18:08所以,我希望看到的是,虽然质量上仍有提升空间……
00:18:19但我真的非常希望各大实验室现在能把重心放在速度上。
00:18:24显然,随着 Cerebras、Spark 等技术的出现,这正在发生。
00:18:30我真心希望下一阶段的创新能集中在速度上,因为那将解锁设计师的“心流”状态。
00:18:42很多时候,多次快速迭代比第一次就做对更重要。
00:18:51你想参与到那个过程中,而更快的模型能让你做到这一点。
00:18:58对我们来说,这是构建产品时一个非常重要的原则:确保用户处于心流状态。
00:19:06这正是巨大的区别:你不是去用那些氛围编程工具,写个提示词,然后去喝杯咖啡,10 分钟后回来发现它做了一个你根本不想要的东西。
00:19:19“氛围设计”是不同的。
00:19:21你希望看到事情实时发生。
00:19:24所以我们加入了那些移动的光标,你可以看到发生了什么,看到模型是如何思考的。
00:19:33当事情耗时较长时,保持与用户的沟通非常重要。
00:19:42但我同时也希望模型能变得飞快,让内容实时呈现。
00:19:49还有一点值得一提,那就是“并行性”也是一个巨大的突破口。
00:19:57也许单个模型很慢,但如果它能同时处理多项任务,那速度就不再是障碍了。
00:20:08模型慢慢跑没关系,但你肯定希望在它工作的同时,自己也能在画布的其他区域同步操作。
00:20:17我在这儿干活,不需要等智能体完工。
00:20:23你可以直接在智能体工作的同时去修改设计,这在 Pencil 里非常酷。
00:20:32当它还在运行的时候,你就可以开始重新组织布局了。这也是“氛围设计”比单纯写代码更合理的原因。
00:20:45因为在智能体写代码时,你很难直接插手,否则可能会搞砸逻辑导致无法编译。
00:20:54但在画布上,因为各部分是分离的,你可以直接动手。
00:21:01我想说,我最喜欢 Pencil 的一点是你在设计领域拥有深厚的背景。因为我觉得很多现代的氛围编程工具……
00:21:10有些开发者只是在想“我们能不能做到”,而不是“我们应不应该这样做”。我见过一些氛围设计工具,工作流简直是一场灾难。但我喜欢你的理念:始终是辅助人类,而不是取代人类。
00:21:25这也是我更倾向使用的 AI 工具类型。我觉得 Pencil 的这种方式非常酷。
00:21:30完全正确。我跟一些用户聊过,他们觉得现在就像是有一群初级设计师加入了他们的团队,让他们能更快、更好地协调工作。
00:21:51以前你会花大量时间纠结于细节:合适的内边距、外边距、字号等等。
00:22:01你会为这些事耗费无数小时,哪怕你脑子里已经有了清晰的构想。
00:22:07你只是被迫跑这一场体力消耗巨大的“马拉松”。但现在,你可以直接冲刺。因为你已经看到了终点,你只需要把想法实例化。
00:22:20回到你说的并行智能体,你是说让多个智能体协同处理同一个设计,还是指让他们分别处理不同的设计?“并行”具体指什么?
00:22:38以上皆有。这很有趣。起初我们研究并行是为了在画布的不同位置探索同一设计的不同变体。
00:22:53后来我想,为什么不能让多个智能体在同一个页面上工作呢?实际上这是可行的。原因是只要协调得好,它们可以以互不冲突的方式分工,这和写代码不同。
00:23:15它们只需要对目标有一致的理解,然后各司其职。比如一个智能体负责首屏 (Hero Section),另一个负责中间部分,第三个负责页脚。
00:23:32你甚至可以为每个页面运行多个智能体,就像我在 X 上发的那个演示里:三个页面,每个页面有两个智能体在干活。
00:23:50Cognition 曾发表过论文,建议不要运行多个智能体,因为存在上下文同步问题。他们举例说,如果要开发《超级马里奥》,一个负责关卡,一个负责角色,但因为缺乏全局共识,它们设定的重力参数可能完全不同。你是如何解决 Pencil 的这个问题的?
00:24:15靠魔法。开玩笑,其实是经过了大量的迭代。我们要不断钻研,老实说,我们现在也只是触及了皮毛。我想我们只是展示了一个可能的方向。
00:24:32在共享上下文的处理、性能优化,还有速度和 Token 使用等方面,仍有海量的工作要做。
00:24:49前方还有很多激动人心的事情。你可以设定不同的角色。我非常兴奋的一点是“同角色”并行和“多角色”并行的对比。通常人们谈论智能体团队时,指的是不同角色的分工。
00:25:14那固然很酷,但它们最终是在做不同的事,且需要互相等待。我真正兴奋的并行是智能体之间无需等待,真正像 GPU 一样并行工作。
00:25:30考虑到市面上这么多工具、模型和智能体框架,在使用 Pencil 时,你的工具链是什么样的?你是如何在智能体和工具之间切换的?
00:25:45你是说 Pencil 内部的具体工具,还是指别的?
00:25:49都有。比如在 Pencil 内部,你是用 Codex 吗?还是 Claude Code?或者是 Gemini?你主要用哪个?
00:25:57全都在用。Pencil 发布时我也很惊讶,用户想尝试的组合竟然如此之多。
00:26:08我们的 Discord 炸开了锅,每个人都在问:我能不能配合那个谁都没听说过的某某模型来用?
00:26:17我能不能搭配这个智能体框架,或者那个命令行工具?这个生态系统的广度让我非常吃惊。
00:26:30而我们现在仅仅处于起步阶段,未来会看到各种奇妙的组合。
00:26:38在现在的 Pencil 里,你可以让一个画板运行 Codex,另一个运行 Opus,第三个跑 Gemini,诸如此类。
00:26:48这太不可思议了。你可以同时运行所有这些模型,对比它们的结果。
00:26:56它们甚至可以互相协作。这非常有趣。
00:27:02我很好奇你们内部是如何评估模型的各种设计能力的。每次有新模型发布时,你们有一套专门的评估系统来检查它是否有重大进步吗?
00:27:14当然,有一些自动化的手段。但因为我们还处于早期阶段,显然还有大量的人工评估工作。
00:27:32每当新模型发布,我总是最兴奋的那个。有时候改进非常细微,很难用言语表达。但你一眼就能看出来细节更丰富了,就像从 Opus 4.5 升级到 4.6 时的感觉。
00:27:51我很难描述具体区别。人们问我有什么不同,我也说不上来。但当你亲自尝试时,你会发现这儿多了一点细节,那儿多了一点巧思,突然间一切都变得合理了。
00:28:03我认为随着我们迈向 Opus 5.0,这种迭代会一直持续。现在也有很多新的图像模型面世。
00:28:15同样是多了一点细节,言语难以形容,但一旦看到了,你就懂了。
00:28:22如果我现在想为一个网站做设计,我可以去用 Manobanana Pro 2 之类的工具生成一些网站效果图。那么,有没有办法把生成的图导入 Pencil 进一步设计?还是说从 Pencil 零开始画比较好?
00:28:48绝对可以。事实上,你可以直接把生成的图像拖进 Pencil 的聊天框,甚至可以同时拖入多张。
00:28:59你还可以拖入图像以及 MD 或文本文件,里面包含你的设计规范或准则。现在很多人都在基于这些来构建自己的工作流。
00:29:12结合规则集、库和参考图来获得理想的结果。你甚至可以拿一张水果或花朵的照片,把它作为一种“氛围参考图”。
00:29:28我们很多风格指南就是这样搞出来的:用一张花朵的照片作为氛围图,看看视觉模型能从中提取出什么样的色板。
00:29:43我觉得我们会看到越来越多这类探索和组合。就像人类一样,你出门走在山间、树林、海边,或者只是在大街上散步,你会看到灵感,受到启发。
00:30:04然后你会说:“啊哈,这就是我想要的。”但在以前,你只是在脑子里拍个快照。
00:30:17等你回到家坐在电脑前开始设计时,你白天的所见所闻会潜移默化地影响你的创作。
00:30:25但现在,你可以直接把那份灵感传递给 AI,看看它能产出什么。
00:30:30如果提供 SVG 资源或图像作为提示,它也能设计出一些疯狂的 SVG 动画之类的吗?
00:30:42目前还不一定能处理 SVG,但我最近看到一些刚推出的 SVG 模型。
00:30:49这方面正在发生的事情真的很有趣。而且我认为动画也是下一个重要的前沿领域。
00:31:01比如有 Remotion、Lottie 这些工具,Replit 最近也推出了动画功能,对吧?
00:31:12所以我觉得这会是下一个尚未开发的巨大领域。
00:31:18目前还只是触及皮毛。虽然很不错,但还没达到 After Effects 那种专业设计师能做出的惊人动画水平。
00:31:32但我认为这个空间有很大的潜力。
00:31:36你看,我见过那个新的 SVG 模型,演示看起来非常酷,因为目前的模型在处理 SVG 时确实有些吃力。
00:31:43它们正变得越来越好。但那个特定的 SVG 模型与目前的水平相比,确实非常出色。
00:31:50这涉及到一个非常有趣的话题,我认为我们已经到了页面布局看起来相当不错的阶段了。
00:31:57但我们知道,网站不仅仅是好的布局,对吧?它还关乎你从中获得的情感。
00:32:04这种情感可以通过插画来强化,或者通过非常大胆的排版将文本打散,比如使用副标题。
00:32:16所以这是一种以有趣或独特的方式进行的文本构图。
00:32:22也许有一段正在播放的视频,但它只是作为一种氛围感存在,可能是抽象的图像在微微移动,或者是随滚动而滑动的元素等等。
00:32:41所以我认为这些元素很可能会开始进入 "氛围设计" 中,尤其是插画方面,因为接下来还可以考虑 3D。
00:32:54现在很多网站都有这种渲染效果,比如有一些立方体,用来展示某种结构,比如解释字节如何组成数据包之类的网站。
00:33:11我们可能都见过很多这类网站,这就是下一个缺失的环节。因为现在虽然图像生成器能生成很棒的照片,但插画呢?
00:33:23我认为在 2026 年下半年,插画将会是一个巨大的趋势。
00:33:30我很期待这一点,因为我以前一直觉得设计插画很难。
00:33:33我从来都不擅长用 Adobe 工具之类的东西来设计插画。
00:33:37是的,这确实是个好观点。我认为我们很多人都能欣赏什么是好的设计。
00:33:47我们甚至能在脑海中构思出来。
00:33:49只是在我们和计算机之间存在着一道鸿沟,难以将其具象化。
00:33:55让我感到兴奋的是,看到越来越多的工具正在帮助填补你和你的愿景之间的那段空白。
00:34:04你是否仍然认为 "人的触感" 很重要?因为如果我们完全信任 AI 去做设计,一切都会显得很平庸。
00:34:13你是否认为这种触感体现在人类从外部世界获取灵感,带着自己的想法来引导 AI 朝那个方向发展?
00:34:22这就是为什么在未来我们仍然需要人类设计师的原因吗?
00:34:27是的。我们每天使用的许多伟大产品都有一种不可否认的 "品味" 元素。
00:34:39这非常重要,因为我认为 AI 在代码和设计方面提供给我们的可能只是一种 "千篇一律" 的结果,尽管它在不断改进。
00:34:51它会看起来越来越好,但可能仍然缺少画龙点睛的那一笔。
00:35:00我认为那最后的一笔仍然非常重要。
00:35:02而且那一笔可能不仅仅是最后的收尾。
00:35:04它可能是一个贯穿始终的过程,包含了许多让你参与其中的迭代。
00:35:11只是并行处理以及这些 "氛围设计" 和 "氛围编程" 工具能让你更快地达到目标。
00:35:18因此,你所做的重复练习不仅能让你生产得更快,最终还能让你做得更好。
00:35:28如果你看现在的互联网,并不是所有东西看起来都很惊艳。
00:35:34我的希望是,我们能将各处的整体用户体验都提升一个数量级。
00:35:46这确实是我对未来的希望。
00:35:52就我所见,这可能是下一个前沿领域。
00:35:56在那之后会是什么?
00:35:58谁知道呢?
00:35:59坦白说,我们现在每天都在发现很多新事物。
00:36:05对于正要入行的初级设计师,关于如何在这个世界保持竞争力,你有什么建议吗?
00:36:12我认为 Marc Andreessen 对此描述得很精辟。
00:36:18在回答你的问题之前,我想先往回推几步。
00:36:23他把这描述为一种 "墨西哥对峙":产品经理指着设计师和工程师,工程师指着设计师和产品经理。
00:36:35每个人都觉得自己可以取代另一个人。
00:36:39我在想,以前你会去学校学四五年设计。
00:36:46或者去工学院学四五年的工程。
00:36:53作为产品经理,你可能读了商学院,或者做了类似的事,你只是非常痴迷于构建产品和研究用户行为。
00:37:06但我现在真的在问自己。
00:37:11Z 世代和 Alpha 世代在选择学校或职业时会怎么想?
00:37:21对我来说这是最大的问题,因为我认为现在每个人都在成为创作者,本质上都是构建者。
00:37:29根据我的假设,我们不再仅仅认为自己是,比如 "我只是个工程师"。
00:37:39或者 "我只是个设计师"。我指的不是我们这一代,而是新的一代人。
00:37:46我认为我们会看到越来越多的是 "问题解决者"。
00:37:50我有一个想要解决的问题,我就会拿起我需要的工具。
00:37:55我一直持有这种心态,而这种心态最初是从 Flash 开始的。
00:38:01回过头看,Flash 真的是第一个能让你在同一个环境中同时担任设计师和工程师的工具。
00:38:11那真的很神奇。
00:38:13显然后来它没能持续扩展。
00:38:15当新的框架出现时,它在很多层面都崩溃了。
00:38:20但我一直梦想着能有类似的工具回归,让有愿景的人能拿起任何必要的工具来实现它。
00:38:33对我来说,"氛围编程" 和 "氛围设计" 是二十年来我见过的最接近 Flash 的东西。
00:38:44我想问问关于你们风格指南的事情。
00:38:47你们是如何管理和构建它们的?
00:38:51因为在设计领域,每年 Pantone 都会发布年度代表色,或者当时流行的某种设计趋势。
00:39:05所以你是否设想 Pencil 也会随着这些趋势的演变而不断更新?
00:39:12事实上,我们刚在最新版本中更新了风格指南。
00:39:16我们一直在刷新它们。
00:39:18但我从没觉得我们的风格指南就是终点。
00:39:22我总觉得它只是为了给你一点启发,让你知道在这里能实现什么。
00:39:30同时也是为了解决面对空白画布时那种 "冷启动" 的困难。
00:39:37或者是那种 "我不知道该怎么用这个工具" 的困惑。
00:39:42这就是我们的初衷。
00:39:46但我们的目标实际上是把它文档化并开放出来,让人们可以制作自己的风格指南,在社区中贡献和分享。
00:39:56我从来没想过我们要成为某种 "领跑者" 或类似的地位。
00:40:03完全没有。
00:40:03它仅仅是为了给别人提供灵感,让他们在此基础上进行构建。
00:40:09说回 Flash,当我开始使用 Flash 时,我研究了大量的 Flash 文件,看别人是怎么做各种效果的。
00:40:19对我来说,那是灵感的源泉,不仅教我如何创造这些东西,还有其中的各种精妙之处。
00:40:33所以我只是希望我们的风格指南也能起到同样的作用,激发别人去构建、重新混搭并赋予其个性。
00:40:45我想说的是,似乎其他公司也意识到了 Pencil 的做法。
00:40:51我知道 Sketch 有了 MCP 服务或工具,Figma 也是如此。
00:40:56Figma 也有他们自己的 MCP 工具。
00:40:59你打算如何实现差异化或保持领先,不让那些公司抢走你的市场份额?
00:41:07嗯,我觉得我们必须……这是个有趣的问题,但你如何区分 Cursor 和 Copilot 呢?
00:41:17也许我可以把这个问题抛回给你。
00:41:20它们之间是有细微差别的,对吧?
00:41:24确实有不同之处。
00:41:26如果我们深入挖掘,或许可以用语言来描述,但显而易见,两者存在重大差异。
00:41:33所以我只是希望我们能保持这种势头,实质上保持领先地位。
00:41:45就像我在这里多次说过的,还有很多工作要做。
00:41:50我想确保我们在 Pencil 这边始终跑在创新的最前沿。
00:41:57为了创立 Pencil,你参加了一个项目,是 A16Z 的 Speedrun 吗?
00:42:05是的,我推荐每个人都考虑一下。
00:42:11显然有 YC 和 Speedrun 这类项目。
00:42:15我想说这些是最出名的几个。
00:42:20但世界各地还有很多很多的孵化器项目。
00:42:24对我来说,Speedrun 是一次非常棒的经历,原因有很多。
00:42:31在疫情期间,每个人都深居简出,不太出门,对吧?
00:42:40我认为 Speedrun 是一个很好的机会,让我能再次定期与创业同仁们建立联系。
00:42:48我觉得这种能量的价值被低估了。
00:42:53我认为每个人都应该经历一下,与一群有着共同愿景、想要不断突破极限的人待在一起。
00:42:58共同探索各种可能性。
00:43:03这是第一点。
00:43:06第二点,它确实会以一种非常积极的方式重塑你作为创始人的特质。
00:43:13首先,Andreessen Horowitz 团队给予的巨大支持是毋庸置疑的。
00:43:20另外就是,我可以和他们讨论无数的事情。
00:43:25他们见多识广,经验极其丰富。
00:43:27所以他们对于什么可行、什么不可行有着非常敏锐的直觉。
00:43:32他们是非常棒的顾问。
00:43:35还有一个时刻,你必须在演示日面对一千名投资者进行演示。
00:43:42今年我们参加的是第五期 Speedrun。
00:43:49地点是在旧金山的芳草地艺术中心 (Yerba Buena Center for the Arts)。
00:43:53那是当年史蒂夫·乔布斯发布 iPad 和其他苹果产品的地方。
00:44:00而现在你就站在那个舞台上。
00:44:02那里有一种奇妙的能量。
00:44:05简直不可思议。
00:44:07我想说,每个人都应该体验一下。
00:44:11这是一次非常棒的经历,它会迫使你不断提炼你的演讲稿。
00:44:18你只有两分钟的时间来展示。
00:44:22我可以告诉你,让我聊一个小时 Pencil 很容易。
00:44:28但要在两分钟内讲清 Pencil 极其困难,尤其是当你站在那个舞台上,
00:44:35灯光晃得你什么都看不见。
00:44:38因为你是从后台那种伸手不见五指的地方走出来的。
00:44:44那里一点光都没有,什么也看不见。
00:44:47突然你走上舞台,强光直射在身上。
00:44:52而你必须立刻开始兴致勃勃地讲述你正在构建的东西。
00:44:58那种感觉必须源源不断地喷薄而出。
00:45:01当然,为此我进行了很多次排练。
00:45:05但总的来说,我认为对每个人来说,这都是一种能激发你展现最佳状态的奇妙体验。
00:45:10真的能把你最好的一面挖掘出来。
00:45:14是的。
00:45:16我总觉得在加州或旧金山的人有一种不公平的优势,
00:45:20因为你身处技术中心,能切身感受到 AI 的力量,
00:45:28还有那些科技中心之类的氛围。
00:45:29你有同感吗?
00:45:31是的,百分之百有同感。
00:45:34我以前在旧金山住了很多很多年。
00:45:36现在不长住那儿了。
00:45:38我正在调节这种状态,因为坦白说,那里虽然有很棒的能量,
00:45:44但也伴随着很多杂音。
00:45:47所以我发现最适合我的平衡点是定期去那里,
00:45:53而不是必须每天都待在那里。
00:45:59而且每次去那里,我都能以全新的方式获得启发。
00:46:05这就是我发现的有效方法。
00:46:08不过我在那儿待了十年。
00:46:10所以我了解那个城市的每一个角落。
00:46:14但没错,那确实是一种不公平的优势。
00:46:19你可以去问任何飞去旧金山的人,他们从那儿回来时,
00:46:24总是感觉精力充沛。
00:46:26所以,我会建议的一件事就是,提上包飞去旧金山,
00:46:33去见见那里的人,和他们聊天,大家一起交流碰撞。
00:46:38Pencil.dev 现在是有个团队,还是目前只有你一个人?
00:46:42我们现在大约有 10 个人。
00:46:45是的,这是一支很棒的团队。
00:46:50我们彼此认识已经有一段时间了。
00:46:52如果你仔细想想,这实际上是一个非常复杂的产品。
00:46:57所以现在的确需要比我一个人更多的力量。
00:46:59是的。
00:46:59这些人是你以前在 Adobe 工作时认识的,还是在你的前一家初创公司,
00:47:06或者是通过 Speedrun 认识的?
00:47:09有些人来自我们之前的初创公司。
00:47:16是的,也有一些新加入的伙伴。
00:47:18所以是不同背景的人的组合。
00:47:19是的。
00:47:20噢,酷。说到之前的初创公司,方便聊聊吗?
00:47:24可以啊。
00:47:25其中一个叫做 Around,是个视频会议应用。
00:47:30我不知道你们有没有见过它。
00:47:33它……你们见过吗?
00:47:34那是我们一直用到的那个……
00:47:37是的,我们用过。
00:47:38没错,我以前用过。
00:47:40我们当时非常喜欢它。
00:47:41当它停止服务时我们挺难过的。
00:47:42是的。
00:47:44如果不介意的话,能分享一下你们对那个工具的印象吗?
00:47:50其实我挺好奇的。
00:47:51它感觉比 Google Workspace 或 Slack 之类的更有趣,体验也更好。
00:47:57它就是那种……
00:47:57我也说不上来。
00:47:59感觉它完美实现了设计初衷,还有一些很酷的功能。
00:48:03我们当时的意图就是想让它更有趣一点,尤其是在疫情期间。
00:48:07当时我觉得每个人都在追求高清视频、4K 视频,画面越做越大。
00:48:09于是我们想,不如换个思路。
00:48:15如果我们把人像做成桌面上的小圆圈,
00:48:15让别人在某种程度上少看到你一点呢?
00:48:17所以我们加入了滤镜之类的功能,让每个人在团队讨论中突然感到更自在。
00:48:23我认为那是当时一个非常关键的因素。
00:48:25对于我参与的所有产品,我总是试图找到那个完全不同于他人的独特切入点。
00:48:31我总是在寻找这种独特性,而不是看到别人做了什么就试图去重做、翻版或者复制。
00:48:33我认为找到一个让你充满激情的新事物非常重要,
00:48:38因为创业终究是一场马拉松,你必须从内心深处为构建这个东西感到兴奋。
00:48:46对于 Pencil 来说,当我第一次看到光标在画布上飞舞时,我想,就是它了。
00:48:51太神奇了。
00:48:58我根本停不下来,盯着它看。
00:49:01我完全被它迷住了。
00:49:08然后我就觉得,我等不及要和大家分享这个东西了。
00:49:15你得对构建这个产品感到兴奋,对吧?
00:49:17说到 Pencil,当我第一次看到那些光标在画布上飞舞时,
00:49:23我当时就想:就是它了。
00:49:25太棒了。
00:49:25我简直停不下来,一直盯着看。
00:49:27我被它迷住了,你懂吗?
00:49:29然后我就想:天呐,我等不及要把它分享给所有人了。
00:49:35所以就是这些小细节,最初我们有一个类似扫描物体的动画,
00:49:40其实我们没必要这么做。
00:49:43我们可以直接输出 JSON 就算了。
00:49:47但它扫描框架的那种感觉,让我觉得:哇,
00:49:56你感受到了。
00:49:56你感受到了 AI。
00:49:57所以,我希望如此。很多人一直在讨论,
00:50:04说聊天框是 AI 的主要交互界面。
00:50:08但我老实说,我觉得我们现在正在发现一些前所未有的、
00:50:14与 AI 互动的新型用户体验。
00:50:19这些光标、扫描之类的东西只是冰山一角。
00:50:24我们会看到更多类似的东西。
00:50:25就是在你创作的过程中进行视觉引导。
00:50:29这真的让人觉得 AI 不仅仅是某种大语言模型聊天框,
00:50:36而是背后有一些更有创意的东西。
00:50:40我不知道该怎么形容。
00:50:40我现在找不到合适的词,但给人的感觉就是那样。
00:50:45你懂的。
00:50:46我觉得对于设计等创意工作来说,聊天确实是一个糟糕的界面。
00:50:50要把你想要在页面上呈现的效果,
00:50:52转化成提示词是非常困难的。
00:50:56如果想让世界上更多的人使用 AI,我们就必须找到更好的界面。
00:51:03当然,语音可能是其中之一,
00:51:04但你们平时有多少次是用语音和 AI 互动的?
00:51:10很少吧?
00:51:13所以,我想我们也需要为此寻找一些新的界面。
00:51:19没错。
00:51:20我一直在断断续续地思考这个问题,如果 AI 能读懂我在想什么就好了,
00:51:24因为有时候我不想说话,也不想打字,
00:51:28我只想让它明白我的想法并直接执行。
00:51:31不知道是靠 Neuralink 还是别的什么,但如果能实现,那会是一个很酷的界面。
00:51:35没错。
00:51:36其实你应该考虑邀请我的一个好朋友来参加这个播客。
00:51:44Jakub Zeczolka,他是一位很有名、很有前途的 UI 设计师,
00:51:50他最近发布了一个最新原型的视频。
00:51:55他在 iPhone 上做眼动追踪,基本上就是盯着屏幕上不同的东西看,
00:52:02然后直接说应该对那个东西做什么。
00:52:05他不需要描述说 "左边这张图片"。
00:52:08他只需要盯着那张图说 "把它改成别的"。
00:52:10AI 就知道他在看什么。
00:52:13这就是那些将开启无限可能的新型界面,
00:52:19因为如果 AI 知道你脑子里在想什么,比如视线和注视的方向,
00:52:24这些就是线索。
00:52:26希望我们能找到更多这样的线索。
00:52:30这样交互起来就会感觉更自然。
00:52:33就像你站在我房间里一样,我不需要告诉你 "看这里",
00:52:38然后特意指着那个东西。
00:52:42通过所处的环境上下文,你自然就明白了。
00:52:48那真的太酷了。
00:52:49我正想说,我其实是那种经常使用语音的人,因为有时候
00:52:55我实在不想打字了。
00:52:56我只想和 AI 对话。
00:52:58所以如果我能跟它说话,它还能知道我的目光在哪,那会是个很酷的产品。
00:53:03我喜欢这个主意。
00:53:04是的。
00:53:05甚至想象一下它能追踪手势,你可以指着屏幕上的东西,
00:53:10或者做这个动作。就像有时候你在车里,
00:53:15你只会说 "往这儿走",你不会说向左还是向右。
00:53:19就说 "从这儿转弯"。
00:53:20我真希望我能在车里或者对自动驾驶 AI 说: "从这儿转",
00:53:28车里的其他人会明白你的意思。
00:53:33但 AI 根本不知道。
00:53:35你必须说 "在这个路口右转"。
00:53:37我就想:天呐,谁会这么说话?
00:53:40太啰嗦了。
00:53:43没错。那么,你对设计、AI 或整个科技行业有什么独特的见解(Hot Take)吗?
00:53:50这问题的信息量好大。
00:53:53虽然它听起来很简单。
00:53:55我们需要一个精彩片段,得搞个劲爆点的。
00:53:59好吧,什么算独特见解呢?
00:54:02说实话,我觉得我们刚才讨论的内容就是一个挺不错的观点,
00:54:06就是我希望我们能发现更多与 AI 交互的新界面,
00:54:12让它们感觉更人性化、更自然。
00:54:16AI 将通过物理环境、你的个人背景、你的视角
00:54:26以及你的焦点,直接理解你的真实意图。
00:54:30这样你就不必像现在这样,
00:54:34手把手地去引导它。回到我最初的想法,
00:54:40我想直接画出某些东西,而不是用语言描述,这也是一样的道理。
00:54:44对我来说,直接画出来或指出来,
00:54:52通常比用语言描述要容易得多。
00:54:53所以我认为这是 AI 领域下一步即将发生的变化。
00:55:00另外,如果你回想几年前的 ChatGPT,
00:55:01你必须问非常长的问题和提示词。
00:55:06但现在,你只需简单问一句,
00:55:10它就能完成所有分析并给出 20 个选项等等。
00:55:14它会一直深入下去。
00:55:16它似乎知道你的思路。
00:55:17也许它是通过参考其他人的对话记录,
00:55:21缓存了一些想法和答案之类的。
00:55:30是的,我觉得还有一点,
00:55:33通常情况下,每一个新的 LLM 提示词都像是一个新世界的开始。
00:55:41一切从零开始。
00:55:45我希望我们能看到更多这种 "共享记忆"。
00:55:46我认为最大的区别在于: "AI 请总结这个",
00:55:51和 "AI 像 Slack 上的同事一样" 之间的区别。
00:56:01后者拥有所有历史对话的上下文,
00:56:06不需要每次都重新挖掘信息,
00:56:11因为那样感觉挺笨的。
00:56:13所以我认为我们会看到更多这样的发展。
00:56:16我正想说,回到 Around 的话题,我们真的很怀念那里的音效
00:56:21和通话结束时玩的小游戏。
00:56:22感觉失去音效是我们最大的损失。
00:56:25我们超爱那些音效。
00:56:26是的,没错。
00:56:28而且,如果现在就能玩那个游戏岂不是很酷?
00:56:31是啊。
00:56:32对。
00:56:33那曾是我的最爱。
00:56:35是的。
00:56:36太酷了。
00:56:40那段时光真有趣。
00:56:41我想我们现在用 Slack。
00:56:42我们用 Slack huddles,但感觉完全不一样。
00:56:44确实。
00:56:45我简直无法理解。
00:56:46Slack 竟然没有录音功能。
00:56:48就让我录个音吧。
00:56:51这看起来这么简单。
00:56:52但随它去吧。
00:56:54是啊。
00:56:55对。
00:56:56好吧。
00:56:57你能谈谈 Around 后来发生的事吗?
00:57:00可以,Around 被 Miro 收购了,
00:57:08并被完全整合到了 Miro 的白板体验中。
00:57:10好吧,了解了。
00:57:12所以它还存在,只是你必须通过 Miro 来使用它。
00:57:15Tom,感谢你抽出时间。
00:57:16你有什么想宣传的内容吗?
00:57:17除了 Pencil 之外,还有什么你在做的项目想聊聊吗?
00:57:21有的,首先,请大家关注 Pencil,我一直都在这里。
00:57:27还有所有尝试过我们 Discord 社区的用户。
00:57:31大家分享了很多关于使用 Pencil 的有趣见解,
00:57:40还有他们创作的作品截图和文件。
00:57:42目前这是一个拥有数千人的充满活力的社区。
00:57:46如果你遇到任何问题、有任何疑问或功能请求,
00:57:56请随时在 X 或 Discord 上私信我。
00:58:00我只是想让大家知道,我会在这里支持你们。
00:58:02我有一个功能请求,就是自定义 UI 组件库。
00:58:07因为有时候我想在不使用 Shadcn 的情况下制作自己的 UI 组件。
00:58:10完全理解,这非常有道理。
00:58:13感谢收听 Better Slack 播客。
00:58:16你可以在任何播客平台找到我们。
00:58:18Apple, Spotify,如果你在 YouTube 上收听,请点赞或订阅。
00:58:23对我来说,是时候说再见了。
00:58:25再见,再见,再见。
00:58:28谢谢大家收听。
00:58:31我真的很享受这次对话。