
对于那些想要快速开发网页小游戏、交互式动画或是教学演示的人来说,复杂的代码逻辑和多元素交互调试往往令人头疼。虽然目前的大语言模型和AI代理能够帮助编写代码并构建交互场景,但在处理复杂交互时却容易出错,而且纯文本的交互方式难以直观地调整视觉效果。
最近,来自香港浸会大学、香港科技大学、香港城市大学及深圳大学的研究团队共同开发了一款名为MoGraphGPT的创新系统。该系统结合了上下文感知模块化大模型与直观的图形化控制,使得用户能够通过简单的自然语言指令和画布涂鸦,零代码快速搭建出复杂的2D交互场景。这项研究成果已被计算机图形学与可视化领域的顶级期刊IEEE TVCG接受发表。
论文的作者包括:香港浸会大学传理学院互动媒体系助理教授叶卉,香港科技大学的肖楚烽,香港城市大学创意媒体学院的博士生冷佳业,以及深圳大学计算机与软件学院副教授徐鹏飞,通讯作者为香港科技大学艺术与机器创造力学部教授兼代理系主任傅红波。该团队长期专注于计算机图形学、人机交互及计算机视觉等领域的交叉研究。

- 论文标题:《MoGraphGPT: 利用模块化LLM和图形控制创建交互场景》
- 作者:叶卉(香港浸会大学/香港科技大学),肖楚烽(香港科技大学),冷佳业(香港城市大学),徐鹏飞(深圳大学),傅红波(香港科技大学)
- 发表期刊:IEEE Transactions on Visualization and Computer Graphics (TVCG) 2026
- LLM生成交互场景的四大难题
一、 研究背景:
使用LLM或AI助手可以轻松创建2D交互场景(如游戏、动画)或编写代码,但实践中创作者往往面临四大挑战:
1.代码质量问题:处理多个元素(如主角、敌人、障碍)的复杂交互时,LLM容易生成错误或不完整的代码。
2.难以独立编辑:LLM的线性对话结构导致修改困难。例如,仅想移动平台却可能误动原本静止的背景。
3.缺乏图形控制:仅靠文本很难准确描述空间信息。例如,让物体沿特定S型曲线运动,用文字描述非常困难且不准确。
4.精确控制复杂:生成效果后,若需微调参数,用户必须反复修改提示词,效率低下且耗时。
MoGraphGPT如何破解?

二、 核心技术:
为解决上述问题,研究团队提出了MoGraphGPT架构,包括两项突破性的核心机制:
1.上下文感知的模块化LLM
MoGraphGPT摒弃了将所有需求交给单一LLM的做法,采用了分层管理结构:
专属独立模块:场景中的每个元素(如“猴子”、“香蕉”)都有自己的LLM会话,用户可以独立调整其行为,互不影响。
- 中心统筹模块:负责协调元素之间的交互(如“猴子吃到香蕉加一分”)。各个独立模块将变量和函数精简为上下文供中心模块调用,实现互不干扰的完美协作。
- 2.无缝融合的图形控制与UI精准微调

代码生成不应仅限于文本,MoGraphGPT赋予用户强大的可视化掌控能力:
指哪打哪的图形代理:用户可以直接在画布上标点、画直线、曲线或圈出区域,然后在输入提示词时直接引用。系统会将这些手绘图形转化为精确的坐标参数。
- 自动生成的控制滑块:生成交互逻辑后,系统会自动生成滑动条,用户可精确调整移动速度或重力大小。
- 为了验证MoGraphGPT的表现,研究团队与行业领先的AI编程助手Cursor Composer进行了对比实验:

三、 效果与对比
效率显著提升:在完成相同任务时,MoGraphGPT的平均耗时比Cursor缩短了约73.8%。
- 大幅降低试错成本:所需输入的提示词数量和文本长度分别减少了68.4%和88.9%,在易用性、可控性及总体表现等主观评分上也有所提升。
- 消除致命错误:基于LLM作为评判标准及真实编译环境的测试显示,MoGraphGPT生成的代码错误率远低于基线工具。
- 开放式创作:释放无限创意

在自由创作环节中,无论是编程新手还是资深开发者,都能在10到30分钟内使用MoGraphGPT构建出各具特色的作品,涵盖双人游戏、射击游戏、教学动画、学术论文插图及网页交互等应用。
MoGraphGPT巧妙地在大语言模型代码生成与可视化无代码编辑之间架起了一座桥梁,其模块化LLM调度策略和图形化控制不仅解决了复杂场景下的代码耦合问题,也为多智能体协同生成复杂应用程序提供了新的交互范式。

四、 总结与展望
未来,团队将探索更复杂场景的交互式创作,探索代码可见性分级,并验证其在更多专业级引擎中的潜力。
想要体验零代码创造世界的乐趣吗?欢迎阅读原论文了解更多信息!
想要体验零代码创造世界的乐趣吗?欢迎阅读原论文获取更多技术细节!
