Canva 代码 2.0 评论 |用vive编码制作的“史莱姆敲击器”真的有用吗?

您不必编写一行代码,只需要求口头表达即可。编辑部居然做了个“史莱姆敲击器”,在发表前试用了一下,只用了几分钟(完整记录贴在文末)。然而,当短短几十秒内出现一个动人的游戏时,我突然就上瘾了。我们正在创造“设计”还是“软件”?


Canva 现在提供 Canva Code 2.0,让用户可以通过自然语言提示向免费、专业、商业、企业和教育用户构建网站、应用程序和交互式体验。

据 Canva 称,代码生成时间减少了 75%,提示发布时间平均减少了 30%。提供包含 50 多个新模板和超过 1.2 亿资源的库,并且还支持 HTML 导入。

Canva Code 于大约 1 年零 3 个月前首次推出,迄今为止社区已创建了超过 600 万个网站。 Canva每月有2.65亿人使用,其AI产品已被使用超过320亿次。案例研究包括 Alt Marketing School 和由 50 名书虫为世界读书日创建的教育游戏。

从: 符合您愿景的 Vibe 编码:Canva Code 2.0 现已向所有人开放

[参考视频]

【编辑部评论】

Canva 于 2026 年 7 月 14 日(美国时间)开始向所有用户提供“Canva Code 2.0”。这一公告的实质是处于一个转折点,即“氛围编码”这一新兴概念最终真正落入公众手中。

首先,“氛围编码”这个术语本身才出现了大约一年半的时间。这个术语是由 AI 研究员 Andrei Karpathy 于 2025 年 2 月在 X 上创造的,并以一篇关于“忘记代码并屈服于氛围”的半开玩笑的帖子开头。大约9个月后,它被《柯林斯英语词典》评选为“2025年度词汇”。这一选择表明了这个词受到的高度关注,并给人一种它在社会上传播的感觉。

换句话说,Canva 是该公司进入了这个词刚刚诞生的领域,每月拥有 2.65 亿人的非凡用户群。就是这样。以下是“现在”报告此公告的含义。

让我们在这里分解一些技术点。 Canva 指出,许多现有的氛围编码工具往往停留在“制作有用的东西”的阶段。您可以通过键入提示来创建应用程序或网站的原型。但试图让它看起来“个性化”意味着打开另一个设计工具,雇用开发人员,或者陷入与人工智能的无休止的互动。用 Canva 自己的话说,许多工具的输出迷失在“相似事物的海洋”中。

Canva 代码 2.0 旨在:这是“改善外表的最后一步”是。您可以通过拖放颜色、字体和图像,直接在常用的 Canva 编辑器中编辑生成的结果。这可以说是Canva独特的差异化点。虽然许多竞争对手都专注于代码生成,但 Canva 选择了一个不同的领域:“如何在生成后使其成为自己的代码生成?”这就是原因。

他们的严肃性也反映在他们的数字上。据 Canva 称,代码生成时间减少了 75%,提示发布时间中位数减少了 30%。自第一个 Canva 代码发布(2025 年 4 月在 Canva Create 2025 上公布)以来,已经过去了大约 1 年零 3 个月的时间。据 Canva 称,在此期间,社区创建了超过 600 万个网站。

Canva Code 2.0 作为几个月前(2026 年 4 月)宣布的“Canva AI 2.0”的工作流程之一提供。大约在同一时间,Canva 宣布了自己的视觉生成模型,例如 Proteus(风格转换)、Lucid Origin(图像生成)和 I2V(图像到视频),但官方尚不清楚这些模型是否负责 Canva Code 2.0 中的代码生成本身。相反,值得注意的是,Canva 在扩展其专有模型和设计资产的同时,还在构建一个混合 AI 平台,该平台结合了 OpenAI 和 Anthropic 等外部技术合作伙伴的模型。是。事实上,最初的 Canva 代码利用了 Anthropic 的 Claude 3.7 Sonnet。您可以在这里看到 Canva 战略的轮廓:将自己的资产与尖端的外部模型捆绑在一起,并在庞大的用户群上运行它们。

