近日高德与阿里千问C端应用团队联合发布了AGenUI——这是行业首个覆盖iOS、Android、HarmonyOS三端的端云一体原生A2UI开源框架。开发者接入SDK后即可将Agent的输出直接渲染为可交互的原生卡片无需为不同平台分别写UI代码。AGenUI基于Google A2UI协议构建补全了这些描述如何在手机上跑起来的端侧原生渲染能力两者结合推动AI应用从文本式交互走向生成式UI交互。目前已正式开源访问genui.amap.com或GitHub即可参与。一、痛点Agent很聪明但界面很原始在大语言模型能力不断突破的今天Agent早已不只是简单的问答机器——它具备了规划、记忆、工具调用等复杂能力。无论是LangChain、LangGraph还是AutoGen开发者都能构建出足够聪明的智能体。但与此同时Agent与用户之间的交互方式却始终停留在最基础的聊天框模式。举个例子当你想让Agent帮你完成一个多步骤操作比如订机票传统模式下Agent只能输出一段冗长的文字请选择出发日期、选择航班、填写乘客信息……然后你得手动完成所有步骤再把结果反馈给Agent。这种低效的交互方式不仅让用户疲于应对也浪费了Agent的智能算力。问题的根源在于Agent知道要什么样的界面但没有办法直接生成并呈现给用户——它只能输出文本把搭界面这件事推给用户自己完成。这就是A2UI协议诞生的背景。二、Google A2UI协议让Agent描述界面而不是编写界面Google在去年年底提出了并开源了A2UIAgent-to-User Interface协议。这套协议定义了Agent与前端之间的通信标准让Agent能够用统一的方式描述界面需求前端则按照标准将其渲染为真实的UI组件。A2UI的核心设计哲学是声明式UI——Agent只描述不编码。传统的Agent交互中若想实现界面展示往往需要Agent生成HTML、JSX等前端代码再由前端解析执行。这种方式不仅要求Agent具备前端编码能力还会带来兼容性和安全性问题。A2UI采用了完全不同的思路Agent不再输出前端代码而是输出一套结构化的JSON数据用于描述需要什么界面组件“组件有什么属性”“组件之间的层级关系”。比如Agent想要一个姓名输入框只需要输出这样的JSONjson复制{ surfaceUpdate: { surfaceId: main, components: [ { id: name, component: { type: TextField, props: { label: 姓名 } } } ] } }这段JSON清晰地告诉前端需要在ID为main的界面上添加一个文本输入框组件标签为姓名。前端负责将这种结构化描述映射成真实的本地UI组件至于用React、Vue还是其他框架实现完全由前端决定Agent无需关心。A2UI的四大核心特性1.声明式UIAgent输出结构化JSON描述界面需求不输出可执行代码2.安全可控Agent输出的是数据而非代码前端只渲染白名单组件从根源上解决安全性问题3.跨平台渲染Agent只需描述我要一个输入框一个按钮无需关心这个输入框在不同平台的技术实现4.模型解耦不绑定特定LLM任何能够输出符合规范的JSON的模型都可以接入2026年4月Google正式推出A2UI 0.9版本搭载共享Web核心库与官方React渲染器同时完成对Flutter、Lit、Angular等主流开发框架的渲染器更新并推出支持Python环境安装的Agent SDK进一步降低了AI智能体接入与开发门槛。三、A2UI的三层架构协议层、渲染层、数据层A2UI的核心架构分为三层每一层都有清晰的分工1. 协议层Agent-to-UI Communication这是A2UI的核心定义了Agent与前端之间的通信格式和标准。Agent通过输出符合A2UI协议的JSON数据向前端传递界面描述信息这部分数据被称为surfaceUpdate界面更新。一个典型的协议层示例——餐厅搜索界面json复制{ surfaceUpdate: { surfaceId: restaurant-search, components: [ { id: search-form, component: { type: Form, children: [ {type: TextField, props: {placeholder: 搜索餐厅...}}, {type: Button, props: {text: 搜索}} ] } } ] } }三个核心字段surfaceId标识界面唯一IDcomponents是组件数组每个组件包含type组件类型、props属性、children子组件等字段。2. 渲染层Framework-Agnostic Rendering渲染层的核心职责是将协议层的结构化JSON数据映射成各个前端框架能够识别的本地UI组件。渲染层是框架无关的——无论前端使用React、Vue、Angular还是SwiftUI、Compose都可以实现A2UI的渲染逻辑平台渲染方式WebReact / Angular / LitiOSSwiftUIAndroidComposeFlutterWidget本质上渲染层就是一个翻译器将A2UI协议定义的抽象组件翻译成各个平台原生的具体组件。3. 数据层双向数据同步在实际交互中前端也需要向Agent反馈用户操作的数据比如用户输入的文本同时Agent也可能需要向前端推送动态数据比如搜索结果。数据层通过dataModelUpdate数据模型更新字段来实现双向数据同步。这意味着Agent与前端之间不仅能实现界面交互还能实现数据的实时同步为复杂交互场景表单提交、动态列表、状态更新等提供了坚实的技术支撑。四、AGenUI让A2UI在手机上真正跑起来Google的A2UI协议定义了模型如何描述界面但并没有解决这些描述如何在手机上跑起来的问题——它主要面向Web端。AGenUI正是来解决这个问题的。高德与阿里千问C端应用团队联合发布的AGenUI是行业首个覆盖iOS、Android、HarmonyOS三端的端云一体原生A2UI开源框架。它在Google A2UI协议的基础上补全了移动端的端侧原生渲染能力。AGenUI的端云一体架构•云侧通过Agent Skill生成AI原生的A2UI JSON。这一步降低了大模型的Token消耗——Agent不需要输出大段文本说明只需要输出结构化的界面描述同时降低了输出不确定性——JSON格式比自然语言的界面描述更稳定、更易于解析•端侧依托跨平台C Core统一处理协议解析、状态管理与布局计算在iOS、Android和鸿蒙三端直接渲染为原生组件从底层保证了多端体验一致这是关键的一点AGenUI不是通过JavaScript或WebView来实现跨平台而是用C核心在三个平台各自渲染原生组件。这意味着性能更高、体验更接近原生应用。Streaming-first流式架构是AGenUI的核心设计之一•“边生成边呈现”组件到达即刻挂载不需要等完整JSON生成完毕才开始渲染•最小化节点差分更新只更新变化的部分不重新渲染整个界面•独立线程异步渲染渲染操作在独立线程执行高频增量更新也不会卡主线程这三个机制结合确保了即使Agent在流式生成复杂界面时用户也能获得流畅的交互体验——不会出现等Agent说完才显示界面的尴尬。开发者资源•内置22个基础组件覆盖按钮、表单、卡片、列表等常见场景•45项CSS属性支持细粒度的样式定制•Theme系统支持Design Token模型只需输出语义描述如蓝色主色调端侧即可自动映射为符合品牌规范的具体样式官网genui.amap.comGitHubhttps://github.com/AGenUI/AGenUI五、高德千问为什么是这个组合AGenUI的诞生背后是复杂场景与AI交互的结合。高德长期深耕地图导航、本地生活等真实世界复杂服务积累了大量的多设备协同场景经验。地图应用是一个典型的复杂场景——它涉及实时数据更新、多层级界面、复杂的用户交互模式。高德在端侧工程能力上有深厚的积累包括跨平台渲染、性能优化、原生组件开发等。千问则在大规模AI应用入口、Agent交互与开发者生态上持续投入。千问的C端应用团队在AI交互探索上有丰富经验对Agent与用户之间的交互模式有深入理解。高德的端侧工程能力加上千问的AI交互探索才有了这套面向开发者的生成式UI基础设施。这个组合很合理一个懂如何把东西在手机上跑好一个懂如何让Agent和用户交互更顺畅。六、生成式UI的下一步从文本到卡片A2UI AGenUI的结合推动AI应用从文本式交互走向生成式UI交互。传统的文本式交互Agent输出文字说明用户自己理解、自己操作。Agent很聪明但用户必须翻译Agent的文字意图并转化为操作。生成式UI交互Agent直接生成并呈现可交互的界面组件用户可以直接操作、实时反馈形成真正的对话式交互。一个典型的场景对比•文本式Agent说请在下方选择您的出发城市然后选择目的地城市点击搜索按钮——用户得自己找到下拉框、自己选择•生成式UIAgent直接把城市选择器渲染出来用户直接点击选择这不只是体验的提升更是Agent能力的真正释放。当Agent不需要用文字教用户怎么操作它可以把更多算力放在真正重要的决策和执行上。目前高德与千问C端应用团队已完成了生成式UI链路的Demo验证将进一步推动其在真实应用场景中落地上线。文章来源AITOP100原文链接https://www.aitop100.cn/infomation/details/33810.html