1. What is Antigravity? What is Remotion?

Google Antigravity

Google Antigravity is a free IDE (Integrated Development Environment) by Google, designed for developers and AI users. The standout feature of Antigravity is its built-in AI agent (Gemini, Claude…) that can receive natural language prompts, plan autonomously, and write code for you. Antigravity supports Agent Skills – specialized rule sets that help the agent understand a specific domain better (e.g., video creation, UI design, testing…).

Remotion

Remotion is an open-source framework that lets you create videos using code (React + TypeScript). Instead of dragging and dropping on a timeline in traditional video editing software (Premiere, Final Cut…), you write React components to define scenes, animations, and transitions – and Remotion renders them into an MP4 file. Remotion provides the remotion-best-practices skill so that AI agents (in Antigravity or Claude Code) know how to write video code correctly.

Combining Antigravity + Remotion

When you combine these two tools, you only need to describe your video in English inside Antigravity, the agent will automatically write Remotion code, and you get a finished video – no manual video editing skills required. This is exactly the workflow demonstrated in Surya’s video “AntiGravity’s New VIDEO Editing (Remotion) Skills Are Insane”.

2. Workflow Overview

The automated video creation process consists of 4 main steps:

  1. Use Remotion as the video engine (React + TypeScript).
  2. Use Antigravity + the remotion-best-practices skill to generate video code from an English prompt.
  3. Render the video into an MP4 file.
  4. Upload to YouTube and embed it in a blog article.

3. Environment Setup

3.1. Install Required Tools

  1. Install Node.js LTS from the official website.
  2. Install Google Antigravity IDE (Windows/macOS) from https://antigravity.google.

3.2. Create a Remotion Project

Open a terminal (you can use the built-in terminal in Antigravity) and run:

npx create-video@latest

In the Remotion wizard, select:

  • Template: Blank
  • TailwindCSS: Yes
  • Install Skills: Yes (to get Remotion Skills / remotion-best-practices)

3.3. Install Dependencies and Run Dev Server

cd <your-remotion-project>
npm install
npm run dev

Open your browser at http://localhost:3000 and verify that Remotion displays the preview.

4. Connect Antigravity with Remotion Skill

4.1. Open Remotion Project in Antigravity

After running npx create-video@latest in step 3, Remotion will create a project folder (e.g., my-video). Now you need to open that folder in Antigravity:

  1. Open Google Antigravity.
  2. Go to File > Open Folder (or press Ctrl+K Ctrl+O on Windows).
  3. Browse to the Remotion project folder you just created (e.g., C:\Users\ADMIN\my-video) and click Select Folder.
  4. Antigravity will open the workspace with the Remotion project structure (you should see files like package.json, src/, remotion.config.ts…).

4.2. Verify Remotion Skill is Installed

If you selected Install Skills: Yes in step 3.2, the remotion-best-practices skill is already installed in the project. To verify:

  1. In Antigravity, open the Explorer (left sidebar), look for the .cursor/rules/ or .antigravity/skills/ folder in the project.
  2. If you see a file related to remotion-best-practices (or remotion.mdc), you’re all set.
  3. If not, you can install it manually:

4.3. Open Agent and Test Skill

  1. In Antigravity, open the Agent panel (agent icon on the left sidebar, or go to View > Agent).
  2. Send a simple test prompt: Read the Remotion best-practices skill and summarize it.
  3. If the agent returns content about Remotion rules (such as how to create compositions, how to use useCurrentFrame()…), then the skill is ready.
  4. You can now proceed to step 5 to start creating a video with a prompt.

5. Step-by-Step: Create a Video with a Prompt in Antigravity

5.1. Prepare Assets (Logo / Images)

The Remotion project already comes with a public/ folder (e.g., my-video/public/). This is where static files (images, fonts, audio…) that the video can use are stored.

  1. Open the my-video/public folder in Antigravity’s Explorer.
  2. Copy your logo or image into this folder (e.g., logo.png).
    The final path will be: my-video/public/logo.png
  3. If you want to keep things organized, you can create a subfolder assets inside public/:my-video/public/assets/logo.png But this is not required – placing files directly in public/ works fine.

5.2. Open Agent and Prepare

Note: In the prompt in step 5.3, the image path must match the file location. For example, if the file is at public/logo.png, write public/logo.png in the prompt; if it’s at public/assets/logo.png, write public/assets/logo.png.

  1. In Antigravity, open an agent in the Remotion workspace.
  2. Select the appropriate model (Gemini/Claude depending on configuration) and get ready to send a prompt.

5.3. Prompt to Create Video (Real Example)

Below is a sample prompt to create a personal introduction / portfolio video:

Read the Remotion best-practices skill and create a 15-second personal introduction video.

Profile:
- Name: Ly Tan Phat
- Role: PHP Developer
- Company: Scuti
- Avatar/Logo: public/logo.png
- Tagline: "Building scalable web solutions with PHP, Laravel & modern tech"
- Skills highlight: PHP, Laravel, MySQL, REST API, Docker, Git

Requirements:
- Scene 1 (0-5s): Cinematic dark blue background, avatar image fades in center with a subtle glow effect, name "Ly Tan Phat" appears below with a smooth typewriter animation
- Scene 2 (5-12s): Transition to role & company info - "PHP Developer @ Scuti" with company-style layout, then skills icons/badges animate in one by one (PHP, Laravel, MySQL, REST API, Docker, Git)
- Scene 3 (12-18s): Tagline text reveals with elegant motion - "Building scalable web solutions with PHP, Laravel & modern tech", subtle particle or code-rain background effect
- Scene 4 (18-20s): Call-to-action - "Let's connect!" with GitHub/LinkedIn icons, smooth fade out

Style:
- Primary background: dark navy blue (#0a1628)
- Accent color: electric blue (#3b82f6) and white text
- Font: modern sans-serif (Inter or similar)
- Smooth cinematic transitions between scenes
- Use the avatar from public/logo.png

Export: 1920x1080, 30fps composition named "PhatDevIntro"

After sending the prompt:

  • Antigravity reads the rules from the Remotion skill.
  • The agent proposes an implementation plan (which files to create, which components to build, what effects to use).
  • When you click Proceed, the agent will write the React/TypeScript Remotion code for the video.

5.4. Preview and Refine

  1. Go back to the Remotion tab (dev server running from npm run dev).
  2. Select the PhatDevIntro composition in the UI to view the preview.
  3. If you want to refine:
    • Send additional prompts in Antigravity, e.g.: Make the text appear with a typewriter effect.
    • Or: Slow down the outro and add a subtle zoom on the logo.

5.5. Render Video to MP4

Remotion allows you to render videos via CLI. From the project directory, run:

npx remotion render PhatDevIntro out/phat-dev-intro.mp4

After the command completes, you will have the file out/phat-dev-intro.mp4 – the video created from the Antigravity + Remotion workflow.

6. Step-by-Step Demo Video

The video below records the entire process of following the steps above (from setup to rendering the video):

7. Demo Result

The video below is the final output created from the Antigravity + Remotion workflow:

8. Source code (Git)

Toàn bộ source code của project Antigravity + Remotion trong bài viết này được lưu trên GitHub: https://github.com/phatltscuti/antigravity-remotion-video

9. Conclusion

By combining Google Antigravity and Remotion, you can create professional videos simply by writing a prompt – no traditional video editing skills required. This workflow is ideal for creating YouTube intros, product showcase videos, branded animations, or any type of video that can be described in words.

Summary of the process: install Remotion → install skill in Antigravity → send prompt → preview → refine → render MP4 → upload. Everything is handled by AI; you just need to describe your idea.