另一方面,也有一些方面需要冷静看待。“任何人都能够编写代码”的体验也意味着“任何人都可以在不阅读代码的情况下发布代码。”具有启发意义的是,Karpathy 本人最初谈到 Vibecoding 时表示,“对于一个一次性的周末项目来说,这还不错”。尽管它非常适合记录个人课堂页面和聚餐聚会,但在将其带入处理机密信息的工作或需要关注安全的领域时,您仍然需要小心。既然已经开放给免费用户,这种“轻松与责任之间的差距”必将成为未来更多人面临的主题。

尽管如此,我相信这场运动的总体方向是明确的。自 2013 年推出以来,Canva 已将设计从少数专家的专利变成了每个人的领域。现在正在发生的事情是,同样的事情也开始发生在“软件创建”领域。创建移动网络应用程序和交互体验(例如创建演示材料和 SNS 帖子)的障碍再次降低。

“我想了解、触摸、参与未来。”如果您有这种感觉,Canva Code 2.0 可能是最实惠的入门方式之一。

[相关文章]

Canva AI 2.0官宣——从设计工具到“完成工作的AI平台”
本文概述了包含 Canva Code 2.0 的“Canva AI 2.0”。你可以理解定位。

Canva Visual Suite 2.0 发布:添加 AI 电子表格和编码功能
Visual Suite 2.0 文章,其中公布了原始 Canva 代码。大家可以和这个“2.0”对比一下差异。

Claude Design 发布 - Anthropic 在 Claude Opus 4.7 的支持下进入设计工具市场
Anthropic 与 Canva 合作的举措。您可以阅读支持 Canva Code 的技术合作伙伴的立场。

Databricks 警告 Vibe 编码安全风险及对策
关于安全性的解释性文章,强调了本文的“轻松与责任之间的差距”的观点。


[实际使用]“打地鼠”只需要一个提示就可以吗?

即使人们说你可以在不编写任何代码的情况下创建交互式体验,但你实际上能让某些东西发挥作用吗?我想这是读者最感兴趣的部分。所以,编辑部实际上尝试了Canva Code 2.0。

我们选择的主题是“打地鼠”游戏,难度稍高一些。它不仅仅是一个静态页面,而是一个主题,需要一定的逻辑才能使其像游戏一样运行,包括时间倒计时、分数加法、点击判断以及“逐渐变快”等状态变化。

您输入的提示

我在 Canva AI 屏幕上选择了“代码”,然后在输入字段中输入了说明。 3x3的方块、30秒倒计时、分数加分、逐渐缩短出现间隔的设计、“再次”按钮、点击时的动画、流行的配色方案——这些要求只是用普通的口语而不是要点来列出。

短短几秒钟,一个可玩的游戏就出现了。

感觉从按下发送按钮到游戏显示到可以实际玩的状态大约需要几十秒的时间。等待的时间比我想象的要短,我连咖啡都没有来得及碰。

这就是结果。以蓝天和草地为背景的“打地鼠!”屏幕突然出现准备播放的状态。它具有我指定的所有元素,包括分数和剩余时间面板、显示“加速,越来越快!”的仪表以及显示“准备好了吗?”的开始屏幕。

这是最重要的功能,但我可以毫无问题地使用它。一只鼹鼠(虽然这是一个有点令人头疼的插图)从洞里探出头来,当你点击它时,你的分数就会被添加。我要求的一切都已实现:30 秒倒计时、时间用完时显示最终分数、“重试”按钮,以及进度越快就会出现的难度级别。在指令的重现性方面,它超出了我的预期。

令人失望的是“外观”和“声音”

另一方面,有一些观点确实让我印象深刻。首先,很难说设计很复杂。它会动,但配色方案和纹理仍然有手工制作的感觉。尽管反映了“流行且明亮的配色方案”的说明,但在公共场合展示它需要一些勇气。

