Creating-Oneshot-Hero-Landing-Pages README

The project's README from github.com/nroadley/Creating-Oneshot-Hero-Landing-Pages. As one markdown file: README.md.

Creating Oneshot Hero Landing Pages

An Antigravity (AGY) skill to plan, design, and build video-driven parallax hero landing pages using video scrubbing.


📋 Prerequisites

  1. Antigravity (AGY) (Recommended): Works out of the box with Antigravity. Can also run in other agent environments with minor adaptations.
  2. Gemini API Key: Required for Omni video generation. Get a key at Google AI Studio.
    export GEMINI_API_KEY="your-gemini-api-key"
    

⚡ Quickstart

1. Install or Reference the Skill


2. Prompt Your Agent

Once installed, you can invoke the skill via its slash command or by asking naturally:


🛠️ How It Works

  1. Reference Images: Generates reference images using Nano Banana (gemini-3.1-flash-image).
  2. Video Generation: Calls gemini-omni-flash-preview to generate 10s 16:9 .mp4 video assets in ./assets/.
  3. Frontend Implementation: Builds a 400vh sticky video-scrubbing layout (index.html) with progress-locked typography and clean design rules (no unnecessary icons, fake tickers, or toy widgets).
  4. Local Preview: Launches a local preview server so you can test the live page immediately.

📄 Licensing & Disclaimer

This project is licensed under the MIT License.

Distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

Disclaimer: This is not an official Google product.


Built with Antigravity and Gemini 3.7 Flash.

Creating-Oneshot-Hero-Landing-Pages (nroadley/Creating-Oneshot-Hero-Landing-Pages)

web-design
Searching Database…

What is this?It's an Antigravity (AGY) agent skill that plans, designs, and builds video-driven parallax hero landing pages from a single prompt, using Gemini's video and image generation models.
Is this a standalone app or something I add to an agent?It's a skill definition made for the Antigravity agent; it can also run in other agent environments with minor adaptations, but it isn't a standalone application.
How do I install and use this skill?Install it globally or into your current workspace, or skip installation entirely by having your agent read the repo directly from the chat URL; then invoke it with its slash command or a natural-language prompt describing the page you want.
Do I need a Gemini API key?Yes, a Gemini API key is required for the Omni video generation step, obtainable from Google AI Studio.
Does generating a page cost anything beyond the skill itself?Yes, each build calls paid Gemini models (gemini-omni-flash-preview for 10s video, Nano Banana for reference images), so using it consumes your own Gemini API credits.
How does the skill actually build the landing page?It generates reference images with Nano Banana (gemini-3.1-flash-image), creates a 10-second 16:9 video with gemini-omni-flash-preview, assembles a 400vh sticky video-scrubbing index.html with progress-locked typography, then launches a local preview server.
Is this an official Google product?No, the README explicitly states it is not an official Google product, even though it uses Gemini and Nano Banana models.
What kind of design does it avoid?It enforces clean design rules by skipping unnecessary icons, fake tickers, and toy widgets so the page stays minimal and content-first.
Can I use it outside Antigravity?Yes, it can run in other agent environments with minor adaptations, though it's built and tested primarily for Antigravity.
Creator
nroadley
Size
<0.1 MB
Stars
134
Updated
CommitAug 14
Age
2mo
Commits · 90 Days