Plan and Build Apps with Conductor Plugin

1. Introduction

In this codelab, you will learn how to plan and build software applications with the Conductor plugin. Conductor is a Google-built, open-source plugin that enables spec-driven development features like planning and implementation tracking. You will start by building a "greenfield" application completely from scratch. Then, you will treat it as a "brownfield" project, iterating on it to add authentication and storage.

What you'll do

  • Install the Conductor plugin in the Antigravity CLI or Claude Code
  • Build a "Picker Wheel" web app from scratch using Conductor's planning and implementation capabilities
  • Add personalization to the application by adding authentication and storage using Firebase

What you'll learn

  • How to use the Conductor plugin to plan, implement, and review a "greenfield" application
  • How to use the Conductor plugin to add features to a "brownfield" application

What you'll need

2. Before you begin

Create a Google Cloud Project

  1. In the Google Cloud Console, on the project selector page, select or create a Google Cloud project.
  2. Make sure that billing is enabled for your Cloud project. Learn how to check if billing is enabled on a project.

Start Cloud Shell

Cloud Shell is a command-line environment running in Google Cloud that comes preloaded with necessary tools.

  1. Click Activate Cloud Shell at the top of the Google Cloud console.
  2. Once connected to Cloud Shell, verify your authentication:
    gcloud auth list
    
  3. Confirm your project is configured:
    gcloud config get project
    
  4. If your project is not set as expected, set it:
    export PROJECT_ID=<YOUR_PROJECT_ID>
    gcloud config set project $PROJECT_ID
    

Enable APIs

Enable the Firebase Management API in your Google Cloud project.

gcloud services enable firebase.googleapis.com

Add Firebase to your project

The Firebase CLI comes pre-installed in Cloud Shell. From Cloud Shell, sign in with the same Google Account that gives you access to the Google Cloud project. If you are working locally, install the Firebase CLI by following the instructions.

firebase login

Run the following command to add Firebase to your Google Cloud project:

firebase projects:addfirebase

If this is your first time running the firebase CLI, answer any questions that you are asked.

Exit Cloud Shell

You may close the Cloud Shell window. In the following section we'll configure your local environment.

3. Install and authenticate CLI coding agents

In this step, you will prepare your local development environment by installing and authenticating Antigravity CLI or Claude Code in your local code editor using your Google Cloud credentials.

Install and Authenticate Antigravity CLI

  1. Install the latest version of the Antigravity CLI.
    # MacOS and Linux
    curl -fsSL https://antigravity.google/cli/install.sh | bash
    
    # Windows Powershell
    irm https://antigravity.google/cli/install.ps1 | iex
    
    # Windows CMD
    curl -fsSL https://antigravity.google/cli/install.cmd -o install.cmd && install.cmd && del install.cmd
    
  2. Restart your terminal so that agy is added to your PATH.
  3. Verify the installation has installed the latest version.
    agy --version
    
  4. Authenticate using your Google Cloud credentials.
    • Start Antigravity CLI.
      agy
      
    • When asked to Select login method, select Use a Google Cloud project. Open the secure authorization URL in a web browser. Sign in with your approved credentials and complete the authentication. The browser displays a unique alphanumeric authorization code. Copy this code, return to your terminal, and paste it into the the prompt.
  5. Exit Antigravity CLI.Type /exit from the CLI terminal to end your live Antigravity CLI session before continuing.

Install and Authenticate Claude Code

Alternatively, you can use the Conductor Plugin with Claude Code. Here we will install and authenticate Claude Code using your Google Cloud credentials.

  1. Install the latest version of Claude Code.
  2. Authenticate using your Google Cloud credentials.
    • Start Claude Code.
      claude
      
    • Type /login to select your login method. Choose the option 3rd-party platform · Amazon Bedrock, Microsoft Foundry, or Vertex AI and Google Vertex AI. To set up Google Vertex AI, choose Application Default Credentials (google auth), and complete the setup as prompted.
  3. Restart Claude Code.

4. Install the Conductor Plugin

Conductor is a Google-built, open-source plugin that enables spec-driven development features like planning and implementation tracking.

Install in Antigravity CLI

  1. Install the plugin:
    • Antigravity CLI
      agy plugins install https://github.com/gemini-cli-extensions/conductor
      
  2. Verify the installation:
    • Start Antigravity CLI.
      agy
      
    • Type /conductor and you will see a list of commands like /conductor:conductor-setup, /conductor:conductor-new-track, conductor:conductor-implement, etc.
  3. Exit the CLI.Type /exit from the terminal to end your live CLI session before continuing.

Install in Claude Code

  1. Register the marketplace repository and install the Conductor plugin directly in your Claude Code session.
    /plugin marketplace add gemini-cli-extensions/conductor
    /plugin install conductor
    /reload-plugin
    
  2. Verify the installation.
    • Type /conductor and you will see a list of commands like /conductor-setup, conductor-new-track, conductor-implement, etc.
  3. Exit the CLI.Type /exit from the Claude Code terminal to end your live CLI session before continuing.

5. Greenfield Development: The Picker Wheel

Now that your environment is set up, you will build a new application from scratch. You'll create a "Picker Wheel" — a lightweight web app that spins to select a random option.