另一件事是没有声音效果。光是敲打地鼠的声音就应该彻底改变体验的满意度,但这并没有产生。动作本身很流畅,我没有注意到任何卡顿,所以我对缺乏声音感到失望。

“以自己的方式完成”一开始就跌跌撞撞

在这里,我决定尝试一下本文的核心:“使用 Canva 编辑器以您自己的方式编辑生成的工件。”如果您可以采用笨重的设计并通过更改颜色或材质来更改它,那就是 Canva Code 2.0 的真正价值。

但是,我无法立即弄清楚如何从生成的产品访问编辑屏幕。屏幕顶部有“用于设计”和“发布”等按钮,但乍一看,可能会很困惑要按哪个按钮来编辑颜色和插图,就像在常规 Canva 编辑器中一样。这可能是不习惯使用 Canva 的人容易犯错的一点。

【修改版】重复对话,更接近“你的游戏”

我对是否在编辑屏幕上进行更改犹豫不决,但 Canva Code 2.0 提供了另一种方法。这是一种随着聊天不断重塑的方法。关键是通过对话只传达你想要改变的点,而不是从头开始重新发明轮子。

“这是一个 8 位像素艺术,你击中的人是一个史莱姆。”

我将其输入到输入字段中。整个东西被做成了8位像素艺术风格(复古RPG风格),被击中的目标从鼹鼠变成了史莱姆,音效被做成了击中时发出“吱吱”的声音。最后,他补充道,“分数和剩余时间等规则将保持不变。”这是为了防止操作部件被重建和损坏。

这是结果。背景已更改为排列着砖房的像素化 RPG 场地,标题已更改为“Slime Whack!”。绿色的史莱姆也用像素艺术巧妙地绘制,甚至得分和剩余时间面板也被更改为类似于复古游戏UI。虽然我没有要求,但它甚至添加了类似 RPG 的短语,例如“你准备好冒险了吗?”和“开始冒险”,可以看出AI已经理解了世界观。

另外,版本1中没有实现的音效,这次“punyu”的声音清晰可闻。屏幕右上角甚至还有一个“Oto:ON”开关。这意味着,外观和声音这两个上次令人失望的点,仅仅通过一条指令就一下子解决了。

对话中也可以理解“小一点”。

为了结束这件事,我们又进行了一次谈话。屏幕看起来有点大,所以我只是输入“请让屏幕小一点”,一个紧凑的版本 3 就创建了。只需通过口头请求即可进行布局调整,无需接触任何数字或 CSS。我觉得这部分对于会写代码的人和不会写代码的人来说都是有效的。

从版本 1 到版本 3,只需与聊天室交谈几次即可。只需按照提示来回操作即可完成将“正在发生的事情”朝着“您所设想的事情”移动的工作。我一开始提到的那些不尽如人意的设计,通过这次改造的过程几乎完全解决了。仅根据生成后的结果来判断还为时过早;相反,真正的工作是在反复对话之后开始的。

【发布版本】我只用了10多分钟就发布到了全世界。

最后,我向公众发布了完成的游戏。点击“发布”按钮后,您将获得一个免费域名地址,只需单击几下即可从世界任何地方访问该地址。在发布之前,可以微调标题和图标设置、打开/关闭“在搜索结果中显示(例如 Google)”甚至密码保护等设置。

这是实际发布的内容。

https://mogurara.my.canva.site/(Slime whacker 实际发布)

从您开始输入提示到在互联网上发布可玩的游戏,您没有编写任何代码。大约 10 分钟内即可轻松完成此操作,这是前所未有的体验。

然而,我在这里也注意到了一件事。发布页面的标题是“Whack-a-Mole”,URL 是“mogurara”。内容本应在第 3 版中改为“Slime Whacker”,但仅沿用了发布时的名称。即使你通过对话多次更新游戏,公共设置的标题和地址也不会自动跟随。我应该在向全世界发布之前手动审查这部分内容。在易用性的背后,有一个小陷阱,直到您真正发布它时您才会注意到。

