一个「关注」按钮背后,Qwen 3.8 Max 读懂了整个产品

阿里云创新中心> 创业资讯> 一个「关注」按钮背后,Qwen 3.8 Max 读懂了整个产品

一个「关注」按钮背后,Qwen 3.8 Max 读懂了整个产品

阿里云 2026-08-06 10:39:55 703
如果只看界面,AI 能不能把背后的整套产品也做出来?阿里云和efflora团队为此设计了一次有意思的实验:不让联网搜索,不给模型 PRD、原站代码、接口定义和数据库结构,只提供某内容社区网站的一组真实 Web UI 页面截图,让 Qwen 3.8 Max 自己理解,看看它能给出什么样的交付产物。

如果只看界面,AI 能不能把背后的整套产品也做出来?阿里云和efflora团队为此设计了一次有意思的实验:不让联网搜索,不给模型 PRD、原站代码、接口定义和数据库结构,只提供某内容社区网站的一组真实 Web UI 页面截图,让 Qwen 3.8 Max 自己理解,看看它能给出什么样的交付产物。

经过数个小时的长程任务,最终 AI 生成了一套代码,本地启动后我们先随手点进了一个问题详情页。而真正让我们意识到这次有点不一样的,是一个不起眼的蓝色「关注」按钮。

点击后,按钮变成「已关注」,关注人数随之更新。切换其他子页面或是刷新浏览器后,返回后状态没有丢。

image

这听起来很普通。问题在于:截图只告诉模型按钮长什么样,却没有说明谁关注了谁、关系怎样保存,以及不同页面如何保持一致。

如果模型只会复刻 UI,它完全可以让按钮临时变色。只要别刷新,一切都很像真的。

但 Qwen 3.8 Max 补出的,不只是点击效果。它在按钮背后建立了用户关系、前后端接口、数据写入与跨页面状态。

一个按钮,是产品把复杂机制压缩成的一个动作;Qwen 3.8 Max 做的,是把它重新解压。


01 由表及里:从一个「关注」按钮深入体验,还有什么?

「关注」只是第一条线索。

关注

意味着用户与问题之间存在一条可创建、查询和取消的关系。

评论与回复

意味着评论属于特定内容,还要记录父子层级与计数变化。

收藏

意味着用户、收藏夹与内容之间存在多对多关系。

内容发布

意味着校验、写入、话题关联,以及首页、详情页和个人主页的同步更新。

私信

意味着会话、消息、联系人、未读数和最新消息摘要共同变化。

image

页面展示的,只是这些关系在某一刻的投影。

Qwen 3.8 Max 沿着投影,反推出背后的产品结构。它面对的已经不是「怎样把网页画得更像」,而是「这个产品为什么会这样工作」。

“ Qwen 3.8 Max 的关键,不是它看见了多少页面,而是它从每一个界面细节里,读出了产品设计者没有写出来的意图。


02 Vibe Coding 真正考验的,是模型能否理解没有被说出口的需求

如今大部分用户进行 Vibe Coding 时,通常不会先写一份几十页的完整 PRD。更常见的输入,是一段描述、几张草图或一句「我想做一个类似这样的产品」。

用户真正关心的是:

我只给了你有限的信息,你能不能理解我脑子里想的那款产品,并且完整、稳定地把它做出来?

这同时考验模型的「看图说话」和「阅读理解」:前者识别布局、组件与状态,后者理解业务实体、共享关系,以及设计者没有明说的产品规则。前者决定页面像不像,后者决定产品成不成立。

UI2App 的一篇论文也验证了这一区别。研究者用 327 张截图组成 45 组多页面应用,不提供交互说明,分别衡量项目能否运行、页面是否连通、视觉是否相似,以及模型能否推断隐藏交互。

结果显示,视觉还原分最高的模型,交互推断得分只有 7.5;另一款模型视觉分略低,交互得分却达到 39.3,是前者的 5.2 倍。到了跨页面状态,六个参测模型中有三个得到 0 分。

论文中参测模型有两处集中短板:隐藏交互推断跨页面状态一致性。而这两项,恰好就是我们这次要在 Qwen 3.8 Max 身上验证的东西。