Setup Product Context

  1. Create and change to a new project directory.We now work on a project in a picker-wheel directory. Create this directory and change to it.
    mkdir picker-wheel
    cd picker-wheel
    
  2. Start Antigravity CLI.Start a new CLI session from your project directory with either Antigravity CLI or Claude Code.
    # Antigravity CLI
    agy
    
    # Claude Code
    claude
    
    • When asked "Do you trust the files in this folder?", select Trust folder (picker-wheel)
  3. Initialize Conductor.Run the setup command to scaffold the project and set up the Conductor environment.
    # Antigravity CLI
    /conductor:conductor-setup
    
    # Claude Code
    /conductor-setup
    
  4. Follow the interactive prompts.The interactive prompts you see won't match these examples exactly. Focus a simpler design to familiarize yourself with the Conductor workflow.
    • Product goal: A web application that displays a configurable spinning wheel to select a random item from a list.
      • Target Audience → General Public
      • Interaction → Tap/Click to Spin
      • Customization → Basic
      • Platform → Desktop-First
    • Product guidelines: Autogenerate.
    • Tech stack:
      • Languages → TypeScript/JavaScript - Ideal for full-stack web
      • Frontend → Vue.js - Intuitive web interfaces
      • Backend → Express.js - Fast Node backend
      • Database → None - No database needed
    • Workflow: Standard.
    • Product requirements:
      • User Stories → Customizable Options, Clear Winner Display
      • Key Features → Editable Option List, Randomized Colors
      • Constraints → Client-Side Only, High Performance
      • Non-Functional → High Test Coverage, TypeScript & Vue.js, Responsive Design
    Conductor will generate context files in a conductor/ directory.

Create a New Track

A "Track" in Conductor represents a feature or a unit of work.

  1. Start a new track using /conductor-new-rack.Conductor might propose an initial track based on the product context. Alternatively, you can propose your own or ask conductor to suggest a track.
  2. Review the generated plan.Conductor will generate an index.md, a spec.md, and a plan.md inside conductor/tracks/{track-id}/. Take a moment to read them. If everything looks good, Conductor will prompt you to save and commit the initial setup files.

Implement the Track

  1. Start implementation.
    # Antigravity CLI
    /conductor:conductor-implement
    
    # Claude Code
    /conductor-implement
    
    Conductor will now work through the plan, writing code for the project.
  2. Verify the application.Throughout the implementation phase, Conductor will prompt you to manually test the application. For example, it will ask you to open the local web server, preview the application in your browser, and verify the changes. When the implementation is complete, you should see a functional picker wheel.Picker Wheel Application
  3. Review the implementation.As a last step, you can ask Conductor to review the implementation. It should review the source code, synchronize the project documentation, and archive the track.
    # Antigravity CLI
    /conductor:conductor-review
    
    # Claude Code
    /conductor-review
    

6. Brownfield Iteration: Add Personalization

Now you will pivot to "brownfield" development. You will improve the picker wheel web application from the previous section so that signed-in users can save and restore their picker wheel configurations.

Create a Personalization Track

  1. In the following "brownfield" example, we will use Firebase for authentication and storage. Install the Firebase skills so Conductor can use it.
  2. Start your CLI agent.Start a new CLI session.
    # Antigravity CLI
    /new
    
    # Claude Code
    /new
    
  3. Start a new track.Start a new track.
    # Antigravity CLI
    /conductor:conductor-new-track "I want users to be able to log in to their
    accounts and save their picker wheel configurations."
    
    # Claude Code
    /conductor-new-track "I want users to be able to log in to their accounts
    and save their picker wheel configurations."
    
  4. Follow the interactive prompts.The interactive prompts you see will not match these examples exactly. Focus a simpler design to familiarize yourself with the Conductor workflow.
    • Track goal:
      • Auth Provider → Firebase Auth
      • Saved Configs → Wheel Options
      • Data Storage → Firestore
      • Firestore Login UI → Modal Overlay
    Conductor will generate context files for a new track inside conductor/tracks/{track-id}.
  5. Review the generated plan.Take a moment to read a index.md, a spec.md, and a plan.md inside conductor/tracks/{track-id}/.
  6. Implement.If everything looks good, you can start the implementation.
    # Antigravity CLI
    /conductor:conductor-implement
    
    # Claude Code
    /conductor-implement
    
  7. Verify.Reload your application. You should see an updated application. Picker Wheel with Sign In

Here is the golden code for a reference implementation. You must provide your Firebase project in .firebaserc and your Firebase configurations in firebase.ts to start your application properly.

7. Clean up

To avoid ongoing charges to your Google Cloud account, delete the resources created during this codelab.

Delete the Firebase Project and Google Cloud Project

The easiest way to clean up is to delete the project entirely.

  1. In the Google Cloud Console, select the project you created.
  2. Click DELETE.

Alternatively, if you want to keep the project but delete resources:

  1. Delete Firestore Database: Go to Firebase Console > Firestore and delete the database.
  2. Delete Authentication: Go to Firebase Console > AuthenticationSign-in method, disable Google.

8. Congratulations

Congratulations! You have successfully used the Conductor plugin in your choice of coding agents (Antigravity CLI or Claude Code) to build a web application from scratch and then iterate on it with complex features like authentication and database integration.

Next steps