动态视图上线:一句话生成可交互网页
返回博客

动态视图上线:一句话生成可交互网页

新功能动态视图
SvgAnimate
SvgAnimate
2026-01-24
6 min

大家好,我是轩辕,也是SvgAnimate的作者。

今天给大家来带了全新的功能:动态视图

传统的AI大模型对话,都是基于文字聊天模式的。你问它一个问题,AI给你吭哧吭哧写一堆文字。

这种方式相信大家已经看腻了。

Google发布Gemini 3之后,同时还带来了一个新的功能:动态视图

勾选这个选项之后,这个时候再来询问Gemini问题,比如:在网络代理软件中,TUN模式和非TUN模式的区别。Gemini是这么回复我的:

它不是用简单的文字回答我,而是直接给我做了一个带交互的网页来回答我!!!

点击里面的Tab页面,可以看到Gemini3直接给我用动画的形式呈现了两种模式下网络通信的区别:

这比给我写一大段文字来的简单直接得多,一下就理解了!这个功能实在是太赞了!

但很可惜,这个功能并没有对所有人开放,很多人想用却用不了。

于是我萌生了一个想法:既然用不了,那就自己用Gemini3做一个。

现在,SvgAnimate 全新功能「动态视图」正式上线。

它让你用一句话,直接生成一个可以点击、可滚动、可交互的网页视图。

什么是动态视图?

简单说,它不是“文字回答”,而是直接给你一个页面

比如你可以这样描述:

  • “做一份上海五日游的攻略”
  • “生成一个产品数据看板,包含销售趋势、订单统计和库存告警”
  • “做一个课程报名页面,包含报名表单、课程大纲和价格对比”

动态视图会输出一份完整 HTML,包含布局、图表、交互、动效。 你可以直接预览,也可以分享、导出 HTML 到本地使用。

为什么我们要做它?

传统的 AI 对话模式,有几个天然的限制:

  1. 信息密度低:一大段文字读起来很累。
  2. 结构化弱:没有层级、没有重点、没有“视觉”逻辑。
  3. 不好复用:不能直接用于演示、汇报或产品原型。

动态视图的目标是:

把“理解”变成“可视化”,把“描述”变成“可交互”。

在 SvgAnimate 上如何使用?

很简单,在创作页面右侧选择「动态视图」标签:

然后输入你的需求描述,点击「开始生成」。

你会得到一个完整的动态页面:

  • 可滚动
  • 可交互
  • 结构清晰
  • 视觉可用

如果你不满意,还可以修改描述让AI调整细节,或者直接重新生成。

适合哪些场景?

1) 报告与看板 想做一个周报/数据看板?一句话给你出结构和可视化。

2) 教学与讲解 把一个复杂概念变成一个可交互的学习页面,学习效率会高很多。

3) 内容创作 写文章、做视频、做分享,动态视图可以直接做成“结构化脚本”。

4) 产品原型 做一个产品想法的页面 Demo,动态视图能迅速给你一个可用的雏形。

现在就试试

动态视图已经集成到 SvgAnimate 创作页面。 你可以像以前写动画一样,写一句需求描述即可。

期待看到你用它做出各种神奇的内容。

如果你在使用过程中还有疑问,随时给我留言。我会继续优化使用体验,也欢迎你把遇到的问题反馈给我。

我的X:@xuanyuanzhifeng

我的微信:xuanyuanuncle

SvgAnimate

SvgAnimate

SvgAnimate Contributor