Magic Patterns CEO Reviews Startup Websites

Magic Patterns首席执行官点评初创公司网站 Alex Danilowicz概述了Magic Patterns如何在九个月的转型历程中，发展为一款通过MCP等协议衔接提示词创意构思与生产级代码的AI驱动设计画布。在演示了包括生成多城市活动明信片以及渲染交互式3D WebGL主题公园等实用工作流后，Danilowicz与Epstein点评了Ego、Sentient OS、Cerenovus和Slashy等初创公司的落地页。他们指出了生成式设计中反复出现的缺陷，例如劫持滚动条、无法输入的模拟输入框、隐藏过深的主要行动号召（CTA），以及像Instrument Serif这种千篇一律的AI字体搭配。对话最后为工程师培养设计直觉提供了切实可行的指导，强调实行全员轮岗客户支持，并将代码视为终极生产媒介。 Magic Patterns（YC W23）在九个月内转型尝试了多种开发者工具（包括短信分析器和本地主机共享扩展），最终凭借其提示词到原型的设计平台迅速找到了产品与市场的契合点（PMF）。 (3:01) 该公司全新的MagicOS画布充当项目上下文的“操作系统”，允许团队同时运行多个并行的AI生成线程，从而突破了早期生成式设计工具的单线程瓶颈。 (9:20) 对早期初创公司落地页的审查显示，偏重“氛围感编程”（vibe-coded）的设计往往存在严重的可用性问题，包括劫持滚动条、无法正常运作的输入框以及极小尺寸的行动号召按钮。 (21:39) 为保持高标准的设计，Magic Patterns要求包括软件工程师在内的所有团队成员每天处理客户支持工单，使他们直接体会用户遇到的阻碍，从而推动UI问题的快速修复。 (43:08)

Alex Danilowicz, co-founder and CEO of Magic Patterns, argues that as AI code generation compresses the implementation phase of software development, product leverage has shifted upstream to UX clarity, context orchestration, and rapid visual validation. In an interview with Y Combinator's Aaron Epstein, he demonstrates how engineering teams can navigate this transition while avoiding the usability pitfalls common to AI-generated, 'vibe-coded' landing pages. Upstream Bottlenecks and Canvas-Based Orchestration (8:16) Because automated coding agents accelerate downstream software construction and flood repositories with pull requests, the primary bottleneck in product development has moved upstream into ideation, scope definition, and edge-case handling. To support this compressed development cycle, Magic Patterns transitioned from early single-shot prompt tools to MagicOS, an infinite canvas architecture supporting parallel generation threads without single-chat blocking. The platform uses integrations like the Model Context Protocol (MCP) to bridge developer context directly between editors such as Cursor or Claude Code and visual canvas environments, eliminating the friction of unshareable prototypes stranded on local development servers. Identifying Vibe-Coded Anti-Patterns on Landing Pages (18:01) Auditing early-stage startup websites reveals consistent design flaws introduced by generative coding tools prioritizing cinematic flair over conversion mechanics. Common anti-patterns include un-typeable pseudo-inputs, excessive drop shadows, gratuitous neon glows, and default font pairings like Instrument Serif and Space Grotesk. Furthermore, techniques such as scrolljacking break native trackpad physics and cause disorientation, leading large consumer tech companies to avoid them entirely. Danilowicz and Epstein stress that decorative flourishes frequently distract visitors from primary conversion funnels, citing tests showing that prominent, static input fields convert significantly better than modal-triggering buttons or buried interactive forms. Establishing Trust and Functional Clarity Above the Fold (28:09) Landing pages frequently fail by framing products through abstract pitch-deck jargon rather than addressing concrete customer problems. Sites targeting local AI deployment face an acute trust barrier, as accessing local files and operating system contexts requires transparent data privacy and retention messaging displayed directly above the fold. Similarly, marketing pages must balance rich media against cognitive overload; fast-paced UI screen recordings and auto-advancing tab carousels often obscure core functionality because users rarely click tabs and timers frequently trigger before elements scroll into the viewport. Operationalizing Product Design in Engineering Teams (43:08) Developing software design capability requires moving beyond surface aesthetics, such as border radiuses, to focus primarily on user workflows and cognitive friction. At Magic Patterns, every team member, including engineers, handles daily customer support to encounter usability breakdowns directly, such as ambiguous button hierarchies. Danilowicz contends that skimping on design craftsmanship under the pretext of shipping speed is a false economy, noting that advanced AI tooling makes rapid delivery and high aesthetic polish simultaneously achievable without settling for unrefined default generation outputs. While AI tooling and conversational interfaces continue to evolve at a breakneck pace, Danilowicz asserts that code remains the definitive production medium because frontier research labs focus heavily on advancing coding agents. Consequently, future design workflows will center on integrating structured product context, such as specifications and existing design component systems, directly into code-backed generative tools.

Magic Patterns 联合创始人兼首席执行官 Alex Danilowicz 指出，在 AI 编程代理压缩下游开发周期的背景下，产品设计的瓶颈已转移至上游的构想与验证；而当前初创企业在落地页设计中频频陷入“氛围编码”（vibe coding）的误区，必须重新回归以真实转化和用户体验为核心的实用设计。 从前端痛苦到 MagicOS 上下文画布 (0:00) Alex Danilowicz 与联合创始人作为非专业设计师的前端软件工程师，深知将 Figma 视觉稿还原为生产代码的繁琐与断层。在进入 YC W23 后，团队经历了长达 9 个月的试错，先后尝试过组件库编辑器、强化版 Storybook 以及 localhost 网页共享扩展插件，最终锁定在通过提示词直接生成交互式代码原型的方向上，并在 2023 年 10 月发布早期版本。随着以太坊与前沿模型迅速演进，该平台整合了模型上下文协议（Model Context Protocol，MCP），使用户能够在 Cursor、Claude Code 等编程代理环境与设计画布之间无缝传递 PRD 文档、设计规范与界面状态，消除本地运行与团队共享之间的壁垒。 Danilowicz 解释称，Magic Patterns 随后将其画布工作区重构并命名为 MagicOS（画布 2.0），旨在摆脱早期单线程提示交互的等待瓶颈，通过多线程并行探索多种设计分支。借助将游戏引擎逻辑封装为组件体系，有用户甚至在浏览器内单次提示便生成了完整的 WebGL 3D 巧克力主题公园游戏。由于下游编写代码与提交 Pull Request 的速度被 AI 极大压缩，团队的时间瓶颈整体前移到了需求梳理、边缘情况推导与交互形态定义上，代码因而成为连接视觉构想与生产交付的终极载体。 “氛围编码”陷阱：被炫技破坏的核心转化 (18:49) 在对 Ego 和 Sentient OS 等初创企业落地页的实操评审中，Danilowicz 与主持人 Aaron Epstein 深入剖析了由 AI 代理自动生成界面时常犯的“氛围编码”通病。最显著的特征包括在首屏堆砌暗色发光、过度阴影与闪烁动画，却把核心价值主张与行动呼吁（CTA）深埋在页面后半程。例如 Ego 在首屏设置了看似可交互却无法输入的假输入框，以及让人困惑的“Ronin”无说明按钮，甚至加入了人类浏览根本不需要的“Scroll”文本提示，严重分散了访客注意力；Danilowicz 回顾自家团队曾为了追求创意拿掉顶部输入框，结果转化率遭遇断崖式下跌，印证了围绕访客核心目标布局界面的必要性。 另一个严重的可用性缺陷则是页面滚屏劫持（Scrolljacking）。Sentient OS 虽然借助开合笔记本电脑的 3D 动效直观传递了“睡梦中后台自动工作”的产品隐喻，但其强制接管浏览器原生触控板滚动的做法造成了操作漂移与体验割裂。Epstein 强调，超高流量的大型商业网站从不使用滚屏劫持，因为这在用户测试中已被证明会显著压低转化；同时，该页面将终端 Homebrew 安装命令与“Free”（免费）字样压缩至微小字号，违背了将核心免费权益以大号字体醒目呈现的 SaaS 设计基准。 审美趋同、假大空说辞与信任基建缺失 (28:09) 审阅过程中揭示了当前 AI 生成网站在视觉与文案上的严重同质化。Danilowicz 和 Epstein 发现，许多由 AI 工具搭建的站点高度依赖“Instrument Serif”与“Space Grotesk”的字体组合，同时在文本中充斥着毫无节制的破折号与随机加粗的虚词，如同 1980 年代流行但迅速过时的厨房装潢，一眼便暴露了非人工精心打磨的痕迹。Danilowicz 坦言自己创业早期的教训就是未能尽早确立企业品牌手册（brand book），导致设计容易滑向毫无辨识度的通用 AI 风格模板。 针对定位企业级决策的 Cerenovus，两位评审批评其文案充斥着“机构智能”与“决策基础设施”等类似向投资人路演幻灯片中的抽象术语，不仅首屏留白冗余，还将私募股权、二级市场等复杂分类选项甩给访客，强行增加用户的认知负荷。Epstein 指出，面向本地运行、需要接管操作系统敏感上下文的 AI 工具，必须建立超越以往的数据隐私与安全信任标准；落地页应当效仿 Danilowicz 早期开源聊天记录分析器的做法，在首屏显著位置明确承诺全流程本地处理、绝不上传网络，而不是用模糊且格式怪异的 AI 生成行话敷衍用户。 信息架构误区与工程师建立设计品味的路径 (37:10) 在分析智能邮箱客户端 Slashy 时，评审指出了多项常见的信息架构误区。首先是带有标点符号的 Logo 设计导致品牌名称被误读为“Sashy”；其次，首屏演示视频切换节奏过快、界面要素过于密集，让访客无法捕捉核心卖点。此外，页面下方带有自动倒计时进度条的轮播标签页（Tabs）也存在重大隐患：由于定时器在用户未滚动到可视区域前便已在后台运行，访客滑下来时往往直接落入次要功能，加之普通用户普遍不会主动点击二级标签，导致大量功能被彻底遗漏。不过，Slashy 在页面下半部分展示的个性化风格重写动画以及延展的超长页面设计，被认为有效向外界传达了产品成熟度与企业厚重感。 针对工程师如何建立优秀的设计品味，Danilowicz 强调设计绝非仅关乎像素级的圆角调整，其核心在于深入推敲完整的使用流程与界面细节。在 Magic Patterns 内部，包括工程师在内的所有团队成员每天都必须直接轮值一线客户支持，亲历用户因为两颗主操作按钮颜色相同而找不到“分享”入口等实际痛点，从而驱动代码层面的即时修复。他认为在现代工程工具极大提速代码编写的时代，团队绝不能止步于 AI 生成的初稿，而必须投入时间完成最后的“20% 打磨”，以真正消除阻碍用户转化的体验摩擦。 虽然生成式 AI 工具的发展让单次提示即可输出 3D 场景与可用代码，但由于前沿实验室的研发重点始终聚焦在编程代理上，代码依然是最终交付的不可替代介质；对于初创公司而言，警惕过度依赖 AI 默认样式的审美惰性，通过直面真实客户反馈而非盲目堆砌动效来打磨可用性，仍然是决定产品生死的核心法则。

