我用 Gemini 3 一口气做了 10 个应用,附教程

我用 Gemini 3 一口气做了 10 个应用,附教程
我用 Gemini 3 一口气做了 10 个应用,附教程

我用 Gemini 3 Pro 两三个小时做了十个小应用,主要用的是Gemini 的应用和Google AI studio。
制作方式也很简单,选择 Gemini 里面的Canvas,描述并发送自己的需求。基本上两次对话就能生成一个像这样子的一个应用。
如果是在 Google AI studio 里就选择build模式也能制作。

Gemini不仅将代码的能力提升到顶级,而且谷歌平台提供的基础设施可以免费制作并发布应用。
真的财大气粗,完全不用担心token 花钱,它使用内置API,还能连接github,快速将我们想法落地,发布给用户体验。
在Google AI studio的build里就可以免费用。
下面就是10个应用的制作过程,附体验地址,可以在电脑和手机浏览器里体验,相信会激发你创作产品的灵感。
1 城市名片生成器
第一个应用是一个城市名片生成器,输入一个城市,然后它能给我这个城市做一个地图的绘制,旅游路线、城市数据和特色美食的推荐。看这个地图上面的绘制的方向,和我们现实世界的位置是相联系的。
还可以选不同的颜色,还能把这个图片下载下来,可以看到这个前端效果特别的漂亮,整个卡片也很优雅。

这个制作的应用比较好的点是,它给你内置了一个的API。我不知道它这个里面用的是下面的3还是2.5,但它这个效果真的很好。
体验地址:gemini.google.com/share
2 生日档案生成器
这是一个生日档案的生成器,输入出生日期,然后它就调用Gemini API去获取到1999年12月11日这一天发生了什么事情。
同日生日的名人,1999年这一天的大事,还有这一年的冷知识,这非常有意思,而且整个设计是用了复古的windows风格。

体验地址:gemini.google.com/share
3 AI可视化生成
这是一个将文本通过AI可视化为流程图、SVG、Html-PPT的生成器。我这里是随便搜了一个文章叫背影,它生成了一个关于这篇文章的一个逻辑路线图。样式简约美观。

体验地址:gemini.google.com/share
4 动物生命周期卡片
这个小应用只要用户输入一个动物,它能够根据这个动物描述这个动物的成长的一个周期,非常适合给小朋友教学。
比如下面这个,我输入蝴蝶,得到了这个图:

上面标题下是一个关于蝴蝶的冷知识:蝴蝶的生命周期虽短,但它们的幼虫在几周内增加到出生时的3000倍。然后下面是第一周、第四周、第八周的整个生命过程的描述。这个卡片也可以下载成PNG。
制作原理,就是让AI输出SVG的语言,可视化展示整个信息。
体验地址:gemini.google.com/share
5 配色卡片
这个应用的是配色卡片生成,比如我输一个莫奈,获取到了一个莫奈的一个主题颜色。这里面它有它推荐的睡莲池塘拂晓日出,下面有色纸。
除了这个渐变色,还有一个纯色的卡片,这个纯色的卡片也很漂亮,它还给每一个色卡起了一个名字颜色,做了一个名称解释。这个很适合在做设计的时候使用。

体验地址:gemini.google.com/share
下面几个是用谷歌AI studio生成的。谷歌AI studio的制作能力,好像比这Gemini要更强一些,它制作应用会更复杂一些。继续来看一下
6 画展
这个是一个画展的一个应用,你可以输入你自己的一个灵感,它会给你画一幅画。它的实现原理是用一个前端的svg加Gemini的一个画图的一个能力,把这两个产出的内容拼凑在了一块儿,整体的形式非常漂亮。
我输入了一个清晨迷雾,它就给我推荐了一个印象日出的一个画作,还介绍了一个画的背景,推荐了几个画一个配色。

体验地址:ai.studio/apps/drive/1D

7 电影海报
再来看一下,这个是一个电影海报的制作,比如写一个星际穿越。也是跟上一个一样,前端用了svg中间用了Gemini画图。我要求它画的是一个黑白的图,和整个的背景有一个融合的效果。
你看这个图非常符合电影的故事,下面还有一个简短的一个介绍,跨越星辰,父爱永恒拯救人类。还会写上这个上映时间导演是谁。
这些都是靠提示词设计的。约束好大模型结构化输出信息。

体验地址:ai.studio/apps/drive/1S
8 绘画思维导图
这个应用是我一直想做的,每次我绘画的时候,不知道怎么去写提示词,但是大概只有几个关键词。
我想AI可以拿我的关键词去做一个头脑风暴,以思维导图形式呈现,然后我去选择脑暴的一个关键词,最后生成一个图。
比如说我输入一个柯基,它会利用AI去获取到跟柯基相关的一些词汇,以思维导图的形式展示。
然后我去选一些关键词,每一个维度下只能选一个关键词。选择完之后,在右侧就可以点开始生成,获取到图片。

体验地址:ai.studio/apps/drive/1V
9 命理卡片
输入星座、MBTI、属相、血型,就能获取到一张命理解读的卡片,一种结合了中西方新型命理分析,非常好玩。如下:

体验地址:gemini.google.com/share
10 人物关系图谱
最后一个是人物关系图谱生成,输入任一小说电影,就可以获取到这个故事中的人物关系图谱,整个的交互由 gemini3 一气呵成,拖拽动效非常惊艳,效果如下:

体验地址:ai.studio/apps/drive/1Y

这就是我做的十个应用。整体思路我总结了一个方法论:
思考输入的场景
局限输入词汇在垂直场景,比如诗词、小说、电影等
约束模型的思考
利用提示词、MCP,将输入的词汇扩展为结构化内容,比如电影名可以扩展成,电影海报制作,再去张海报元素。
3 设计输出的容器
使用前端代码,可视化模型输出的内容,可以去搜一些图,让模型模仿这个图制作前端 svg 或 hrml,把图中内容替换成 步骤 2 的文字。
如果你感兴趣的话,我下期再来详细分享一下做这些应用的具体对话内容,我是怎么把这些应用两句对话就实现出来的。
我是空格,感谢你读到这里,有用的话,点个赞和在看支持一下。