Spec your site with Gemini
Before you design or code, give the AI a clear brief. The workshop's Gemini Gem interviews you for ~10 minutes and outputs a complete spec — persona data, design brief, build brief — ready to feed into Stitch (next step) and Antigravity (step 4).
What is a Gem?
A Gem is a custom Gemini configuration with a fixed system prompt. It's persistent across sessions, shareable via a single link, and ideal for repeatable structured workflows like this interview.
Open the workshop's Gem
Your instructor has shared a Gem URL. Open it in a new tab and start a fresh chat.
The link looks like gemini.google.com/gem/<workshop-gem-id>. Sign in with the same Google account you used in step 1.
Run the interview
The Gem will ask you ~10 questions, one at a time. It covers:
- Identity — name, tagline, the role you want next
- Bio — 2–3 sentences in your voice
- Top 3–5 projects — name, what it does, tech used, link
- Skills — technical + soft
- Visual direction — dark/light, accent color, vibe (minimalist / bold / playful / corporate)
- Sections you want — hero, About, Projects, Skills, FAQ, Contact
- Hobbies / interests — for personal color
- Contact info — email, LinkedIn, GitHub
Answer in two or three sentences each. The site is a launchpad, not an autobiography.
The Gem can't read your mind. If you say "minimalist" you'll get one thing; if you say "minimalist with a single bold accent color and Inter font" you'll get a much sharper result. Same for projects — concrete > generic.
Save the output
The Gem produces three artifacts. Save them somewhere you can paste from later (a text editor, a notes app, your clipboard manager):
persona.json— structured data. Used in step 4 (Antigravity) to populate the site.- Design brief — a one-paragraph description of the visual direction. Used in step 3 (Stitch) as the design prompt.
- Build brief — a structured task list. Used in step 4 (Antigravity) as the implementation prompt.
The persona.json the Gem produces will look roughly like this:
{
"name": "Alex Schmidt",
"tagline": "IT student turning ideas into shipping software.",
"bio": "Third-year IT student in Munich focused on web platforms and applied AI.",
"skills": ["TypeScript", "Node.js", "Python", "Google Cloud", "Postgres"],
"projects": [
{
"name": "Campus Map",
"description": "An indoor wayfinding app for the university — 800+ active users.",
"tech": ["React", "Mapbox", "Cloud Run"],
"link": "https://github.com/alex/campus-map"
}
],
"interests": ["Climbing", "Live music", "Open source"],
"contact": {
"email": "alex@example.com",
"linkedin": "https://linkedin.com/in/alex",
"github": "https://github.com/alex"
}
}
Iterate if needed
If the brief feels off, run the Gem again. It's free and fast. Better to fix it here than to discover misalignment in step 4 when Antigravity is two prompts deep.
Why this step exists
Decoupling content from layout. When you spec first, you can iterate on visuals (Stitch) and code (Antigravity) without re-deciding what the site is about. The spec is the source of truth; everything downstream is presentation.
Better AI input. Antigravity does its best work when you hand it a tight spec, not a vague vibe. Same for Stitch. Ten focused minutes here saves you twenty messy minutes of "no, more like this" later.
- The Gem turns a 10-minute interview into a complete site spec.
- Save all three outputs (
persona.json, design brief, build brief) before continuing. - One spec produces all downstream artifacts — re-run if it feels off.