页面可以很像,却仍然只是一张不会工作的皮。

为此,我们才进行了上述这场实验:把某真实内容社区整理成 16 组任务场景、128 张页面截图,覆盖 15 类页面,并提供一份页面关系地图。除此之外,禁止模型联网搜索,没有原站源码、PRD、接口文档或数据库结构。

image

以 Qwen 3.8 Max 为规划与编码核心的 Agent,最终交付了一套 React + Express + SQLite 全栈应用:18 条前端路由、69 条 REST API,以及发布、评论、收藏、关注和私信等真实写入链路。

image

它的工作可以被一条很朴素的路径验证: image

点击有效不算完成;切换页面后状态一致、刷新后数据仍在,才开始接近一款产品。

把论文的两处短板放回 Qwen 3.8 Max 身上:交互推断上,它没有停在让按钮变色,而是补出了 69 条 REST API 与背后完整的写入链路;跨页面状态上,它没有落进那三个 0 分,关注、评论、发布与私信的结果,在切换页面和刷新之后依然一致。两者的题目与评分方式不同,分数不能直接对比,但考察的是同一种能力;而这次实验只针对一个真实内容社区,就用掉了 128 张截图、15 类页面,单个应用的复杂度远高于论文中的多页面样本。

类型检查、ESLint 与生产构建也全部通过。Qwen 3.8 Max 真正意义上做到了从视觉表象推导出完整的产品结构。


03 Qwen 3.8 Max 复刻的,不只是页面,而是四层「真实」

沿着导航进入详情页、打开私信、切换到移动端,再实际发布和刷新数据,Qwen 3.8 Max 的优势才完整显现出来。

01 视觉真实:多模态界面理解

首页、详情页和私信各自拥有清晰的信息层级;移动端也不是简单压缩桌面布局,而是重新组织导航与内容优先级。

02 结构真实:产品级推理

首页、问题、回答、文章、话题、收藏、私信和个人主页围绕同一组产品实体展开,不是彼此孤立的页面。

03 交互与数据真实:全栈工程生成

关注会更新状态与计数,评论会进入对应回答,私信会同步消息流与会话摘要;切换页面和刷新浏览器后,结果仍然存在。

04 工程交付真实:长程自主执行

React 前端、Express 后端与 SQLite 数据库组成完整闭环,页面、接口和数据关系能够保持一致,并通过类型、Lint 与生产构建检查。

image

这四层真实、也就是这四项能力叠在一起,构成了这次交付最值得关注的地方:

它不仅识别出了截图里有什么,还推断出了这些东西为什么存在、彼此如何关联,以及怎样把它们实现成一套可以持续运行的软件系统。


04 写在最后

当用户进行 Vibe Coding,真正需要的不是更多代码,而是模型能够从有限的描述、草图与界面中,恢复一个准确的真实应用产品。

「看图说话」决定它能否看到界面,「阅读理解」决定它能否读懂意图,工程架构则决定这种理解能否稳定落地。

Qwen 3.8 Max 这次最值得记住的,不是复刻了多少页面,而是它从关注、评论、收藏、发布和私信中,逐步推导出同一套产品结构,并让它真正运行起来。

截图无法展示权限、风控、审核和推荐算法等全部规则,这些仍需要人来定义与验收。但问题已经发生了变化。

过去,我们问 AI 能不能根据截图写出一个页面。

现在更值得问:它能不能理解我们没有说出口的部分,并把它完整交付出来?

Qwen 3.8 Max 在 Vibe Coding 场景下展现的核心能力是:从有限视觉输入中推断完整产品结构,并以长程自主执行将其交付为可运行的全栈应用。

文章标签: 原创 热门文章
版权声明: 创新中心创新赋能平台中,除来源为“创新中心”的文章外,其余转载文章均来自所标注的来源方,版权归原作者或来源方所有,且已获得相关授权,若作者版权声明的或文章从其它站转载而附带有原所有站的版权声明者,其版权归属以附带声明为准。其他任何单位或个人转载本网站发表及转载的文章,均需经原作者同意。如果您发现本平台中有涉嫌侵权的内容,可填写「投诉表单」进行举报,一经查实,本平台将立刻删除涉嫌侵权内容。