[43:08] Alex Danilowicz: I think there's this big misconception in Silicon Valley that design is pixel perfect border radius and it's not. It's thinking through the user experience and of course having high fidelity UI that's that's beautiful, right? [38:36] Aaron Epstein: The problem with anytime you have tabs is you have to expect that people will not see anything that is behind the other tabs. [27:57] Alex Danilowicz: There's a reason that free is giant on pricing pages. [8:16] Alex Danilowicz: I think what's changed about software development in the last year especially is the end stage is so compressed now.

[0:00] Today I'm joined by Alex Danalovich, [0:02] co-founder and CEO of Magic Patterns, an [0:05] AI design tool that takes you from an [0:08] idea to a real interactive codeback [0:11] prototype in minutes. We'll look under [0:13] the hood to see how Magic Patterns [0:15] works, hear his origin story as a [0:17] non-designer, and then review some [0:19] startup websites to help make them look [0:21] a little bit less vibecoded. [0:30] Alex, thank you for joining. [0:32] >> Thanks, Aaron. Thanks for having me. [0:33] I've been watching the show for a long [0:34] time. [0:34] >> Oh, it's awesome to have you on. Maybe [0:36] to start, uh, tell us more, what is [0:37] Magic Patterns and what were your goals [0:39] in building it? [0:40] >> Yeah, so Magic Patterns is an AI design [0:41] tool. Product managers, founders, [0:44] professional designers all use us to [0:46] visually communicate their ideas, [0:48] whether it's through a prototype, [0:49] interactive mockup, or a code ready [0:52] export for production. You don't come [0:53] from a design background and so talk a [0:56] little bit about the inspiration for [0:57] building this. [0:57] >> Yeah, it does. We are unique in that we [1:00] are non-designers. My co-founder and I. [1:02] We are by trade front-end engineers. And [1:05] actually when we got into the YC batch, [1:07] our YC partner told us do something that [1:09] you're really good at. What are you what [1:10] do you know really well? And for us that [1:12] was translating Figma mockups into code. [1:16] And that's how Magic Patterns was born. [1:17] It was the product that we always wanted [1:19] ourselves. There was something always [1:21] there where I was never really good at [1:23] Figma and we just felt like well wait a [1:26] second I'm doing lots of front-end [1:27] engineering as a founder I have to do [1:30] lots of design what is a tool that is [1:33] more intuitive [1:35] and easier for non-designers like myself [1:37] >> and this was the early days of a lot of [1:39] uh prompt to design tools or prompt to [1:42] prototype tools coming out right you [1:44] guys were actually one of the first that [1:45] was doing that [1:46] >> we were certainly one of the first when [1:48] we launched in October 20120 23, the [1:50] only other tool on the market similar to [1:52] us was Vzero. [1:54] >> And if you look back, that was before [1:55] even chat was a thing. The models were [1:58] so bad that there was no chat. There was [2:01] no back and forth conversation. It was [2:02] literally just prompt, you get a design. [2:04] Prompt, you get a design. No actual [2:07] interaction with the agent. You applied [2:09] to YC and you you had a different idea. [2:11] And so maybe talk about some of the the [2:13] origin story of how you met your [2:15] co-founder um your time during YC and [2:17] then ultimately what led you to building [2:19] this. [2:20] >> Yeah. So my co-founder and I we actually [2:22] applied to YC with a text message [2:24] analyzer. Your top group chat, your top [2:27] word, what's the funniest thing you sent [2:29] in 2026 across all your group chats. Um [2:32] and we had revenue which I think is why [2:34] we got into YC. But we get in and our YC [2:37] partner tells us, "Hey, this is this is [2:39] your company. It's an okay idea, but I [2:42] highly recommend you do something that [2:44] you know really really well." And for [2:46] us, again, that was front-end [2:48] engineering and implementing Figma [2:49] mockups by code. And then so then during [2:51] all of our pivots, that's pretty much [2:53] what we focused on. [2:54] >> How long did it take you to get to the [2:55] idea that ultimately became magic [2:58] patterns? [2:59] >> It took us about 9 months. We were [3:01] always circulating around it. So again, [3:04] we were doing a component library [3:05] editor. We were doing kind of storybook [3:08] on steroids. We had a Chrome extension [3:10] that allowed you to bring local host um [3:14] and instantly publish it on the internet [3:16] as kind of like a feedback tool that [3:18] later became a feature of of Magic [3:20] Patterns. And throughout all of that, [3:22] the main thing that I learned was that [3:24] classic PG advice, find 10 users who [3:27] really love you. None of those pivots. [3:30] We had we didn't have any 10 users that [3:32] really loved us where love is defined as [3:34] they're paying you and they're using [3:35] you. And then once we launched what [3:38] became Magic Patterns, those 10 users [3:40] came very quickly. [3:41] >> How do you stay differentiated in a [3:43] world where it feels like the design [3:45] tools keep leveling up significantly [3:47] every 6 months? And you guys were one of [3:49] the the original prompt to design [3:52] products that are out there. And so how [3:54] do you find your audience in that and [3:56] and keep staying ahead of the game [3:58] especially as the models continue to [3:59] improve as well? [4:00] >> I've said this before on a video like [4:03] customers are our religion [4:04] >> talking to them every single day and [4:07] then also adapting to new workflows. As [4:09] an example, we released an MCP about a [4:14] year ago as part of a hackathon project [4:16] internally. [4:16] >> Mhm. [4:17] >> We didn't think it would go anywhere and [4:19] now MCP usage has completely exploded. [4:21] It's one of the main ways that people [4:22] interact with magic patterns. And so you [4:24] always have to be almost rebirthing your [4:27] company to uh adjust to new workflows, [4:30] especially in the AI world. [4:31] >> I I'd love to see a demo. Can you show [4:33] us uh a little bit about how it works? [4:34] >> Yeah, let's do it. I think one thing [4:36] that would be good to start is I'll show [4:37] you how we use it internally. [4:39] >> And you're always dog fooding your [4:40] product, right? [4:41] >> We are obsessed with dog fooding, but we [4:43] never force the dog fooding because then [4:45] it's you're not getting actual, [4:46] >> right? has to be good enough that you [4:48] actually want that and you choose that [4:50] to be your tool. Right. [4:51] >> Exactly. And then noting when you don't [4:53] choose it. And so we've been dog fooding [4:55] creating our loading indicator for our [4:57] own product. So you know we have Wall-E [5:01] Eve from Wall-E or some of the if you [5:04] ever played Portal the video game we [5:06] were thinking through that kind of what [5:08] that might look like as a loading [5:09] indicator. [5:11] What's neat here is everything here is a [5:13] global chat. So we can make uh any [5:15] updates and and make several updates at [5:17] once, right? Like as an example, I could [5:21] select the two of these. Say, give me a [5:25] new style [5:29] of loading indicator that merges the [5:32] inspiration of the cloud code [5:36] icon and the Grockbot. And what's really [5:39] neat, too, is of course you can use the [5:41] MCP. So let's go ahead and do that just [5:44] to kind of show it. I'm going to go into [5:45] cursor here and through using our MCP I [5:49] can just go ahead and prompt right add [5:51] an asky version of my agent. What's [5:54] really neat is we're seeing lots of [5:55] enterprises use this where they have so [5:57] much context like in cursor or cloud [6:00] code whether it's PRDs and and meeting [6:03] notes. So they can leverage all the [6:04] skills that they already have but then [6:06] instantly kind of put it on this visual [6:08] canvas to better communicate. [6:12] Yeah, it's interesting. So, you've got [6:13] this powerful canvas in in magic [6:15] patterns where when that's the best tool [6:17] for the job, you can be working directly [6:19] in there and when you want to be working [6:21] in code or in cursor, another app, you [6:23] can just pull directly from that through [6:25] the MCP. [6:26] >> Yeah, exactly. And what's cool too is we [6:28] have so many customers that come up to [6:29] us and say, I'm using cursor and cloud [6:31] code, but it gave me local host. I can't [6:34] share [6:35] >> I can't share my prototype with anybody. [6:37] Say, oh, well, we have a solution for [6:38] you. Right. [6:39] >> Yeah. Yeah. So, what's cool here is [6:40] actually we can see my colleague on here [6:43] as well as the cursor agent from that [6:44] cursor prompt that we fired off, right? [6:46] And so, they're working simultaneously [6:48] and we can go ahead and just open this [6:49] up here. [6:51] >> We can see this is like that asy version [6:53] uh of of cloud code, right? Um, and kind [6:57] of playing around, oh, what would it [6:58] look like with different colors? Now, [7:00] obviously, this is very cloud codeesque. [7:02] We're just kind of getting inspiration [7:03] here uh to make our own loading [7:05] indicator. and it generated this entire [7:08] page showing off the work that it had [7:10] done. [7:11] >> Yeah, exactly. So, like one thing that [7:13] we encourage users to do and we've seen [7:16] users do ourselves is explaining kind of [7:18] the choices [7:20] >> and the different states. So, uh as [7:23] another example here, if you kind of [7:25] look at this one, we were thinking [7:27] through, well, what does it look like at [7:29] different screen sizes? What does it [7:31] again look like if it's clawed code? [7:33] kind of playing around with should it [7:35] look more like a helmet or like a [7:36] pillow, right? Again, just brainstorming [7:38] and exploration. That's where we see [7:40] users get the most value in a tool like [7:42] ours. Yeah. I mean, that's I think one [7:44] of the most valuable things at the idea [7:45] and inspiration stage is just being able [7:48] to fire off a bunch of different [7:49] variations. And a lot of times, um, it's [7:53] hard to manage those and they're all in [7:54] different tabs and stuff. And it seems [7:56] like Magic Patterns is able to just give [7:58] you a bunch of nice tabs and options and [8:01] kind of enumerates everything's like [8:02] like here's a bunch of color options, [8:03] here's body options, here's different [8:05] agent options. And it's really cool to [8:07] do that in a very um centralized uniform [8:10] way to actually make the tweaks and [8:11] explore, find what you like, and then be [8:14] able to move on faster to the next step [8:15] in the flow. [8:16] >> Totally. Because I think what's changed [8:18] about software development in the last [8:20] year especially is the end stage is so [8:23] compressed now. It's so easy. Everyone's [8:25] talking about this, right? How engineers [8:27] are just moving at the speed of light. [8:28] There's too many PRs to review. And so, [8:30] as a result, we can spend more time [8:33] actually brainstorming, thinking about [8:35] what to build and what not to build and [8:37] using something like Magic OS to really [8:39] visualize [8:41] and think through the different ideas [8:43] and concepts, error states, loading [8:45] states, uh what happens when it's [8:47] multiple agents working on a file. [8:49] Here's actually I think this one is [8:51] really cool [8:53] where we were thinking through well okay [8:56] lots of folks use the MCP to use our [8:58] product and they might be using it [9:00] through cursor or claw code or codeex [9:03] and thinking through what that might [9:04] look like and through magic OS we [9:07] actually brainstorm kind of this like [9:08] LED style um design [9:11] >> and so is this whole page a canvas? [9:13] Yeah. So, this is all a canvas. Um, and [9:16] what's cool is we also think of it as [9:18] almost like an artboard, right? Where [9:20] you can bring in any of your context, [9:22] whether that's images or PRDs or [9:25] documentation. [9:26] And again, what's neat is we're not [9:28] blocked here by a single thread, right? [9:30] So, historically, when you use lots of [9:32] these design tools and prototyping [9:33] tools, you kind of have to wait for the [9:35] AI agent to finish, right? But on any of [9:38] these, we have many, many threads here. [9:40] So, I can go back to kind of what we [9:42] first did. uh when we first created our [9:45] our first design here on this canvas. [9:47] >> I know you've kind of gone back and [9:48] forth on canvases in general [laughter] [9:51] um as as an interface and just talk [9:54] about your thinking and and what you've [9:55] discovered kind of being at the frontier [9:57] of that for when it makes sense and when [9:59] it doesn't. [9:59] >> Totally. So I'll actually show that [10:01] where we've had a canvas for a long [10:03] time. What you just kind of saw is [10:05] canvas 2.0, [10:06] >> but we've had a canvas [10:08] >> for roughly two years now. And what we [10:11] learned and actually We're hiring, by [10:13] the way, we're hiring a designer. One of [10:15] the reasons that we're hiring a designer [10:16] is one of our issues that we've had is [10:19] thinking through that initial onboarding [10:21] experience and almost like this [10:23] progressive disclosure of okay, when [10:25] does it make sense for users to know [10:28] that they can use a canvas versus just [10:30] kind of a single chat thread. One of the [10:32] initial learnings that we had is like a [10:33] canvas is not necessarily for everyone. [10:37] And actually this new product that we've [10:40] released, we're intentionally calling it [10:41] an OS because it's an operating system [10:44] for all of your context. So of course [10:47] like the interface is a canvas, right? [10:49] We see here our images and you can bring [10:51] in documents and then make designs, but [10:54] it's not a canvas in the traditional [10:56] sense where something like Figma and [10:58] having a bunch of tools on one side. [11:00] >> Yeah. So, it's it's more like you've [11:02] you've got canvas like artboards that [11:05] you can get in there and you can [11:06] customize. Um, you also talked about [11:08] front end and being able to see what [11:10] it's like to actually experience the [11:12] design that you're making and not just [11:14] have these static files. Maybe can you [11:16] show us something around that? [11:18] >> Cool. So, yeah, let's do another example [11:20] here. One thing that is really, really [11:21] fun for us is we do what we call magic [11:24] patterns meetups all over the world. And [11:26] I've been thinking about I want to send [11:28] our users postcards from these meetups. [11:30] So, let's take this from the top. So, [11:32] let's go ahead and add some context. So, [11:34] I have basically these pictures that [11:36] I've pulled uh and all of these [11:39] descriptions from our events that we [11:41] hosted. So, as an example, I was just in [11:44] Colia actually hosting um what I called [11:46] Magic Patterns Medí and we met some [11:48] power users there. I learned that magic [11:50] patterns was taught at a university [11:51] which is super cool. And I also have [11:54] this prompt, right? Uh where if we open [11:57] this up here, this is a prompt that I [11:59] just kind of came up with like a rubber [12:01] stamp travel notes field poster. And so [12:04] what's cool is I can go ahead and just [12:07] tell our agent [12:09] reference [12:11] my prompt on the canvas and then make [12:16] postcards [12:20] for every single city and image. [12:24] >> Cool. So you've got images for Medí, [12:27] Singapore, you got Statue of Liberty, so [12:29] New York and then Toronto. [12:31] >> Uh exactly right. And notice how like [12:33] the agent has all of the context that is [12:36] on the the canvas already, right? It [12:39] automatically knows what is really in [12:40] the in the file system, what's on this [12:42] artboard here, and it can go ahead and [12:44] then make make its updates. So, what's [12:47] cool here is we see it generated all [12:48] four postcards at once. We can go ahead [12:51] and just see a bigger version of this [12:52] here. [12:54] My prompt was basically telling it to [12:56] make kind of like a stamp of the the [12:58] image that that it had. And now because [13:02] we're on a canvas, I can go ahead and [13:03] just grab kind of my description of our [13:05] Singapore event. Right here, I have kind [13:07] of just some random notes from when our [13:09] meetup was. It was on May 17th. And I [13:12] can go ahead and select these two. Say, [13:15] now make a design of a postcard [13:21] that references the description thanking [13:24] users for attending. And when this is [13:27] done, of course, we can iterate on just [13:28] the Singapore one specifically. and then [13:30] apply all of those changes to all the [13:33] cities at once, right? Without having to [13:35] redo it. [13:36] >> And who are the people uh within your [13:38] team that are actually using this and [13:40] creating these postcards? Cuz it seems [13:42] like it doesn't necessarily need to be [13:44] designers, right? [13:44] >> Yes. So, we have everyone from our ops [13:47] team to our sales team using magic [13:49] patterns. So, as an example, our go to [13:52] market person is creating these [13:53] postcards in magic patterns to send out [13:55] to users. And historically, this was [13:57] someone that didn't know how to use [14:00] Figma, would have to outsource this type [14:02] of work. And so, that's what's really, I [14:04] think, special about our our tool is how [14:06] much we have been kind of democratizing [14:08] design. [14:09] >> Mhm. You can export to Figma as well. [14:11] So, you play nicely with the other [14:13] tools. [14:14] >> One thing that's very different about [14:15] our tool is that we're model agnostic [14:18] and in a way feature agnostic, right? [14:21] where we encourage folks to export to [14:23] Figma if they want to and and get high [14:26] fidelity precision or export to the [14:29] coding agent of their choice. Right? [14:31] Some of our other competitors like cloud [14:32] design as an example, it's only the [14:34] anthropic models. You're only exporting [14:36] to cloud code. There's no integration [14:38] with Figma versus a tool like ours, you [14:40] know, we have integrations with anything [14:42] you can think of. [14:43] >> So prompting is obviously very important [14:45] here. What's your advice for how people [14:47] should improve their prompts and and get [14:48] better results from them? Yeah, I think [14:50] it's leveraging the features that tools [14:52] offer. The thing that's really [14:54] interesting that I've seen is there's [14:55] more and more AI enablement teams [14:58] popping up at especially large companies [15:00] and what are they doing? They're [15:02] leveraging things like skills agents MD, [15:04] right? And bringing in your unique [15:06] context that's relevant to your company. [15:09] So, of course, we have, you know, skills [15:11] feature in magic patterns where you can [15:13] go ahead and uh and add your skills uh [15:16] or as we were talking about add your [15:18] design system and bring in your [15:20] components. And that's what I always [15:21] recommend first is like spend the 10 [15:24] minutes to bring in your existing [15:25] context. It'll save you hours in the [15:27] long run. [15:28] >> Mhm. What's one of the coolest things [15:29] that that you've seen created with Magic [15:31] Patterns? [15:32] >> Yeah. One of the most fun is this roller [15:34] coaster tycoon theme park. Uh it's like [15:37] a a chocolate park, which is crazy [15:40] because when we first started this, you [15:42] know, you would prompt like a form and [15:44] it would give you back like a drop down. [15:45] Like the models were so bad. And now [15:47] suddenly, you know, we're seeing folks [15:49] literally bring in [15:51] >> like building entire video game [15:52] experiences. Again, this is not a very [15:55] common use case, but it's kind of [15:56] sharing what's possible when the input [15:59] and output is code. [16:01] >> And what was this created for? [16:02] >> This is really just created for fun. um [16:05] you know experimenting with what is [16:06] possible like in in the browser and [16:09] actually thinking through how components [16:12] can help you design uh in a tool like [16:15] this. Right? So actually when you think [16:17] about a chocolate factory theme park in [16:19] Roller Coaster Tycoon, the track is a [16:22] component, the chocolate bar twister [16:25] ride is a component. The path that [16:28] guests walk on are components. And so [16:30] when you give the AI those guard rails, [16:32] how can it output like a theme park in [16:35] one shot or two shots bringing in that [16:37] context. [16:38] >> Oh, very cool. And you can even get [16:40] right in there, see all the little [16:41] people walking around. [laughter] [16:43] >> Yeah. And again, it's amazing. We're [16:44] like, this is literally just, you know, [16:46] WebGL ren rendering in the in the [16:49] browser, right? And we can see that we [16:50] again, the way that we did this is we [16:52] use a design system that we called the [16:54] 3D theme park, right? So, I can go ahead [16:56] and update that to bring in my my latest [16:58] components. uh and and updating it is [17:00] really as simple as prompting something [17:01] like no trees, just lollipops and more [17:04] uh chocolate rivers, right? [17:06] >> What does this tell you now about what [17:07] might be possible with magic patterns? [17:09] It seems like this is far beyond just [17:11] making a postcard or website design or [17:14] something. [17:14] >> Yeah, I think it showed me that design [17:16] has historically been 2D, right? And [17:19] it's been really hard if you worked on a [17:20] software team four years ago going back [17:23] and forth with the designer and the [17:24] engineer and the PM. What should the [17:26] exact interaction be? Then you see [17:28] something like this where people are, [17:29] you know, oneshotting [17:31] 3D theme parks and I think it's a taste [17:34] of the of the future where people can [17:37] really design full-on interactions that [17:39] are high fidelity, you know, and using [17:42] their their components. [17:43] >> Yeah, it's going to [music] be a wild [17:45] future for sure. [17:46] >> Definitely. [17:47] >> YC's next batch is now taking [17:49] applications. Got a startup in you? [17:52] Apply at y combinator.com/apply. [17:55] It's never too early and filling out the [17:57] app will level up your idea. Okay, back [18:00] to the video. [18:01] >> You talked about how you've seen [18:03] thousands of vibecoded designs. You're [18:05] probably a world expert on this. Should [18:07] we review some websites? [18:08] >> Let's review some websites. This will be [18:10] a lot of fun. [18:10] >> Okay, great. All right. First, looks [18:12] like we got Ego. Agents are machines. We [18:15] make them people. Ego is an applied AI [18:18] research lab building personal agents [18:19] indistinguishable from humans. [18:22] >> Okay. [18:22] >> All right. What do we think? So, first [18:24] off, I mean, it's cool. Here's here's [18:26] the thing that I think people miss about [18:27] landing pages in general. The real [18:30] metric to track is does it convert? And [18:33] I obviously don't know what what it if [18:35] this is converting or not, but my sense [18:37] is like I don't know. It's not [18:40] accessible. I don't know where the CTA [18:42] is. Is the CTA Ronin? [18:44] >> Yeah. What What do you think they want [18:45] us to do here? [18:47] >> I mean, my initial reaction is like I [18:49] should just keep scrolling. Yeah. Right. [18:51] Um, [18:53] one interesting thing that we've learned [18:55] about our own landing page is, you know, [18:57] everyone that has a vibe coded tool has [19:00] that input or to to prompt to get [19:02] started. And for a little while, we [19:04] removed it to try and be more creative [19:08] >> and our conversion rate totally tanked. [19:10] >> We learned why people do that, right? [19:12] And so I always encourage folks to think [19:14] about like what are you ultimately [19:15] trying to do here? [19:17] >> Okay. So then there's like an app in [19:19] there. Yeah. I guess I I'm halfway down [19:21] the page and I'm still unclear what is [19:23] this and who is it for. Uh I guess [19:26] there's a wait list, so maybe it's not [19:27] live yet. [19:29] >> Yeah, let's see. [19:30] >> And now they're getting into more of the [19:31] description. It's a voice agent with a [19:32] personality, a memory, and a mind of its [19:34] own. That feels like the kind of thing [19:35] that should have been all the way at the [19:37] top, [19:37] >> right? [19:37] >> Like the site should start here with [19:40] this because this is the call to action, [19:42] which is join the weight list. But we [19:43] had to scroll down pretty far in order [19:45] to even get to this point. [19:47] >> Totally. And I'm kind of laughing here [19:48] that like this main CTA to join I had to [19:52] do there was an interaction there. [19:54] That's another almost an example of [19:56] something that maybe was potentially [19:57] vibe coded. AI agents they love adding [20:01] animations and things like that, right? [20:03] Overly animating. And so, [20:06] >> you know, why not just start it with [20:08] that, right? [20:08] >> Yeah. That that's actually interesting. [20:10] Um, we ran some tests at my company, [20:14] Creative Market, and um, when you had [20:17] the input form visible and expanded [20:20] directly on the page, conversion rate [20:22] was much higher than requiring somebody [20:23] to click through to then put in an email [20:26] address or pop up a window or get to the [20:28] form or something like that. So, I I [20:30] would [snorts] recommend whenever [20:31] possible, yeah, just start with the text [20:33] box open and people can just type type [20:35] right in it. It's pretty shocking how [20:38] that actually significantly impacts um [20:40] conversion rate of people entering [20:42] information there. [20:43] >> Yeah. And that's what I encourage like [20:44] think about the human. I think AI [20:47] agents, they they're again they're [20:48] rewarded of doing fun things like motion [20:51] and overly animating, right? But the [20:53] human is not going to spend a lot of [20:54] time on your site. They're in a rush. [20:56] Yeah, we see a lot of there's blinking [20:58] dots everywhere and um I don't know if [21:01] music is playing, but it looks like [21:03] there's some type of you know, like [21:05] music faders or something going there. [21:07] Um and so yeah, it's it's kind of hard [21:10] to tell what's going. Um I like the [21:12] overall vibe. It it's like it's got this [21:14] kind of dark mode red. It feels very [21:16] like 80s video game kind of. Um which I [21:20] think is is interesting. Um, but it's [21:23] also hard to read some of the things. [21:25] Like it actually looks like maybe [21:26] there's an input box or something over [21:27] on the right hand side and and I almost [21:29] missed it because it's not clear to me [21:31] that it exists. [21:33] >> Yeah, this is another kind of vibe coded [21:35] smell that I I commonly see is you can [21:38] see my my mouse here is letting me [21:41] interact with this, but I can't actually [21:43] type anything, right? And so, you know, [21:46] and then I'm like, well, what's going [21:48] on? [21:49] >> Yeah. Yeah. Yeah, there's a pattern that [21:50] I've seen where sometimes you have [21:52] actual UI elements embedded in the page, [21:54] but they're actually real and and [21:56] interactive. And that's cool to be able [21:58] to do that. That's something that I [22:00] think agents make a lot simpler now that [22:02] was much harder to do before. And so it [22:05] can feel very interactive and like you [22:06] can actually try out the product live on [22:08] the page and that's super cool. But [22:10] yeah, the flip side is when it looks [22:12] like something like that and it becomes [22:13] misleading and you think that you can [22:15] interact with something but but you're [22:16] actually not able to. [22:17] >> Yeah. Yeah. And I think it's important [22:18] to talk about like why does this matter? [22:20] Why does it matter if [22:22] >> there's a vibecoded smell on the [22:25] website, right? And I think it matters [22:26] because you can notice how distracted we [22:28] are by this input trying to type and [22:31] we're distracted from the core thing [22:33] which is whatever the CTA is supposed to [22:35] be. I guess in this case, right, it's [22:36] join the join the wait list. [22:38] >> Yeah, it's cool. If you scroll down, you [22:39] see um the pictures of the people. They [22:42] match that vibe, that kind of 80s video [22:45] game throwback vibe, which I think is [22:47] cool. Um, you know, they had that [22:49] eyeball up at the top, which is like [22:52] very provocative. Um, it creeps me out a [22:55] little bit. There's like an eyeball [22:56] looking directly at me, but um, but it's [22:58] interesting and and it becomes memorable [23:00] if that's the vibe that you're going [23:02] for. But yeah, it just wasn't obvious to [23:04] me what this is until we got halfway [23:06] down the page. And so, um, I think just [23:09] a little more about what it is and [23:10] what's the action that you want people [23:11] to take. Even that call to action in the [23:14] top right, that button, it just says [23:15] Ronin, [23:16] >> right? [23:17] >> I don't know what Ronin is. The [23:19] company's called Ego. I guess it says [23:21] here Ronin launching September. Is Ronin [23:24] a product? Is it a model? Is it It's not [23:26] clear to me what this is. And so, I [23:28] think ultimately I'm just left very [23:30] confused. [23:31] >> This is another vibe coded smell, by the [23:33] way. It says scroll right here. [23:36] I'm naturally going to scroll. Like I [23:38] don't think personally I don't know many [23:40] instances where where a human would feel [23:42] the need to put scroll there because [23:44] naturally you're going to do that versus [23:46] I commonly see agents trying to always [23:49] nudge the user to do to do something. [23:51] >> Mhm. [23:51] >> Should we take a look at another one? [23:53] >> Yeah. Okay. We got sentient OS. Your Mac [23:56] sentient. An ondevice LLM understands [23:59] your entire life then proactively offers [24:02] to get your work done through computer [24:03] use. Okay, that's interesting. And then [24:07] I guess we have an image here of a [24:09] laptop that's open. [24:11] >> Whoa. Okay. And it closes when you [24:13] scroll. [24:14] >> Hold on. Go go go back for a sec. [24:15] >> Oh. [24:16] >> So, [24:18] all right. So, there's a bunch of stuff [24:20] going into the middle. And then when you [24:22] scroll down a little and it says, "While [24:25] you sleep, your Mac understands your [24:28] entire life." Okay. And I think notice [24:31] something here. I'm really struggling to [24:34] like perfectly match the scroll. One [24:36] thing I I never see a, you know, [24:40] decacorn company ever do any kind of [24:43] scroll jacking. [24:44] >> Yes. [24:45] >> Why don't they do any kind of scroll [24:46] tracking? Well, because it does not [24:47] convert and it's frustrating. Um, [24:50] another thing that I see AI agents doing [24:52] doing a lot, right? I mean, just notice [24:54] like, okay, if I I missed it, [laughter] [24:58] right? Uh again, go to like the top [25:00] Fortune 500 company sites that are have [25:02] millions and millions of page views. [25:03] They are not scrolljacking. [25:05] >> Yeah. What's frustrating about it is [25:07] you're used to the precision of how you [25:09] move through a site [25:11] >> when you're scrolling. And when you hit [25:13] a site and it's different precision, you [25:16] know, it it keeps scrolling after you [25:19] stop touching the mouse or the trackpad, [25:21] it messes things up and it feels [25:23] unnatural. Um and so please everybody, [25:26] please stop scrolljacking. [25:28] It's very simple. Just keep the normal [25:30] scroll because there's some cool stuff [25:32] that's happening here, right? Like like, [25:34] okay, we started out with the laptop [25:35] screen open. A bunch of things are going [25:37] into it. The lid closes [25:39] >> and I think it's trying to tell you like [25:41] all this stuff happens while you sleep. [25:43] The lid is closed [25:44] >> and then you wake up to your finished [25:46] work and so it wakes up and here's all [25:48] the things that it's done and then it [25:49] takes you through that. So the visual [25:51] and the experience, what I like about [25:53] this one is it's actually reinforcing [25:55] the concepts that it's trying to tell [25:57] you about. Mhm. [25:58] >> When it talks about going when you [26:00] sleep, the lid closes, the computer is [26:02] asleep. Then it's like, oh, it wakes up, [26:04] it does all the work while you sleep. So [26:05] when you wake up and then boom, the [26:07] laptop comes back out. We have all the [26:09] work is done and it's showing it to us. [26:11] That's I think the best version of an [26:12] animation is not animation for [26:14] animation's sake, but animation that [26:16] actually reinforces the point that [26:18] you're trying to make and communicate [26:20] something in a way that just being [26:22] static would not have been able to do. [26:23] >> Totally. I mean, it's it's definitely [26:25] helping me understand what this product [26:28] does. Uh, but I would also I always [26:31] think when you're you're trying to be [26:32] too creative or something, that's great [26:34] on like a product page or a video, [26:38] not your landing page. Your landing [26:40] page, the number one thing you want to [26:42] try to get me to do is click this [26:43] button, download for Mac uh OS, right? [26:46] Uh, also just speaking about that button [26:48] for a second. This kind of glow, [26:51] another bit of a vibe coding smell [26:54] again. And hey, it's definitely getting [26:56] my my attention. Uh, but one thing that [26:59] I've noticed is AI agents, they love to [27:04] overdo it on this kind of gradient on [27:07] this massive drop shadow. Uh, and again, [27:10] look, it got my attention, but it's just [27:12] one thing to be wary of if that's [27:14] something that you're trying to not do. [27:16] >> Yeah. And then what do we have further [27:18] down the page here? [27:23] >> Recipes. [27:25] >> I think what what's interesting here is [27:27] again, this is that main CTA, right? I [27:29] scroll through the whole thing and I'm I [27:31] you really want me to click this button [27:33] or perhaps even do this homebrew [27:35] installation, but it's so small. Like [27:38] I'm at like 100% and I can barely see [27:41] it, [27:41] >> right? Uh and like this has this kind of [27:44] hover effect. I guess this brings me to [27:45] the GitHub. I can barely read that. [27:48] [laughter] [27:48] >> Yeah, it's really tough to read those, [27:50] >> right? Like free. [27:52] There's a reason that free is giant on [27:54] pricing pages. [27:55] >> Yeah. Download for free. [27:57] >> Yeah. Exactly. Right. And I swear it's [28:00] it's you know, perhaps it's because of [28:03] the angle, but it doesn't really matter. [28:04] I cannot see the word free [28:06] >> right [28:06] >> right now. If you have something [28:08] important to communicate, it shouldn't [28:09] matter the angle that the user is [28:11] looking at it. It should be painfully [28:12] obvious. [28:13] >> Yes. Exactly. [28:15] >> All right. I mean, I guess maybe, you [28:16] know, one of the other pieces of [28:17] feedback for a product like this that [28:19] runs locally on your machine. Privacy [28:21] and trust is something that's very [28:23] important. What do they do with the [28:24] data? I I guess they have an FAQ here to [28:28] try to answer some of this, but this is [28:30] actually an interesting problem in new [28:32] world of AI apps and LLMs is they need [28:36] so much data and so much context to be [28:38] really valuable and especially a product [28:39] like this that's going to run locally on [28:41] your machine and have access presumably [28:43] to everything that's on your computer. [28:45] And so there's a new bar that needs to [28:48] be established for trust and privacy and [28:51] security for all of these types of [28:53] products. My take is that I actually [28:56] think the products that really lean into [28:57] that and go above and beyond to make [29:00] users feel super comfortable around what [29:02] is the data we're going to have access [29:03] to, how are we going to use it, what are [29:05] our retention policies, is this secure [29:08] or not, all these things and being very [29:09] proactive about that are the ones that I [29:12] think are going to have more success of [29:13] getting users to download and try it and [29:15] spread the word and tell their friends. [29:17] >> Totally agree. As someone who applied to [29:19] YC with a text message analyzer that was [29:21] open source and read your IME messages [29:23] all locally on the computer, I [29:26] completely agree. [29:26] >> And so what were the things when you [29:28] were working on that product that you [29:30] thought about that you felt like you had [29:31] to do in order to get people to trust [29:34] your product and give it access to all [29:35] of their text messages? [29:37] >> Hero on the landing page was open source [29:40] completely on device. [29:42] >> Mh. [29:42] >> Right. Communicating that the internet [29:44] doesn't touch it in any single way. And [29:47] that's what we learned that people [29:48] really really cared about, right? And [29:50] they do it here, you know, in ondevice [29:52] LLM. Yeah. [29:53] >> But it's funny like like is the word and [29:56] really even necessary. Like it's it's [29:58] interesting to me they're like bolding [29:59] these words. Another sign of AI writing [30:02] actually is you can look this up on [30:03] Wikipedia is when random words are are [30:06] bolded, right? Like but just [30:08] communicating those kind of that most [30:10] important thing which is that it's on [30:12] device. Yeah. [30:14] >> Another thing that kind of makes me [30:15] laugh is this font. Let's see what the [30:17] font is. Space uh grotesque is is always [30:23] the the font that is uh Oh, instrument [30:26] sif is another one. [laughter] [30:29] Instrument sif. Claude code loves [30:31] instrument sif which is funny. And this [30:34] kind of reminds me of the mdash, right? [30:35] It's like you can still use the mdash in [30:37] your writing, but unfortunately people [30:38] are going to look at it and go, "Oh, he [30:40] used AI, right?" instrument sif space [30:43] grotesque. [30:45] >> It's interesting how these things are [30:46] trends that sometimes are hard to spot [30:48] in the moment. I feel like we're on it [30:50] and you know we can spot it in the [30:52] moment here, but it's like you see a [30:54] kitchen that was designed in the '8s or [30:56] something like that and you're like, [30:58] man, this looks like an outdated [30:59] kitchen, but in the '8s it probably [31:00] looks like a modern kitchen. And that's [31:02] what some of this feels like. It's [31:04] something that feels like of the moment [31:06] now, but 5 10 years we're going to look [31:08] back at this, we're going to be like, [31:09] "Oh yeah, that's a hallmark mid 2020s uh [31:13] site design that will feel outdated um [31:16] at that point." And so I don't know, I [31:18] would encourage people just resist the [31:19] urge to do the default that the agents [31:22] are spitting out when they're designing [31:23] or the default fonts or use something [31:25] that is more unique to you and [31:26] communicates what you want to [31:28] communicate rather than just using the [31:29] thing that everybody else is using. And [31:31] that's the way to create more timeless [31:32] design, I think. [31:33] >> Yeah. And and establishing that brand [31:35] book earlier on. That's one thing that I [31:36] regret that we didn't do earlier for our [31:38] own company was establishing a brand [31:40] book. Deciding on what is the brand, [31:43] what is your font, uh your really your [31:46] design system. Uh companies should do [31:48] that [31:49] >> earlier for sure. [31:50] >> All right. Well, thank you, Sentient OS. [31:53] >> Let's do another one. [31:54] >> All right. Sarah Novice, institutional [31:56] intelligence and decision [31:58] infrastructure. [32:00] Yeah, [32:01] >> I don't really know what that means, but [32:03] uh Saranovas is your AI operating [32:05] partner. It reads every record your [32:07] company produces, finds the operational [32:09] inefficiencies nobody's tracking, and [32:10] warns you while problems are still [32:11] small. Okay. Um I don't know. This is I [32:15] think the copy could be improved here. [32:17] It's very generalized. It's very vague. [32:19] I'm kind of like, is this something I [32:20] need? I'm not really sure. It does [32:23] everything that my company wants and [32:24] finds inefficiencies. [32:26] Um it's a decision infrastructure. I [32:28] don't know what that means. So, I think [32:30] something that would be helpful is just [32:32] getting to more specifics or more [32:33] specific language around who should use [32:36] this and why because right now I think [32:37] it's it's too unclear. [32:39] >> I it's interesting to me like the [32:40] there's so much padding, right? Like [32:42] there's just a lot of white space where [32:43] this is this is what they call above the [32:45] fold right before I scroll. It's such an [32:48] important section, the hero section of [32:50] the landing page and yet immediately my [32:52] eyes [32:53] >> I'm like looking at whites space right [32:55] now, [32:56] >> right? Um, unfortunately, this is also [32:58] kind of like a classic vibe coding [33:01] smell. [33:02] >> Uh, this [33:02] >> small all caps. [33:04] >> Exactly. Yeah. Um, and again, it's like, [33:07] okay, is there anything inherently wrong [33:09] with small all caps? Not necessarily, [33:11] but when I read it, every claim cited, [33:14] years of history, live from day one, [33:18] >> nothing installed, no interviews, but I [33:19] still don't even know what the product [33:20] does. [33:21] >> Yeah. Yeah. Exactly. [33:22] >> I didn't even know it was going to be [33:23] something that was installed. That was [33:25] not my assumption to begin with. So [33:26] >> yeah. Yeah. Yeah. Exactly. Like nothing [33:28] installed where like am I dealing with [33:30] hardware? Um [33:32] >> oversight over the operations. It finds [33:34] the inefficiencies. Foresight with [33:36] receipts. Yeah. I just need specific [33:38] examples. Like as we're scrolling, do [33:40] they give specific examples? Start with [33:42] the problem on your desk. Enterprise [33:44] middle market. Private equity. Yeah. [33:47] It's this is like who they go after [33:51] >> and which is this is not helpful because [33:54] it's about them. It's not about the [33:56] user, right? The user doesn't care who [33:58] they go after. The user cares about they [34:01] have a problem that they want solved and [34:03] can Saranovas help solve this problem [34:05] for me, [34:06] >> right? It's almost like right now I have [34:08] to think through am I enterprise middle [34:11] like who am I? [34:12] >> Yeah, [34:12] >> let's pretend I'm secondaries or I'm [34:15] continuation vehicles. I have to look at [34:18] this, but I had to like click to decide [34:20] who I am. You're making me think, you [34:22] know, [34:22] >> too much work. [34:23] >> And again, to your point, what I really [34:24] want to see are the solutions. [34:27] >> Yeah. You know, this is um a trend that [34:30] I see with vibecoded sites and [34:32] especially we see this a lot in YC [34:33] applications. One of the things that we [34:36] see is um it's it's almost like it makes [34:38] a slide deck for the company [34:41] >> that's kind of pitching the company um [34:43] almost to investors a lot of times or [34:46] like the the models think that is the [34:48] intended audience for a startup or a [34:50] startup website and sometimes it is like [34:53] investors will look at the thing but um [34:55] that's not who you should be speaking to [34:57] and who you should be targeting. You [34:58] should be talking about your product who [35:00] should use it why why it's valuable what [35:02] problem it solves for them. social proof [35:04] of, you know, other people that use this [35:06] that are like those users and how much [35:08] it's helped them. These are the things [35:10] that I think real users want to find [35:12] rather than a pitch deck about who they [35:15] target and yeah, here's the four [35:17] guarantees and it's like I don't even [35:19] know. I still can't even figure out what [35:20] you do. Uh, one thing that's interesting [35:22] I noticed because we just talked about [35:23] this, there's a link at the top that [35:25] says trust and security. And that's not [35:28] something that you normally see [35:30] >> um in a main navigation of a site. Um [35:34] and you know coming off the discussion [35:36] we just had around maybe companies [35:38] should put more emphasis on this. It's [35:41] actually interesting to see them doing [35:43] that and putting it up there and having [35:44] an FAQ. What data do we collect? Where [35:46] does the data live? Um, I would not be [35:49] surprised to see this become a more [35:51] common pattern that we're going to see [35:53] across um, AI sites trying to talk about [35:56] the product and get people to entrust [35:57] them with lots of sensitive information. [36:00] >> Totally. [36:00] >> Well, overall, I feel like the style is [36:02] very clean. It's it's very fresh. It's [36:05] very modern. Um, so from a visual [36:07] perspective, I think it looks very nice. [36:10] from a copy and you know overall [36:14] description and are you communicating [36:16] what the product does and to your users. [36:18] I'm still very confused on what it [36:20] actually does and who should use it and [36:21] why. And so I think there's a lot of [36:23] room for improvement on that. [36:25] >> Totally. And what I would encourage [36:28] all kind of founders to do something [36:29] that we did in the early days is you [36:31] should go to your users and ask them [36:33] what do you think of this website? Try [36:35] not to make it clear that it's your [36:36] website because they're going to be too [36:37] nice to you and not tell you the truth. [36:39] Um, but you know, you need users to tell [36:42] you if it's resonating with them. [36:44] >> That's the ultimate test. [36:45] >> That is absolutely the ultimate test. [36:48] We're just two people that are here [36:49] behind some cameras. You know, talk to [36:51] your users. [36:52] >> All right. And let's do another one [36:53] here. Slashy, your intelligent inbox. [36:56] Um, so first of all, their logo kind of [36:58] confused me a little bit. [laughter] [36:59] It looks like sashy [37:02] is what it makes me think of. So, I get [37:04] that it's clever and it's got a slash in [37:06] the slashy, but um if I had just seen [37:09] that without the context of like [37:10] slashy.com, I think I would have thought [37:13] this was s ashy. Um, okay. Your [37:16] intelligent inbox slashy drafts replies [37:18] in your voice, schedules meetings, and [37:20] handles follow-ups so you spend less [37:22] time managing email. Okay, cool. So, [37:24] it's like a new email product. Um, and [37:29] they've got a demo here that's pretty [37:31] big. It's cool to show a demo, but [37:33] there's so much going on. There's so [37:35] much text in the demo. It's hard for me [37:36] to mentally orient around what's [37:38] happening and what it wants me to take [37:40] away from this. [37:42] >> So, I see Pi Piper metrics before [37:44] Thursday. I see something happening in [37:46] an agent in the bottom right that it [37:48] keeps flipping over to, but it's not [37:50] slow enough where I can get my head [37:52] around what it's actually typing, what's [37:54] happening, and what the product is doing [37:56] here. [37:57] >> That's that's fair. I will say what [37:59] they're doing well is I know immediately [38:01] what it is. [38:02] >> Mhm. [38:03] >> I know that, okay, this is kind of like [38:05] superhuman. This is a Gmail replacement, [38:08] right? I actually have this problem. [38:10] Myself, my email is overloaded. [38:13] >> Um, but yeah, it's like it maybe this [38:15] would be better as just showing kind of [38:17] the chat inbox almost like an animation [38:19] versus a screen recorded video. I [38:21] [clears throat] would encourage this [38:22] founder to get an agency to do a really [38:24] cool animation that might go here and [38:26] might actually work better than kind of [38:28] this full screen video right here. [38:30] >> Yep. Um, replies drafted in seconds. [38:34] Okay. Um, and I guess it's going through [38:37] these tabs here on the side. And the [38:39] problem with these is if you scroll [38:41] through it's you will miss the other [38:43] ones. [38:44] >> Um, and these are just seem to be on a [38:46] timer. Yeah, you can see the line going [38:47] across at the bottom there. Um, which is [38:50] cool. But the problem with anytime you [38:52] have tabs is you have to expect that [38:54] people will not see anything that is [38:56] behind the other tabs. [38:58] >> Totally. You have to assume that I am [39:00] just going to see. Well, what's [39:01] interesting? Wait, let's refresh this [39:03] because I think this is always good [39:04] thing to pay attention to. Let's pretend [39:06] we spent time on intelligent inbox. [39:08] >> Mhm. [39:09] >> Is the timer going? [39:12] Yeah. Like it doesn't look like it. It [39:15] looks like it's probably actually just [39:16] starting right when I actually which I [39:18] when I scroll, which is great. But [39:19] what's interesting, sometimes I notice [39:21] on sites that the timer might start [39:23] going before the user is seeing it. And [39:25] so you don't even realize this, but [39:26] everyone is actually seeing snippets [39:28] even though you might consider it the [39:30] fourth most important thing. [39:31] >> Yeah, I think when we got down here the [39:32] first time, voice drafts was the thing [39:34] that was highlighted. Um, and maybe [39:37] because we were just kind of scrolling [39:38] back and forth and so we started the [39:40] timer without actually reading them. Um, [39:42] maybe the other thing that I'll mention [39:43] here is I can't tell again what's [39:46] happening in the screenshots. And I [39:48] think if I was like really okay, AI [39:50] drafts and what's happening and I tried [39:52] to really orient myself and pay [39:54] attention, I could try to figure it out. [39:56] But most users are not actually looking [39:58] at something for the first time and [40:00] spending that level of depth and [40:02] scrutiny on what's happening. And so it [40:04] it's cool they're showing the product. I [40:06] wonder if there's a more focused dumb [40:08] down way to actually uh communicate what [40:11] is happening with each of these rather [40:13] than showing all the um granularity and [40:16] level of detail of the actual interface. [40:20] >> Totally. [40:20] >> Okay. So, we got some social proof here. [40:22] Loved by the busiest people. We've got [40:24] an investor at Redpoint. We've got a [40:26] content creator who I I don't know. Um [40:30] so, all right. So, some people use this [40:32] and and again, they've got a security uh [40:36] link up at the top. They've got social [40:38] proof here on here's people that are [40:40] actually using this because you're [40:41] again, you're asking them to entrust you [40:43] with their your inbox and that is one of [40:46] the most sensitive areas to give uh [40:48] anybody access to. So, it's an [40:50] interesting challenge for how can you [40:52] build that trust and get people to [40:53] download and start using it. [40:54] >> Yeah. And social proof is so important, [40:56] right? That's always why typically you [40:58] see logos above the fold. I think [41:00] founders should always consider though [41:02] who they're using as social proof. Like [41:05] just as an example, I see investors and [41:08] founders and I think okay this is for [41:09] investors and founders which you know [41:11] kind of makes sense like they they are [41:13] busy people which have lots of emails [41:15] but immediately I just like even with [41:18] both investors on this side on the lefth [41:20] hand side I think oh wait a second is [41:21] this just an inbox for VCs. [41:24] >> Yeah maybe it is that they're targeting [41:25] founders and VCs I'm not sure. Um or is [41:28] it for general consumers? They say for [41:30] busy people. So maybe this is like a [41:32] proumer superhuman kind of thing and [41:35] writes in your style. Okay, this is cool [41:37] cuz you know it's showing that it's [41:38] going through and um and making edits uh [41:41] that actually match the style. Like that [41:43] view right there. [41:44] >> That's awesome. [41:45] >> This is really This is like kind of the [41:47] animation that I was talking about. [41:48] Something that you could design in Magic [41:49] Patterns by the way, but this is really [41:51] really neat where I I totally get what [41:53] it's doing here. and handle your inbox [41:56] from iMessage. Again, we got more of [41:58] these tabs. It started at the third one [42:00] down there. So, uh that was review and [42:02] approve. Um but yeah, same same as [42:07] above. [42:07] >> That's cool, too, though. It's it's [42:09] interesting to me like this is kind of [42:10] what's resonating with me, right? like, [42:11] oh my, you know, there's so many [42:13] problems with you have so many inboxes, [42:15] whether it's text messages, WhatsApp, [42:17] your Gmail, your Slack, and it's kind of [42:20] consolidating that like this is really [42:21] resonating and yeah, it would be cool if [42:23] that was maybe that should be pushed to [42:25] the top if users are appreciating that. [42:27] >> Yeah, I mean that's a problem. I have [42:28] too many inboxes and so that would have [42:31] resonated with me to the extent that I [42:33] am both a founder and a investor that [42:35] would be interested in this. One more [42:37] thing that I think is great is actually [42:38] just how long this landing page is. I [42:42] learned this from the Post Hog guys [42:43] actually. So the Post Hog folks had a [42:45] massive footer to communicate that they [42:48] were, you know, a big company, right? [42:51] And so I always encourage folks to think [42:53] about like what is kind of the meta [42:55] thing that's being communicated just by [42:57] the sheer fact that it's a really long [42:58] landing page. I think, oh, this [43:00] company's been around a while. Yeah, it [43:01] does a good job of spacing down the [43:04] page, um, calling out the main points [43:06] that it wants to hit on, trying to build [43:08] trust, and it looks very nicely, [43:11] professionally designed, um, which helps [43:13] build that trust as well, which is [43:15] really important. Um, so overall, I [43:17] think this this is really well done. [43:19] Great. Thank you, Slashy. As someone who [43:21] comes from a a front-end engineering [43:23] background, how did you get better at [43:25] design and improving your design taste? [43:27] >> So, one thing I I try to do is look at [43:28] beautiful things. Like as an example, [43:30] there's a Matis exhibit uh here in San [43:33] Francisco. Um or just kind of consuming [43:37] things that you enjoy aesthetically. A [43:40] great book to read is like the design of [43:42] everyday things. [43:43] >> And again, always considering the human [43:45] and the user. I think there's this big [43:46] misconception in Silicon Valley that [43:48] design is pixel perfect border radius [43:52] and it's not. It's thinking through the [43:54] user experience and of course having [43:56] high fidelity UI that's that's [43:58] beautiful, right? it. [43:59] >> Yeah. And how do you do that? What are [44:01] some things that you do maybe in your [44:02] daytoday as you're building magic [44:04] patterns and leading the company as well [44:07] that you do to try to put the user front [44:09] and center and and always keep that [44:11] voice of the user in your head? [44:13] >> You know, like a couple things that we [44:14] do is everyone in our company does [44:16] customer support. M [44:18] >> so every single person is in the support [44:22] inbox talking to users every single day [44:25] seeing their frustrations when they [44:26] can't find the share button because we [44:29] have two CTAs that are the exact same [44:31] color, two primary buttons, right? And [44:33] then next thing you know because the [44:35] engineers there, they're going ahead and [44:36] and fixing it because they experience [44:38] the user problem firsthand. And also [44:41] just having a very high bar, right? [44:43] where if something looks off and it just [44:46] feels off, we encourage all of our team [44:49] to go ahead and tackle that. Spend time [44:52] on the extra 20%. Don't just have the [44:56] vibecoded output and not take it to the [44:59] next level. [45:00] >> And how do you balance that? Because [45:02] obviously doing that sounds great. The [45:04] trade-offs are now it's going to take [45:05] longer to ship something. How do you [45:07] balance the speed of shipping quickly [45:09] with actually, you know, going above and [45:11] beyond and and making something that [45:13] that is is actually excellent rather [45:15] than the thing that was just okay? Yeah. [45:17] Well, you have to it's all about [45:18] tradeoffs, right? And if you don't do [45:22] that, you might have tons of users that [45:24] are on your site and then they're [45:26] leaving. They're not understanding it. [45:28] They're their workflow is blocked, [45:31] right? And so you have to have faith [45:33] that it is worth it. And for us, we have [45:37] tremendous faith that it is worth it. [45:39] That this is important to think through [45:41] and to take your time doing something. [45:44] And I think it's also like people love [45:46] saying if it's welldesigned, it must [45:48] have taken so long to ship and they're [45:50] so slow. Like in practice, not [45:53] >> not really. You can still be really [45:55] fast, especially considering how much [45:57] everything is sped up uh when it comes [45:59] to writing code. [46:00] >> Yeah, it's actually really interesting. [46:01] Those trade-offs don't have to exist [46:03] anymore. historically they had to exist. [46:06] What's next for Magic Patterns? What's [46:07] what's next on the road map for you? And [46:09] and where do you think design is going [46:10] from here? [46:11] >> Yeah, so this week we released Magic OS, [46:14] which again is our new version of our [46:15] canvas. It's like Pinterest and Figma [46:18] had a baby. Uh and you can chat with it, [46:22] prompt with it to make designs, bring in [46:24] your PRDs and your context. I think [46:26] what's next for the the future of [46:27] design? Well, one thing's for sure, it's [46:29] moving very very fast. And anyone who [46:32] thinks that they know for sure, you [46:34] know, probably is just making it up, [46:37] right? But I think one thing that's [46:38] certainly true is code as a medium is [46:42] here to stay because clearly the [46:45] frontier labs and everyone is working on [46:47] making coding agents very very good and [46:49] that is the ultimate medium for um [46:54] production and for your users. [46:56] >> Yeah, it's interesting. Um, code is just [47:00] another medium like you said and there's [47:03] lots of different mediums by which [47:04] products are created and users [47:06] experience products and this is just a [47:09] new one that has now new tools to be [47:12] able to build things that weren't [47:13] possible before and it's really exciting [47:15] to see everything get taken to a new [47:17] level and new things being possible that [47:20] almost seemed like they never would be [47:22] and so um it's awesome to have you on [47:24] and see how you guys are enabling that [47:25] with Magic Patterns and really [47:27] appreciate for joining. [47:28] >> Yeah, thanks so much. [47:29] >> Well, that does it for this episode of [47:30] Design Review and we'll see you on the [47:32] next one. [47:34] [music]