慣性聚合 高效追讀感興趣之博客、新聞、科技資訊
閱原文 以慣性聚合開啟

推薦訂閱源

博客园 - 司徒正美
V
V2EX
T
Tailwind CSS Blog
有赞技术团队
有赞技术团队
aimingoo的专栏
aimingoo的专栏
Apple Machine Learning Research
Apple Machine Learning Research
IT之家
IT之家
Blog — PlanetScale
Blog — PlanetScale
A
About on SuperTechFans
月光博客
月光博客
T
The Blog of Author Tim Ferriss
宝玉的分享
宝玉的分享
Martin Fowler
Martin Fowler
博客园 - 聂微东
The GitHub Blog
The GitHub Blog
V
Visual Studio Blog
WordPress大学
WordPress大学
酷 壳 – CoolShell
酷 壳 – CoolShell
Engineering at Meta
Engineering at Meta
GbyAI
GbyAI

阮一峰的网络日志

科技爱好者周刊(第 396 期):互联网通信的替代方案 科技爱好者周刊(第 396 期):互联网通信的替代方案 - 阮一峰的网络日志 科技爱好者周刊(第 395 期):软件开发的第三种方式 科技爱好者周刊(第 395 期):软件开发的第三种方式 - 阮一峰的网络日志 科技爱好者周刊(第 393 期):脑腐状态 科技爱好者周刊(第 392 期):axios 投毒与好莱坞式骗术 科技爱好者周刊(第 391 期):AI 的贫富分化 科技爱好者周刊(第 390 期):没有语料,大模型就是智障 套壳中国大模型撑起500亿美元估值?扒一扒 Cursor 的"套壳"疑云 科技爱好者周刊(第 389 期):未来如何招聘程序员 科技爱好者周刊(第 388 期):测试是新的护城河 零安装的"云养虾":ArkClaw 使用指南 科技爱好者周刊(第 387 期):你是领先的 科技爱好者周刊(第 386 期):当外卖员接入 AI 字节全家桶 Seed 2.0 + TRAE 玩转 Skill 科技爱好者周刊(第 385 期):马斯克害怕中国车企吗? 智谱旗舰 GLM-5 实测:对比 Opus 4.6 和 GPT-5.3-Codex 科技爱好者周刊(第 384 期):为什么软件股下跌 科技爱好者周刊(第 383 期):你是第几级 AI 编程 Kimi 的一体化,Manus 的分层 科技爱好者周刊(第 382 期):独立软件的黄昏 AI native Workspace 也许是智能体的下一阶段 科技爱好者周刊(第 381 期):中国 AI 大模型领导者在想什么 科技爱好者周刊(第 380 期):为什么人们拥抱"不对称收益" 科技爱好者周刊(第 379 期):《硅谷钢铁侠》摘录 我如何用 AI 处理历史遗留代码:MiniMax M2.1 升级体验 科技爱好者周刊(第 378 期):预测是新的互联网热点 科技爱好者周刊(第 377 期):14万美元的贫困线 科技爱好者周刊(第 376 期):太空数据中心的争议 科技爱好者周刊(第 375 期):一扇门的 Bug 终于有人做了 Subagent,TRAE 国内版 SOLO 模式来了 科技爱好者周刊(第 374 期):6GHz 的问题 VS Code 使用国产大模型 MiniMax M2 教程 科技爱好者周刊(第 373 期):数据模型是新产品的核心 国产大模型接入 Claude Code 教程:以 Doubao-Seed-Code 为例 科技爱好者周刊(第 372 期):软件界面如何设计 大模型比拼:MiniMax M2 vs GLM 4.6 vs Claude Sonnet 4.5 科技爱好者周刊(第 371 期):一个乐观主义者的专访 科技爱好者周刊(第 370 期):正确的代码高亮 错误处理:异常好于状态码 科技爱好者周刊(第 369 期):Tim 与罗永浩的对谈 科技爱好者周刊(第 368 期):不要这样管理软件团队 一天之内,智谱和 Anthropic 都发了最强编程模型 科技爱好者周刊(第 367 期):Nano Banana 的几个妙用 科技爱好者周刊(第 366 期):旧金山疯狂的 AI 广告 科技爱好者周刊(第 365 期):流量变现正在崩塌 科技爱好者周刊(第 364 期):最难还原的魔方 科技爱好者周刊(第 363 期):最好懂的神经网络解释 科技爱好者周刊(第 362 期):GitHub 工程师谈系统设计 科技爱好者周刊(第 361 期):暗网 Tor 安全吗?
国货智造之网页匠具:豆包编程易测
阮一峰 · 2025-06-24 · via 阮一峰的网络日志

一、引言

今之世,AI 编程(AI coding)为热,然非一途,实分诸向。