[总结]尝试后的收获

只需要几十秒,一个有状态的游戏就可以一口气跑完。这种易用性无疑超出了传统设计工具的界限。刚生成后,设计缺乏,通往编辑屏幕的路径对于初学者来说有点不友好。然而,通过简单地讨论使其成为 8 位风格、使其变得粘液、使其变得更小,这种距离比我预期的更快地缩小了。

将“移动的东西”变成“你的设想”的过程只需口头语言即可完成,无需编写任何代码。尽管存在一些小陷阱,例如发布时标题的继承,但将想法变为现实与将其推向世界之间的距离无疑变得更短了。对于那些想要“触摸”未来的人来说,这似乎是一个负担得起的切入点。

【术语解释】

HTML 导入
该功能允许您将使用其他工具或 AI 助手创建的 HTML 导入 Canva 并继续创建可编辑的设计。目的是消除从头开始重建的麻烦。

Proteus/Lucid Origin/I2V
它是 Canva 内部开发的一组视觉生成 AI 模型的名称,在 2026 年 4 月宣布的“Canva AI 2.0”中引入。Proteus 负责风格转换,Lucid Origin 负责图像生成,I2V 负责“图像到视频”生成。两者都是用于视觉生成,是否用作Canva Code 2.0的代码生成模型,官方并未透露。

画布创建
Canva 的年度产品发布会。第一个 Canva 代码于 2025 年 4 月 10 日在“Canva Create 2025”上公布。

单点登录 (SSO)
一个允许您通过单一身份验证登录多个服务和系统的系统。在组织内安全地共享工件时使用。

[参考链接]

Canva Code / AI 代码生成器(官方产品页面)(外部)
Canva 官方页面,介绍了提示生成、编辑元素、与 Canva Sheets 的数据集成等。

坎瓦(官方网站)(外部)
一个在世界各地广泛使用的在线设计平台,允许任何人通过拖放来创建设计。

Alt Marketing School(公式サイト)(外部)
Canva 介绍的一家小企业为例。负责营销教育工作。

如何使用 Canva 代码(Canva 帮助中心)(外部)
官方指南,解释使用 Canva 代码创建和发布交互式设计的步骤。

[参考文章]

Canva推出Code 2.0,为每个用户提供AI建站服务(VentureBeat)(外部)
我们将报道47亿美元的市场规模,竞争对手Lovable、Replit、Bolt.new的动向,以及向所有用户开放的意义。

Canva Code 2.0 增加了可视化编辑、HTML 导入和实时协作(9to5Mac)(外部)
文章介绍了 2026 年 7 月 14 日面向所有用户的发布,以及可视化编辑、HTML 导入和协作编辑等关键功能。

有一种新的编码方式我称之为“vibe编码”(Andrej Karpathy/X)(外部)
最初由 Kalpathy 本人于 2025 年 2 月 2 日发表,当时创造了“vibe 编码”一词。

Canva 代码释放:以前所未有的方式构建交互式应用程序(DesignMonks)(外部)
一篇文章讲述了如何在 2025 年 4 月 10 日的“Canva Create 2025”上宣布第一个 Canva 代码的故事。

通过我们迄今为止最大规模的人工智能发布来设计、编码和创造(Canva公式)(外部)
Canva 最初宣布,最初的 Canva 代码是使用 Anthropic 的 Claude 3.7 Sonnet 构建的。

克劳德3.7十四行诗和克劳德代码(人择)(外部)
Anthropic官方宣布介绍Claude的编码能力。它还提到使用 Canva 进行质量评估。

Canva AI Product Terms(Canva公式规约)(外部)
管理输出所有权、责任划分和第三方技术使用的条款。 2026 年 6 月 26 日生效。