啊？豆包居然也开始卷AI编程了？ * { margin: 0; padding: 0; outline: 0; } body { font-family: “PingFang SC”, system-ui, -apple-system, BlinkMacSystemFont, “Helvetica Neue”, “Hiragino Sans GB”, “Microsoft YaHei UI”, “Microsoft YaHei”, Arial, sans-serif; line-height: 1.6; } .__page_content__ { max-width: 667px; margin: 0 auto; padding: 20px; text-size-adjust: 100%; color: rgba(0, 0, 0, 0.9); padding-bottom: 64px; } .title { user-select: text; font-size: 22px; line-height: 1.4; margin-bottom: 14px; font-weight: 500; } .__meta__ { color: rgba(0, 0, 0, 0.3); font-size: 15px; line-height: 20px; hyphens: auto; word-break: break-word; margin-bottom: 50px; } .__meta__ .nick_name { color: 576B95; } .__meta__ .copyright { color: rgba(0, 0, 0, 0.3); background-color: rgba(0, 0, 0, 0.05); padding: 0 4px; margin: 0 10px 10px 0; } blockquote.source { padding: 10px; margin: 30px 0; border-left: 5px solid ccc; color: #333; font-style: italic; word-wrap: break-word; } blockquote.source a { cursor: pointer; text-decoration: underline; } .item_show_type_0 > section { margin-top: 0; margin-bottom: 24px; } a { color: 576B95; text-decoration: none; cursor: default; } .text_content { margin-bottom: 50px; user-select: text; font-size: 17px; white-space: pre-wrap; word-wrap: break-word; line-height: 28px; hyphens: auto; } .picture_content .picture_item { margin-bottom: 30px; } .picture_content .picture_item .picture_item_label { text-align: center; } img { max-width: 100%; } .pay_subscribe_notice { margin: 30px 0; padding: 20px; background: fffbe6; border: 1px solid ffe58f; border-radius: 8px; } .pay_subscribe_badge { display: inline-block; padding: 4px 12px; background: faad14; color: fff; border-radius: 4px; font-size: 14px; font-weight: 500; margin-bottom: 12px; } .pay_subscribe_desc { font-size: 15px; line-height: 1.8; color: rgba(0, 0, 0, 0.7); margin-bottom: 12px; } .pay_subscribe_hint { font-size: 13px; color: rgba(0, 0, 0, 0.4); } .__bottom-bar__ { display: flex; justify-content: space-between; align-items: center; position: fixed; bottom: 0; left: 0; right: 0; height: 64px; padding: 8px 20px; background: white; box-sizing: border-box; border-top: 1px solid rgba(0, 0, 0, 0.2); } .__bottom-bar__ .left { display: flex; align-items: center; font-size: 15px; white-space: nowrap; } .__bottom-bar__ .right { display: flex; } .__bottom-bar__ .sns_opr_btn { display: flex; align-items: center; user-select: none; background: transparent; border: 0; color: rgba(0, 0, 0, 0.9); font-size: 14px; } .__bottom-bar__ .sns_opr_btn:not(:last-child) { margin-right: 16px; } .__bottom-bar__ .sns_opr_btn > img { margin-right: 4px; }
啊？豆包居然也开始卷AI编程了？
原创 数字生命卡兹克 数字生命卡兹克 2025-06-24 09:03 北京
豆包疯了。
我感觉他好像真的想一统江湖了。
今天我打开豆包，本来只是想让它帮我识别几个表格图片。
结果发现他们更新了一个功能，直接推荐到我的首页来了。
这个功能我用了一下，给我整不会了，就是下面那个加上了”应用创造1.0”标识的AI编程。
我用完只有一个想法。
不是，豆包这是要疯了吗？这是不给其他家留活路了吗。。。
一直以来我对AI编程的选题都很慎重。毕竟市面上一堆AI编程工具，但是我说实话，很难让人人都上手，基本都需要开发基础，很不新手友好。
但这次真的不一样。
豆包这次更新的AI编程，这个功能的核心，就是你现在不仅可以用豆包写代码，还能直接可视化的修改网页上的结果，就像修改PPT里的内容一样轻松。
你可能不太好理解，我给你举个例子。
也不知道是《长安的荔枝》很火，还是最近到了吃荔枝的季节，我前两天去东莞参加华为的开发者大会，遇到的很多朋友，都在东莞到处问，去哪买荔枝。。。
那我们不如，就做一个荔枝的电商网站。
在豆包首页，选中AI编程应用。
发一句最简单的话，制作荔枝电商网站。
你就能看到，代码开始生成了。
而且这个代码的生成能力，我说实话有点强，大概率底座，是用了前几天火山大会上发的豆包1.6模型，比之前的代码生成的连贯性、长度都要强非常多。
而且，审美也强非常多。
大概生成了几分钟后，生成了700多行代码，一个网页，就做完了。
你可以在顶部切换代码和预览。
如果只是到这一步，那其实，豆包的代码生成，跟Claude、DeepSeek还有Gemini啥的也差不多。
但是，豆包的上面，有一个功能，叫编辑。
你点开以后，就会进入编辑模式。
他会按照页面的元素，来变成蓝色的虚线框，你可以选中那个元素，来进行修改。
这个修改，可以改字，可以改图，可以改万物，你也只需要。拿嘴说就行。
比如文字编辑是最基础的功能。
直接用鼠标点下想要修改的地方，直接就能删改，也可以让豆包帮忙换个颜色换个字体等等。
比如我觉得荔枝不该配黑体，就应该上行书，我就可以直接选中标题，然后写，换成行书字体。
没一会，直接就给你改完了。
这个修改，本质上其实还是改代码，因为你能看到，他在我Prompt上面有一行小字，编辑index.html（第106行）。
但是对于用户的体验，是完全不一样的。。。
先不说Trae、Cursor啥的，因为IDE产品，对于普通用户的上手门槛还是太高了，就说Gemini吧，在开了canvas之后，你也可以让他，生成一个网站。
但是生成万你就会发现，不仅没图，你想改字，也没办法直接可视化的改，很费劲。
当然，你要想精准的改，也行，你可以切换到代码界面。
框选那一行，然后问一问Gemini。
当然，我就问一句话，哪个普通用户知道哪段代码对应那个网页元素啊。。。
做低门槛的产品体验，还得看国内团队，真的。
豆包这个，不仅可以直接精准的改字，还能，改图。。。
真的，每次让Gemini或者DeepSeek做网页，最痛苦的事情，就配图。
比如下面这个桂味荔枝的图片，一开始豆包生成的时候配错了，我也不知道，为什么会给我放了大草莓在上面。
你进入编辑模式之后，选中这个大草莓，可以用三种方式来改图。
AI生成、网上搜索、本地上传。
我先用的是智能生图，提示词是”商品封面图，荔枝，清甜 多汁”。
很快，它就生成好了三张还不错的图片。选中图片进行替换就能替换掉错误的图片。
修改后的配图舒服多了。
如果你就是要用真实图片的话，可以用一键搜图或上传本地图片。匹配的正确率就挺高。
比如这个荔枝干，我也不知道为什么，给我放了一些…树干?
那我们就可以，直接打上荔枝干，一键搜图。
这才叫荔枝干嘛。
当然，如果你有自己图，也完全可以本地上传替换。
我不得不说，这个功能的产品完整性，还是太高了。
而且不止可以选中文字、图片，你还可以选中一个组件，进行修改。
比如我想把下面的这个表单删除。
一句话的事，这个表单，就消失了。
修改的速度也很快，真的可以说，是指哪打哪了。
而且使用对话修改的话，豆包还会自动帮你做好版本管理，随时可以查看每次的修改成果。
这才是真正意义上的零门槛。
用过像Cursor、V0之类的AI编程软件的可能都有过这样的经历。
让AI生成了一个看起来还不错的网页很容易，但如果细看，总有些细节不尽人意。
这时候如果想改个文案、换张图，或者调个样式，就得开始下一轮的极限拉扯。
而且要调用AI修改内容，都得在对话框里，费老大劲的和AI描述要修改的地方还有最终要达到的效果，它才能理解你的需求。
可以说每次我用感觉都是返璞归真，明明是在图形化的界面上，体验着命令行的感觉。
改内容还不算最麻烦的，要是想更新图片，没个一时半会搞不定，得先找个图床上传图片，拿到可以访问的图片链接，再手动替换原本的图片或让AI帮忙。
有的时候花在修改上的时间，甚至要比程序员手搓一个还要长。
这次豆包给我的感觉，就是一下子把这个门槛抹平了。
在用户体验这块，通杀。
差距太大了。
而且豆包1.6的代码质量，审美，也都够强，用户体验还好这么多，我为啥要用Gemini还要用DeepSeek啊。。。
我一直觉得，代码未来一定且必然，会成为一种被隐藏起来的基础设施，成为一种任何人都不用去关心的存在。
这种可视化的界面，才是最好的典范。
除了荔枝之外，我还想，再给我的老伙计，做一个知识图谱。
直接跟豆包说：“生成一个以坤为主题的知识图谱”
很快，一个关于坤的完整的知识图谱就出来了，虽然我也不知道，为什么豆包会这么了解坤。
就是图片好像不太对。
于是编辑大法就派上用场了，选择搜索图片，输入蔡徐坤，哦不，是鸡你太美。
系统给我推荐了几张高质量的照片，我选了一张比较适合的替换上去，对，不仅可以换静图，也可以放GIF。
瞬间，整个页面瞬间焕然一新了。
如果要发给别人，直接点右上角的分享按钮，就可以生成链接了，不需要复杂的部署操作。
而且这个分享链接，你也可以随时关闭，不用担心隐私问题。
比如我又做了一个中国历史朝代时间轴，生成出来后发现唐朝的配图是个海边的风景图，在一大坨代码里做语义配图说实话还是比较困难，所以有时候会出错。
不过直接用编辑图片，搜索”唐朝”，马上就能换成合适的图片。
再比如做个给AI图片加水印的工具，把鲜虾包做的AI图片都加上水印。
也可以用来做个外贸网页。
做小工具也很方便。我让豆包做了个听力练习助手，可以在听到生词的时候做个标记，但是第一版按钮有点小，我觉得大一点更方便。于是豆包很快就改好了第二版。
这种感觉就像是在做设计，每个元素都可以随意调整，还能很方便的调到满意的状态。
有一种，回到了几年前，我用Sketch和Figma做UI设计的感觉了。
我觉得豆包这个可视化编辑功能，可能标志着AI编程进入了一个新阶段。
过去AI编程更像是只会写代码的AI，你告诉它要什么，它给你生成代码，然后你要么接受，要么重新描述需求让它重新生成。
这个过程中，人和AI的交互是单向的、低效的。
我一直觉得。
vibe coding的重点，不是代码本身，而是你的意图。
这种可视化的功能，是让代码回归到它本来应该在的位置。
一个工具。
一个真正的好工具，是不用普通人去操心它背后的原理和细节的。
你不需要懂代码，也不需要知道前端、后端、HTML、CSS这些术语是什么意思。
你只需要告诉它：“我想要做这个东西。”
然后，它就能帮你做出来。
代码应该被隐藏在背后，普通人不应该看到它，就像我们每天用手机、用电脑、开车，完全不需要知道它们内部是怎么运行的一样。
你每天打个王者荣耀，当然也不需要知道王者荣耀背后的引擎是什么对吧。
作为一个曾经的用户体验设计师，我其实很感谢豆包。
在这个以技术至上，大家都在夺命狂奔，看打榜看参数的年代。
还有一个产品，关心普通用户的用户体验。
让每个人都能享受，AI编程的乐趣。
真好。
以上，既然看到这里了，如果觉得不错，随手点个赞、在看、转发三连吧，如果想第一时间收到推送，也可以给我个星标⭐～谢谢你看我的文章，我们，下次再见。
>/ 作者：卡兹克、dongyi
>/ 投稿或爆料，请联系邮箱：wzglyay@virxact.com
数字生命卡兹克
 阅读 赞  分享 ‘%3E %3Cg transform=‘translate(0 -2.349)‘%3E %3Cpath d=‘M0 2.349h24v24H0z’/%3E %3Cpath fill=‘%23576B95’ d=‘M16.45 7.68c-.954 0-1.94.362-2.77 1.113l-1.676 1.676-1.853-1.838a3.787 3.787 0 0 0-2.63-.971 3.785 3.785 0 0 0-2.596 1.112 3.786 3.786 0 0 0-1.113 2.687c0 .97.368 1.938 1.105 2.679l7.082 6.527 7.226-6.678a3.787 3.787 0 0 0 .962-2.618 3.785 3.785 0 0 0-1.112-2.597A3.687 3.687 0 0 0 16.45 7.68zm3.473.243a4.985 4.985 0 0 1 1.464 3.418 4.98 4.98 0 0 1-1.29 3.47l-.017.02-7.47 6.903a.9.9 0 0 1-1.22 0l-7.305-6.73-.008-.01a4.986 4.986 0 0 1-1.465-3.535c0-1.279.488-2.56 1.465-3.536A4.985 4.985 0 0 1 7.494 6.46c1.24-.029 2.49.4 3.472 1.29l.01.01L12 8.774l.851-.85.01-.01c1.046-.951 2.322-1.434 3.59-1.434 1.273 0 2.52.49 3.472 1.442z’/%3E %3C/g%3E %3C/g%3E %3C/g%3E%3C/svg%3E) 推荐 ’ fill=‘%23000’ fill-opacity=’.9’/%3E%3C/svg%3E) 留言