其一,乃 UI 生成,尤以网页之 UI 为要。

UI 生成涉乎形貌之设,需专器。海外已多有此物,如 v0.devlovable.devbolt.new

此等器物,能依文辞之述,自设自造网页,且部署而用之。

吾久欲评骘此等 UI 生成之器,究其优劣,然唯付资开通付费版,方得全览(含最新、至强者之模型)。

二、豆包

上周,吾见字节旗下之豆包,亦上线UI 生成之能,可直造网页应用。

官家复特注"应用创作 1.0",恐汝等未察。

盖因底层豆包大模型发1.6版,代码生成之能大增。官家广宣之。,于诸试集之中,得分为国际之冠。

出于好奇,吾乃试之,略作测评。此物完全免费,且于国内用户,国产之器较之国外竞品,更易上手。

三、基本功能

点击菜单之"AI 编程"选项,即入编程之界。界面,乃一大输入之框,下有数例。

少说废话,吾直输入之:

生成一电商网站。

系统立时转入代码生成之页,左侧为AI对话之栏,右侧为不断滚动生成之网页代码(下图)。

待代码生成既毕,右侧即切换为生成之网页预览。

为便展示,予将此页共享(点击右上角之"分享"钮)。

诸君自观其效可也点此)。

吾谨言,此乃系统自生,吾未尝稍改。

吾以为,不足十字之文,能成此页,已足矣。,固已越乎吾之期矣。

此页虽似可用,然细处须改。

四、視覺編輯

修之之际,吾见豆包之编辑功能,甚为精妙,纯乎可视而为之,虽不谙代码者亦能驾驭。诸竞品似未达斯境。

豆包之可视化编辑,分为二途:一曰AI编辑,二曰手工编辑。

4.1 AI编辑

所谓AI编辑,乃于左侧AI框中直输入指令,使AI助尔编辑。

其编辑之程,如下图所示,选中标题,输入指令"优化表述,兼改为艺术字",则立时生效。

一指令可改多处,每改系统皆实时保存,无需手动存之。

4.2 手工编辑

手工编辑,即于前端亲手修改文字与图像。

先点击上方"编辑"之钮,入编辑之态。

继而,选中欲改之元素,行编辑之事。

譬如,AI所生之网页,配图往往不协,需更易之。

上图所示,物本应为一对无线耳,然AI误配以笔记本电脑之形,需更易之。

于编辑之际,择此图,下即现一编辑之框。

框内列三选。

  1. 智生之图:由AI造像。
  2. 一键索图:于系统图库中搜。
  3. 本地上传:自本地载图。

择首选"智生之图",入"无线耳"字,则得AI所造之无线耳之图。

五、文转网页

豆包此番之新,复有"文转网页"之能,吾觉甚用。

其能将之长文,经 AI 释读,自化而为网页,成

详言之,对话框下列诸功能之钮,首者即此新添之"文秒化页"。

击之,输入之框即现系统之示:

"析此内容,化而为明晰雅致之可视 HTML 网页。"

汝将长文贴于此示下,即可。譬如,汝贴研究报告,AI 即为之撮要,复以要生成网页。

更实用者,长文亦可由 AI 生成 。其法,于聊际令 AI 生长文,复转至 AI 编程,输入指令"化上述为 html 网页"。

譬如,初与人工智能语,云:"助吾制六月杭城三日两夜之游策。"

人工智能则滔滔不绝,生成长篇大论。(点而观之)。既而,转而司 AI 编程,入"助吾将前述信息化为可互行之 HTML 网页"。

网页已成。点而观之)。

得此功能,则 AI 之内容生成与网页生成,遂合而为一矣。

由是玩法,浩渺无涯。譬如,上载会晤之音,成会议纪要之网;上载文籍,成内容提要之网;使人工智能析财务之表,成折线、流程之图析之网。

六、总括

试之,吾于豆包之网页生成,颇以为善,觉其实用,成度亦高,乃一有用之器

首者,模型所生之页,较吾所想为佳,可用也。

次者,可视化编辑甚便,操作易,入门之阶低,适于初学及不谙编程之经理、设计者等。

豆包之团队,专意铸此功能,显其于AI编程之现状,有明悟:AI所生之页,尚不能一蹴而就,故须善其编辑,便於修调。

终者,较之国外之竞品,其本土化更胜。非惟中文界面与用法之示,其生成之页,明显用本土之模版,非国外设计师之风格也。

若论其弊,大约在 JS 脚本之能尚欠人满意,有若干页面之互动效果,不能一蹴而就,需与 AI 纠正再三。

要之,于前端应用之生成,豆包之AI编程,乃生产力之产品也。其美观与可用,皆甚优,复无费,众皆可自为。请试之

(终)