我用google的这款新出来编程工具Antigravity做了一个网站,结果让我大吃一惊!!

我最近用Google Antigravity开发了一个Pet Gallary(宠物画廊),关键是也是Antigravity自动生成的,这里会给大家详细介绍如何使用Antigravity,以及为什么要使用它。

不知道大家注意到没,从Chatgpt在2022年诞生以来,标志着人类迎来了新一轮人工智能的浪潮,大预言模型(LLM)诞生了,从此刻开始,文生图、文生视频、图生视频等大模型都蜂拥而至。

而在Ai到来的这个风口上,谷歌这家曾经的巨头公司好像一直踏在风口上,似乎在沉默,有人甚至一度怀疑Google这样的巨头将会成为历史,但是其实说实话,我一直觉得只要google想做一件事都很容易,并不只是资金,更多的是google里面大量的人才和科学家的能力,直到gemini3 pro、nanobanana、veo3的相继出现,google总会把自己最成熟的一面展现在大众面前,会迟到,但永远不会缺席。

正如我之前写的一篇文章,google发布的将来有可能替代Canva的工具。

今天依然是介绍google的一款工具,叫 Antigravity。它是一款类似于vscode、cursor、claude code的编程工具,不知道你是否跟我一样用过google之前发布的一款gemini命令行编程工具:

那个时候,还是gemini 2.5 pro,其实那个时候我一直在期待甚至断定谷歌将会在不久也会出一款类似于cursor这样的编程工具,后来当cursor把消费从次数改编成token的时候,我越来越希望Google可以出一款编程工具的,其实也有我自己的小私心,哈哈,因为我知道google每次发布新的工具,基本上都是免费的,至少都有大量的免费额度,比如我在尽情享受nanobanana、veo3的时候,就是依赖它的300美金的免费额度测试刀现在,虽然claude code 、codex也都很强大,但是价格确实也昂贵。

所以当Antigravity出现的时候,我毫不犹豫地安装用了起来。

如果跟我一样初次使用,我看了一下官方的介绍,主要是看看这个新工具带来哪些特色和特点,用起来才会更加顺手。

先看了下最关心的价格:

实际上开发项目的过程中,我发现个人计划已经够用了,有无限制的使用次数,仅仅是对每周进行了限额,等于是免费的,直到目前为止,我还在用个人计划,也许将来会升级,谁知道呢。

然后来看下目前Antigravity支持的模型:

https://antigravity.google/docs/models

你会惊喜地发现,Antigravity居然还接入了最新的Claude Opus 4.5大模型,意味着也是可以免费用的,感觉又省了一笔开支,很幸福。

不仅如此,谷歌还内置了其他的优秀模型,比如nanobanana,当要生成 UI 模型、需要图像来填充网页或应用程序、生成系统或架构图或其他生成图像任务时,生成图像工具会使用此工具。关于这一点,下面中会有具体的测试案例介绍:

都知道nanobanana在图像生成和修改方面的能力十分厉害,所以Antigravity内置了这款工具,在这方面是天生优胜于其他工具的。

此外,官方文档还介绍了很多有趣的特性,可以辅助我们开发提速,具体信息可以参考这里:https://antigravity.google/docs/home

然后开始测试:

我们先在本地新建一个目录来存放Antigravity的生成的代码和文档,然后直接打开相应的目录

比如我现在新建了一个PetGallary目录,然后点击Open Folder 打开PetGallary目录,

然后会弹出一个安全提醒,点击信任即可,

然后可以看到Antigravity主要分为3块,最左侧是文件目录窗口,中间是编辑创作,右侧是大模型对话窗口,

现在我们可以选择大模型以及互动模式,一般情况下,我会选择Planning模式,这样每次Agent在执行前都会征求我的意见和许可才会去执行,而Fast模式会直接执行,Planning的好处在于安全,可以对大模型进行干预,这样就能减少大模型对于本地目录资源的误删误操作等问题。

然后选择大模型,可以根据你的喜好来选择,我这里选择的是谷歌原生的Gemini 3 Pro(High),

然后就可以将我们的提示词输入,就能开始给我们生成网站了,

提示词如下:

Create a modern, clean, and emotionally warm Pet Gallery website.

The gallery showcases pets as beloved family members, not just animals.
The overall feeling should be friendly, cozy, and joyful, with a touch of premium design.

Layout & Structure

Hero Section

Large welcoming headline:
“Every Pet Has a Story”

Subheading:
“A gallery filled with love, memories, and furry moments.”

Centered call-to-action button:
“Explore the Gallery”

Background image:
[IMAGE_PLACEHOLDER: hero_pet_collage]

Pet Gallery Grid

Responsive grid layout (3–4 columns on desktop, 1–2 on mobile)

Each card includes:

Pet photo
[IMAGE_PLACEHOLDER: pet_image_1]

Pet name (bold, friendly font)

Short description (1–2 lines, emotional and warm)

Hover effect: soft shadow + slight zoom

Featured Pet Section

Larger highlighted card for a special pet

Image on one side
[IMAGE_PLACEHOLDER: featured_pet_image]

Story text on the other side:
“This is Luna. She loves sunlight, slow walks, and stealing socks.”

About the Gallery

Short paragraph explaining the purpose of the gallery

Tone: heartfelt and human

Optional small illustration
[IMAGE_PLACEHOLDER: pet_illustration]

Footer

Simple footer with text:
“Made with love for pets and their humans 🐶🐱”

Visual Style

Soft pastel background colors

Rounded cards and buttons

Plenty of white space

Friendly sans-serif font

Subtle animations (fade-in, hover transitions)

Overall Goal

The site should feel like scrolling through a digital photo album full of warmth, love, and personality

可以看到Antigravity并不是一上来就为我们开始写代码,而是先制定了一个Task Plan, 将这个Project分成几个任务执行,并将每个任务细分成几个子任务,分别包含项目启动,系统设计,实现阶段,素材生成和测试阶段。

然后生成了Implementation Plan ,并且大模型主动请求我们干预,来对目前的implementation进行review,一旦review通过,我们点击Proceed按钮,大模型才会继续执行。

除此之外,这里还有一个小的特色,我们可以对task plan和implementation plan进行comment式的修改。

大模型会根据你的comment来进行调整,直到我们满意为止。

调整后,点击proceed,大模型会继续执行。

在运行过程中,果然为我们生成了好多Pet的。

过程中可能需要多次和Antigravity的交互,可以详细看到大模型的思考过程、执行过程和修改过程。

直到执行完成后,会弹出一个chrome浏览器tab页,对网站进行测试:

如果你是第一次安装,Angitgravity会弹出一个对话框提示你首先安装一个antigravity插件。

你只要点击同意就会给你自动安装成功,这个插件可以辅助你自动在浏览器中对网站进行测试,插件会对网站进行人工交互式的点击、滑动、获取元素:

页面截图等测试:

发现问题会进行反馈,然后修改:

这就是我生成后的Pet Gallary网站:

声明:来自程序员阿灏,仅代表创作者观点。链接:https://eyangzhen.com/4767.html

程序员阿灏的头像程序员阿灏

相关推荐

关注我们
关注我们
购买服务
购买服务
返回顶部