Image by editor
# Introduction
creating a Product Requirements Document (PRD) is a common process product management And a common work in fields such as software development and the tech industry as a whole. But the story does not end with the PRD, and the next big step is to turn it into a product, for example a working software.
This article follows on from this article, in which we transformed a set of raw, messy pieces of information into a grounded PRD, and navigated you through the same use case (a mobile-friendly app called FloraFriend) to transform this PRD into a working software prototype using Google Antigravity.
While the entire software generation process is shown to be impractical within the scope of the article, we will highlight some representative excerpts of the generated software for illustrative purposes as well as the main aspects to learn about using antigravity.
# Moving from PRD to Software Prototyping
Get ready, because the process we’re about to describe is where the magic happens. If used correctly google antigravity May act partially as Lead Engineer. this is one downloadable ide Available for multiple operating systems: You can think of it as a twist on VS Code, as instead of just typing the code, you can handle AI agents that will write it for you.
Needless to say, the first step is to download AntiGravity and install it on your machine.
The central element to become familiar with in Antigravity is, first of all, its dedication agent manager See: A place where we introduce our software requirements. After that, autonomous agents will plan, implement, and even test the built solution.
Let’s start by opening it up – of course, I highly recommend choosing “Tokyo Night”! – Theme and, in your local file explorer, create a new, empty project folder, naming it flora-friend-app. If you’re familiar with VS Code, you’ll find AntiGravity’s UI (user interface) very familiar.
Below you can see the result of opening the newly created folder named “”plant-friendly-app“, which is currently empty:
First steps with antigravity
Now comes the exciting part. Open the Agent Manager view by clicking the dedicated button on the top bar. You’ll see a beginner-friendly explanation of what agents can do in the Agent Manager:
Agent Manager Welcome Screen
We’ll send this prompt at the beginning (don’t click the ‘Send’ button yet) that asks for an implementation plan for a mobile-friendly web app:
Work as a senior full stack engineer. Please review the attached PRD for ‘FloraFriend’. Create a comprehensive implementation plan to build it as a mobile-first web app using Next.js, Tailwind CSS, and Shadcn UI. Don’t write code yet; First, strictly prepare the plan artifact.
it ready For example, there should be one with a real PRD, like you might have if you followed a previous, related article about NotebookLM for PRD generation – or one of your own for that matter. Either way, you have two main options attach prd: Either manually paste the code as part of the prompt right after the above request, or by including the PRD file (.docx, .pdf, or similar) in the project folder we created earlier – if you choose the copy-paste option, use with caution. Shift + Enter Before sending the complete signal, press the keys on your keyboard to create a few new lines and paste the PRD right after the request. Big news: The Google Gemini LLM, which fuels antigravity and its agents, has a very large reference window size; In other words, we can include a very long group of pasted-in text to make our prompt relevant in a frictionless way.
After a minute or two, you may get a response that looks like this:
Example output in AntiGravity’s Agent Manager
We can see a checklist on the right side of the Agent Manager window, listing the software project steps, like “Start Next.js app (…)For example, here, we have the option to review this list and send additional prompts via the “Review” button to amend items or add new ones, for example, by prompting:
Add “Build Component: PlantCard (with snooze logic)” and “Weekender Logic” to the backend tasks.
New or modified items will “magically” appear on the checklist.
Let’s go ahead and assume we’re happy with the plan. This is a tricky step, as finding the right button to click and proceed is not obvious, especially after multiple interactions for refinement. The key thing is to scroll up through the generated artifacts box in the chat stream and find the box labeled “Implementation Plan.” Open it and on the right, click the “Proceed” button. This is where the agents start to fully function by performing tasks like installing dependencies, creating a database schema with multiple relevant tables through a named file. schema.sqlAnd so on. An example of the code generated to perform these tasks is given below:
Generated schema.sql for our software database
The entire process is step-by-step, requiring manual review and approval on your part before proceeding to the next step, but you will slowly see how the boxes on the project planning checklist get ticked. Sometimes you will need to manually install certain dependencies into your PATH or satisfy similar requirements to let the agents continue their work. But in short, it just requires careful conversation and prompting!
For a final example, the code snippet for the final app might look like this:
// components/PlantCard.tsx
import { useState } from 'react';
import { Card, Button, Badge } from '@/components/ui';
import { WaterDropIcon, SnoozeIcon } from '@/icons';
interface PlantProps {
name: string;
species: string;
nextWatering: Date;
onSnooze: (id: string) => void;
onWater: (id: string) => void;
}
export default function PlantCard({ name, species, nextWatering, onSnooze, onWater }: PlantProps) {
const isOverdue = new Date() > nextWatering;
return (
{/* Visual Cue for Overdue Plants */}
{isOverdue && (
Thirsty!
)}
{/* The "Matt Feature" - Snooze Button */}
Next scheduled: {nextWatering.toLocaleDateString()}
);
}# wrapping up
This article shows how to take advantage of Google’s AntiGravity, one of the latest available tools in the Google AI suite, to generate software prototypes. Specifically, we describe the logic of converting PRDs into software prototypes.
ivan palomares carrascosa Is a leader, author, speaker and consultant in AI, Machine Learning, Deep Learning and LLM. He trains and guides others in using AI in the real world.
