让AI直接生成可交互界面？这个 8K Star 的项目做到了！

我最近一直在想一个问题。

现在的AI应用，聊天能力越来越强，但界面还是死的。

你跟它说“给我画个销售漏斗图表”，它给你一段文字描述，或者一段JSON。然后你得把这段话复制给前端，前端再照着画一遍。

这不叫AI生成界面，这叫AI帮你写了个需求文档。

我一直在找一个东西：能让AI直接生成能操作、能点击、能刷新的真实界面。

后来看到了OpenUI。(thesysdev/openui)

OpenUI GitHub 项目卡片

Stars：7,734 ｜ Forks：565 ｜ License：MIT ｜ 主要语言：TypeScript ｜ 最近更新：2026-07-04

01 它到底解决了啥？

先说我自己的感受。

我之前用Claude帮我写过一个数据看板。它写代码很快，但改界面特别折腾。

“把柱状图放在表格左边”、“筛选器放在顶部”、“颜色调成蓝色系”……每一轮都要重新生成完整代码，然后刷新页面看效果。

一来一回，改一次界面要5分钟。

我当时就想：如果AI能直接在我眼前把界面搭出来，就像拖组件一样实时，那该多爽。

OpenUI就是干这个的。

它不是一个聊天界面，也不是一个API封装。它是一套让LLM直接生成可交互界面的工程框架。

OpenUI 生成与执行架构

底层有一个叫OpenUI Lang的语法。模型用这套语法描述界面，前端一边接收一边渲染，就像打字一样，一边出文字一边出界面。

你问它“给我一个销售漏斗”，它直接给你一个可以点、可以筛选的漏斗图表，而不是一段描述。

OpenUI Lang 工作流

02 我最在意的三个点

第一个，它生成的界面，是用你自己的组件。

这是我最看重的一点。

很多AI生成UI的工具，吐出来的是HTML，或者是它自己定义的一套组件。你没法控制样式，没法接业务逻辑，用起来很别扭。

OpenUI的思路是：你先把你的组件库告诉模型，模型只能在你的组件里组合。

OpenUI 响应式数据流

比如你公司有设计规范，有Button、Table、Chart、Modal这些组件。模型生成的界面，全部基于这套组件。样式统一，逻辑能接上，不违和。

OpenUI 查询流程

第二个，它不用等全部生成完才能看。

这一点体验非常好。

模型还在说话的时候，界面就开始渲染了。先出来骨架，再一点点填数据。

用过那种等完整JSON返回再渲染的，应该都懂那种“卡一下”的感觉。OpenUI是流式的，体感上快很多。

第三个，交互不绕回模型。

这招我觉得很聪明。

模型只负责生成一次界面。之后用户点按钮、切tab、填表单，这些交互由运行时直接处理，不用每点一下都去问大模型。

既省Token，响应又快。

OpenUI 格式对比

03 怎么用起来？

官方给了脚手架，一条命令就能起一个Next.js应用：

pnpx @openuidev/cli@latest create --name genui-chat-app
cd genui-chat-app
echo "OPENAI_API_KEY=sk-your-key-here" > .env
pnpm dev

跑起来之后，你就能在聊天里让AI直接生成可操作的界面了。

如果不想用脚手架，也可以只装核心包。React、Vue、Svelte都有对应的runtime，后端用@openuidev/lang-core也能跑。

组件边界设计得好，模型就拆不烂。

你给它什么组件，它就用什么组件。所以如果你有一套设计规范，开几个典型的组件给它，生成结果基本可控。

04 它适合谁？

• 你在做内部工具、数据看板、客服后台
• 你在做Copilot类产品，希望AI不只回文字，还能回可操作的卡片
• 你已经有了一套组件库，想让AI在这套组件里组合界面
• 你受够了“AI写代码、你复制粘贴、刷新页面看效果”的循环

不适合谁？

如果你只是想要一个聊天机器人，不需要界面交互，这个项目对你来说太重了。

05 最后聊两句

我说实话，OpenUI目前还不是一个“装了就能用”的产品。

OpenUI 官网预览

它更像一个基础层。你需要设计好组件库，处理好鉴权和错误边界，才能把它接到真实业务里。

但它的方向我觉得是对的。

AI应用不能一直停留在“你问我答”的阶段。

将来用户问“帮我分析一下这个数据”，AI应该直接给一张可操作的图表，而不是一段文字说明。

OpenUI在往这个方向走。

你们现在做的AI产品，界面是怎么生成的？是自己手动搭的，还是让AI生成的？

欢迎在评论区聊聊。我们下期再见！