Auf dieser Seite wird beschrieben, wie Sie mit Google AI Studio schnell Apps erstellen (oder „vibe coden“) und bereitstellen, mit denen Sie die neuesten Funktionen von Gemini wie Nano Banana und die Live API testen können. Mit Google AI Studio können Sie Web-Apps mit Full-Stack-Runtimes und nativen Android-Apps mit Kotlin und Jetpack Compose erstellen – alles über Prompts in natürlicher Sprache.
Jetzt starten
Beginnen Sie mit Vibe Coding im Build-Modus von Google AI Studio. Es gibt verschiedene Möglichkeiten, mit dem Erstellen zu beginnen:
- Mit einem Prompt beginnen: Geben Sie im Build-Modus im Eingabefeld eine Beschreibung dessen ein, was Sie erstellen möchten. Wählen Sie „AI Chips“ aus, um Ihrem Prompt bestimmte Funktionen wie die Bildgenerierung oder Google Maps-Daten hinzuzufügen. Sie können sogar per Sprachausgabe sagen, was Sie möchten.
- Schaltfläche „Auf gut Glück“: Wenn Sie einen kreativen Impuls benötigen, können Sie die Schaltfläche „Auf gut Glück“ verwenden. Gemini generiert dann einen Prompt mit einer Projektidee, damit Sie loslegen können.
- Projekt aus der Galerie remixen: Öffnen Sie ein Projekt aus der App-Galerie und wählen Sie App kopieren aus.
- Projekt aus GitHub importieren: Wählen Sie im Build-Modus im Eingabefeld für Prompts im Menü Dateien hinzufügen (Symbol +) die Option Aus GitHub importieren aus, um vorhandenen Code zu importieren.
Nachdem Sie den Prompt ausgeführt haben, werden der erforderliche Code und die Dateien generiert. Rechts sehen Sie eine Live-Vorschau Ihrer App.
Was wird erstellt?
Wenn Sie Ihren Prompt ausführen, wird in AI Studio eine vollständige Anwendung erstellt. Sie können über die Plattformauswahl eine Web-App oder eine native Android-App erstellen.
Für Web-Apps (Standard) erstellt AI Studio eine Full-Stack-Umgebung, die Folgendes umfasst:
- Clientseitig: ein Web-Frontend (React ist die Standardeinstellung).
- Serverseitig: Eine Node.js-Laufzeit, die sichere API-Aufrufe, Datenbankverbindungen und die Verwendung von npm-Paketen ermöglicht.
Für Android-Apps generiert AI Studio ein Kotlin- und Jetpack Compose-Projekt, das Sie in einem browserbasierten Emulator in der Vorschau ansehen, auf einem physischen Gerät installieren und zum Testen im Play Store veröffentlichen können. Weitere Informationen zum Erstellen von Android-Apps
Sie können den generierten Code ansehen, indem Sie im Vorschaufenster auf der rechten Seite den Tab Code auswählen. Der Antigravity Agent verwaltet mehrere Dateien in Ihrem Stack intelligent und sorgt dafür, dass Änderungen richtig weitergegeben werden.
Der Antigravity-Agent
Der Antigravity-Agent ist die wichtigste KI-Funktion in Google Antigravity. Die Kernkomponenten des Agent-Harness werden jetzt für den Build-Modus in Google AI Studio verwendet. Gemini geht über die einfache Code-Generierung hinaus, indem es den Kontext Ihres gesamten Projekts beibehält, mehrere Dateien verwaltet und komplexe Anweisungen versteht, um robuste Full-Stack-Anwendungen zu erstellen.
Zu den wichtigsten Funktionen gehören:
- Kontextsensitivität: Der Kontext vorheriger Prompts und Dateistatus wird beibehalten.
- Verwaltung mehrerer Dateien: Abhängigkeiten zwischen mehreren Dateien werden berücksichtigt.
- Bestätigte Ausführung: Code-Updates werden überprüft, um Halluzinationen zu reduzieren.
Full-Stack-Funktionen
Google AI Studio bietet Ihnen die Möglichkeit, das moderne Webökosystem zu nutzen und nicht nur clientseitige Prototypen zu erstellen.
- Serverseitige Laufzeit und npm: Nutzen Sie die umfangreiche Bibliothek von npm-Paketen. Der Agent identifiziert und installiert automatisch die für Ihre App erforderlichen Pakete, z.B. bestimmte Bibliotheken für die Datenvisualisierung oder API-Clients. Sie können bei Bedarf auch bestimmte Pakete anfordern.
- Secret-Verwaltung: API-Schlüssel und Secrets sicher im Menü Einstellungen speichern. Sie sind in Ihrem serverseitigen Code verfügbar und somit vor der Offenlegung auf der Clientseite geschützt.
- Multiplayer: Entwickeln Sie Echtzeit-Zusammenarbeitsfunktionen direkt in AI Studio. Die serverseitige Laufzeitumgebung verwaltet den Status und die Verbindungen, die für die Interaktion der Nutzer erforderlich sind.
- Firebase Firestore und Authentifizierung: Firebase wird automatisch bereitgestellt und eingerichtet, einschließlich der Firestore-Datenbank (persistenter Datenspeicher) und der Firebase-Authentifizierung (Anmeldeabläufe, insbesondere „Mit Google anmelden“). Der Agent übernimmt den gesamten Einrichtungsprozess und schreibt sogar den Code in Ihrer App für diese Dienste.
- Google Workspace-Integrationen: Verbinden Sie Ihre App mit Google Workspace-APIs wie Gmail, Tabellen, Docs, Drive und Kalender. AI Studio übernimmt die gesamte OAuth-Konfiguration automatisch.
Weitere Informationen zum Entwickeln von Full-Stack-Apps
Android-Apps
Sie können auch native Android-Apps mit Kotlin und Jetpack Compose erstellen. Sie können sich eine Vorschau Ihrer App in einem browserbasierten Android-Emulator ansehen, sie über ADB im Browser auf einem physischen Gerät installieren und sie zur internen Prüfung im Play Store veröffentlichen.
Weitere Informationen zum Erstellen von Android-Apps
Noch mehr erstellen
Sobald Google AI Studio den ersten Code für Ihre Anwendung generiert hat, können Sie ihn weiter optimieren:
In Google AI Studio entwickeln
- Mit Gemini iterieren: Verwenden Sie das Chatfeld im Build-Modus, um Gemini aufzufordern, Änderungen vorzunehmen, neue Funktionen hinzuzufügen oder das Styling zu ändern.
- Code direkt bearbeiten: Öffnen Sie im Vorschaufenster den Tab „Code“, um Änderungen in Echtzeit vorzunehmen.
Extern entwickeln
Für komplexere Workflows können Sie den Code exportieren und in Ihrer bevorzugten Umgebung weiterarbeiten:
- Lokal herunterladen und entwickeln: Exportieren Sie den generierten Code als ZIP-Datei und importieren Sie ihn in Ihren Code-Editor.
- Push to GitHub (Auf GitHub übertragen): Integrieren Sie den Code in Ihre bestehenden Entwicklungs- und Bereitstellungsprozesse, indem Sie ihn in ein GitHub-Repository übertragen.
Wichtige Features
Google AI Studio bietet mehrere Funktionen, die den Entwicklungsprozess intuitiv und visuell gestalten:
- Full-Stack-Apps erstellen und iterieren: Erstellen Sie Full-Stack-Apps mit nur einem Prompt und iterieren Sie im Chat- oder Anmerkungsmodus. Im Annotationsmodus können Sie einen beliebigen Teil der Benutzeroberfläche Ihrer App hervorheben und die gewünschte Änderung beschreiben.
- App freigeben und bereitstellen: Sie können Ihre Kreationen mit anderen teilen, um zusammenzuarbeiten oder Ihre Arbeit zu präsentieren. Wenn Sie Inhalte freigeben, werden API-Aufrufe auf Ihre Nutzungslimits angerechnet. Wenn Sie kostenpflichtige Modelle verwenden, können Kosten anfallen. Wenn Ihre App fertig ist, stellen Sie sie in Cloud Run bereit.
- App-Galerie: Die App-Galerie bietet eine visuelle Bibliothek mit Projektideen. Sie können sich ansehen, was mit Gemini möglich ist, sich sofort eine Vorschau von Anwendungen ansehen und sie remixen, um sie an Ihre Bedürfnisse anzupassen.
App bereitstellen oder archivieren
Wenn Ihre Anwendung fertig ist, können Sie sie so bereitstellen:
Cloud Run: Stellen Sie Ihre Anwendung als skalierbaren Dienst bereit. Die Preise für Google Cloud Run können je nach Nutzung anfallen. Weitere Informationen zur Bereitstellung finden Sie unter Bereitstellung über Google AI Studio.
GitHub: Exportieren Sie Ihr Projekt in ein GitHub-Repository.
Beschränkungen
In diesem Abschnitt werden die aktuellen Einschränkungen des Build-Modus in Google AI Studio aufgeführt.
Verwaltung von API-Schlüsseln
Wenn Sie eine neue App erstellen, die die Gemini API verwendet, wird Ihr Gemini API-Schlüssel in AI Studio automatisch als Secret in der serverseitigen Umgebung der App konfiguriert. Sie können diesen Schlüssel im Bereich Secrets ansehen und verwalten.
- Automatische Einrichtung: Ihre
GEMINI_API_KEYwird für Sie eingerichtet. Sie müssen keine manuelle Konfiguration vornehmen, um mit der Entwicklung zu beginnen. - Nur serverseitig: API-Schlüssel werden in die serverseitige Laufzeitumgebung eingefügt und sind niemals im clientseitigen Code enthalten.
- Vorhandene Apps: Bei Apps, die vor dem 14. Mai 2026 erstellt wurden, wird die Gemini API-Integration automatisch auf den empfohlenen serverseitigen Ansatz aktualisiert, wenn Sie die Gemini-Funktionen der App das nächste Mal ändern.
Bereitstellung außerhalb von Google AI Studio
- Cloud Run: Wenn Sie aus AI Studio in Cloud Run bereitstellen, wird Ihr API-Schlüssel sicher in die serverseitige Umgebung eingebunden. Die bereitgestellte App verwendet Ihren API-Schlüssel für alle Gemini API-Aufrufe der Nutzer.
- ZIP-Download: Wenn Sie Ihre App als ZIP-Datei herunterladen, um sie an einem anderen Ort auszuführen, müssen Sie die Umgebungsvariable
GEMINI_API_KEYin Ihrer Hostingumgebung einrichten. Da die Gemini API-Aufrufe Ihrer App über serverseitigen Code erfolgen, wird der Schlüssel nicht für Endnutzer offengelegt.
Fehler beim Teilen von Apps
Wenn Sie Ihre App freigeben und Ihr Endnutzer beim Verwenden der freigegebenen URL den Fehler 403 Access Restricted erhält, kann das folgende Gründe haben:
- Browsererweiterungen: Datenschutzerweiterungen wie Privacy Badger blockieren möglicherweise die App. Deaktivieren Sie die Erweiterung, um den Fehler zu vermeiden.
- Build-Probleme: Möglicherweise gibt es Probleme mit dem aktuellen Code. Fordern Sie den Agenten auf, „alle Build-Probleme mit dem aktuellen Code zu beheben“, und teilen Sie die URL dann noch einmal.
FAQ
Was ist „In AI Studio entwickeln“?
AI Studio Build ist eine Plattform, mit der Sie mit einem einfachen Prompt eine produktionsreife, KI-basierte Anwendung mit Gemini erstellen können. Beschreiben Sie in einem Prompt, was Sie erstellen möchten, und Gemini generiert eine App für Sie. In unserer Galerie können Sie sich ansehen, was mit der Gemini API möglich ist, und Apps remixen, um sie an Ihre Bedürfnisse anzupassen.
Wie wird mein Gemini API-Schlüssel in Build verwendet?
Wenn Sie eine App erstellen, die die Gemini API verwendet, wird Ihr Gemini API-Schlüssel in AI Studio automatisch als serverseitiges Secret eingerichtet. Die Gemini API-Aufrufe Ihrer App erfolgen über serverseitigen Code mit diesem Schlüssel. Er wird also nie im Browser offengelegt. Sie können Ihren API-Schlüssel in den Einstellungen im Bereich Secrets aufrufen.
Wird mein API-Schlüssel beim Teilen von Apps offengelegt?
Nein. Ihr API-Schlüssel wird als serverseitiges Secret gespeichert und ist niemals in clientseitigem Code enthalten. Wenn Sie Ihre App freigeben, können andere Nutzer sie verwenden, aber Ihren API-Schlüssel nicht sehen.
Wenn Sie Ihre Apps mit anderen teilen, werden API-Aufrufe auf Ihre Nutzungslimits angerechnet. Wenn Sie kostenpflichtige Modelle verwenden, können Kosten anfallen. AI Studio informiert Sie während der Einrichtung und vor der Freigabe, wenn für Ihre App Kosten anfallen könnten.
Wer kann meine Apps sehen?
Ihre App ist standardmäßig privat. Sie können Ihre App für andere Nutzer freigeben, damit diese sie verwenden können. Nutzer, mit denen Sie Ihre App teilen, können den Code sehen und ihn für eigene Zwecke forken. Wenn Sie Ihre App mit Bearbeitungsberechtigung freigeben, können andere Nutzer den Code Ihrer App bearbeiten.
Kann ich Apps außerhalb von AI Studio ausführen?
Ja. Sie können Ihre App in AI Studio in Cloud Run bereitstellen. Dadurch erhält Ihre App eine öffentliche URL und Ihr API-Schlüssel wird sicher in der serverseitigen Umgebung konfiguriert. Sie können Ihre App auch als ZIP-Datei herunterladen und an anderer Stelle hosten. In diesem Fall müssen Sie die Umgebungsvariable GEMINI_API_KEY in Ihrer Hostingumgebung festlegen. Da Gemini API-Aufrufe über serverseitigen Code erfolgen, bleibt Ihr Schlüssel sicher.
Weitere Informationen zu Bereitstellungsoptionen finden Sie unter Bereitstellung über Google AI Studio.
Kann ich Apps lokal mit meinen eigenen Tools entwickeln und sie dann hier teilen?
Diese Funktion ist noch nicht verfügbar. Wir freuen uns darauf, in Zukunft weitere Anwendungsfälle für Apps zu unterstützen. Wenn Sie etwas Bestimmtes im Sinn haben, geben Sie uns bitte Feedback.
Wie kann ich eine Datenbank oder einen anderen Speicher mit meinen Apps verwenden?
AI Studio-Apps sind Standard-Apps, die in einem Cloud Run-Container ausgeführt werden. Sie können jede Speicherlösung verwenden, mit der Sie sich über ein Netzwerk verbinden können, sofern keine Firewall den Zugriff über einen dynamischen IP-Bereich verhindert.
Wir arbeiten daran, in Zukunft direkten Support für Speicher hinzuzufügen, den Sie direkt in AI Studio konfigurieren können.
Wie kann ich auf das Mikrofon, die Webcam und andere Navigator-APIs zugreifen?
Damit Zuschauer wissen, dass eine App ihre Webcam oder andere Geräte verwendet, ist eine zusätzliche Bestätigung erforderlich, bevor die App auf diese Navigator APIs zugreifen kann.
App-Entwickler können diese Berechtigungsanfragen der metadata.json-Datei ihrer App hinzufügen. Beispiel:
{
"name": "My app",
"requestFramePermissions": [
"microphone",
"camera",
"display-capture",
"geolocation",
"bluetooth",
"clipboard-read",
"serial",
"usb"
]
}
Die unterstützten Werte für requestFramePermissions sind eine Teilmenge der standardmäßigen richtlinienkonformen Funktionen.
Wie kann ich GitHub mit meinen Apps verwenden?
Mit der GitHub-Integration von AI Studio können Sie ein vorhandenes Projekt aus GitHub importieren, um mit der Entwicklung zu beginnen, oder Ihr Projekt in ein GitHub-Repository exportieren und Ihre letzten Änderungen übertragen.
Kann ich anderen Nutzern Bearbeitungszugriff auf meine App gewähren?
Dies wird noch nicht unterstützt, ist aber bald verfügbar.
Warum wurde meine App wegen eines Richtlinienverstoßes gekennzeichnet?
Wir haben Systeme, die Apps automatisch überprüfen, um sicherzustellen, dass sie unseren Richtlinien entsprechen. Wenn wir feststellen, dass eine App gegen unsere Richtlinien verstößt, wird sie aus AI Studio entfernt. Richtlinienverstöße können unter anderem folgende Gründe haben:
- Apps, die Malware, Phishing oder Identitätsdiebstahl enthalten
- Apps, in denen Inhalte präsentiert oder verbreitet werden, die gegen die Richtlinie zu Darstellungen des sexuellen Missbrauchs von Kindern verstoßen
- Apps, in denen Inhalte angezeigt oder verbreitet werden, die gegen die Richtlinie zu Belästigung verstoßen
- Apps, die Inhalte anzeigen oder verbreiten, die gegen die Richtlinie zu Hassrede verstoßen
- Apps, in denen Inhalte angezeigt oder verbreitet werden, die gegen die Richtlinie zu Menschenhandel verstoßen
- Apps, die Inhalte präsentieren oder verbreiten, die gegen die Richtlinie zu sexuell expliziten Inhalten verstoßen
- Apps, die Inhalte präsentieren oder verbreiten, die gegen die Richtlinie zu Gewalt und Gewaltdarstellungen verstoßen
- Apps, die Inhalte präsentieren oder verbreiten, die gegen die Richtlinie zu schädlichen oder gefährlichen Inhalten verstoßen
Wenn Ihre App aufgrund eines Richtlinienverstoßes gemeldet wurde und Sie der Meinung sind, dass dies fälschlicherweise geschehen ist, können Sie Einspruch einlegen. Wiederholte Verstöße gegen unsere Richtlinien können zur Kündigung Ihres Zugriffs auf AI Studio führen.
Was sind meine Pflichten als App-Entwickler?
Als Inhaber Ihrer Anwendung sind Sie für ihr Verhalten und alle Daten, die sie verarbeitet, verantwortlich. Dazu zählen:
- Einhaltung von Gesetzen und Rechten Dritter:Ihre App muss allen anwendbaren Gesetzen und Verordnungen entsprechen und darf keine Rechte anderer verletzen, einschließlich gewerblicher Schutzrechte und des Rechts auf Privatsphäre.
- Inhaltsüberwachung:Für andere von Ihrer App verwendete Dienste gelten möglicherweise zusätzliche Bedingungen. Für Firestore gelten beispielsweise die Nutzungsbedingungen für Google Cloud, die von Kunden, die Inhalte von Drittanbietern hosten, verlangen, Richtlinien zu veröffentlichen, in denen definiert wird, welche Inhalte verboten sind (z.B. illegale Inhalte), und die auf das Vorhandensein dieser illegalen Inhalte achten.
- Sichere Implementierung:Implementieren Sie die erforderlichen Sicherheitsmaßnahmen und Moderationstools, um zu verhindern, dass Ihre Anwendung missbraucht wird.
Beachten Sie die Nutzungsbeschränkungen in den Nutzungsbedingungen.
Welche Nutzungsbedingungen gelten für Apps in der App-Galerie in AI Studio?
Für die Nutzung von Apps, die in der App-Galerie in AI Studio vorgestellt werden, gelten die Zusatzbedingungen für die Gemini API, sofern nicht anders angegeben.
Nächste Schritte
- Full-Stack-Apps entwickeln (Web)
- Android-Apps entwickeln
- Beispiele finden Sie in der App-Galerie.