ai newsDo., 15. Okt.
EilmeldungMeta and Apple team up to make Muse AI models run better on Macs

Mit Google Playground in 30 Minuten ein KI-Spiel bauen und monetarisieren

Nach der Ankündigung von Google Playground startete die Tech-Community durch und baute im Handumdrehen eigene Spiele. Das Versprechen: In wenigen Minuten mit KI ein Spiel erstellen und Geld damit verdienen.

dev.toFreitag 17:00 · 09.10.DE4 Min. Lesezeit
Bild: dev.to

In dem Moment, in dem Google diesen Sommer Google Playground ankündigte, hörte die Tech-Community auf zu scrollen und fing an zu bauen. Innerhalb weniger Stunden war der Satz „Baue in Minuten ein Spiel“ auf Twitter im Trend, verbreitete sich in Reddit-Threads und brachte Dutzende TikTok-Demos hervor, die zeigten, wie ein Elternteil, ein Student und ein Hobbyentwickler spielbare Titel veröffentlichten, ohne eine einzige Zeile Code zu schreiben.

Warum ist das wichtig? Der globale Gaming-Markt wird bis 2027 voraussichtlich die Marke von 250 Milliarden Dollar überschreiten, doch das Angebot an qualifizierten Entwicklern kann mit der Nachfrage nicht Schritt halten. Gleichzeitig hungert die Creator-Economy nach Low-Code-Tools, die Ideen schnell in Einnahmequellen verwandeln. Google Playground liegt genau an der Schnittstelle dieser Trends: eine KI-gestützte Drag-and-Drop-Umgebung, die Skripte schreibt, Grafiken generiert und sogar Monetarisierungsstrategien in Echtzeit vorschlägt.

In diesem praktischen Leitfaden räumen wir mit dem Hype auf, gehen die Kernfunktionen durch, zeigen Praxisbeispiele (einschließlich Code-Snippets zum Kopieren und Einfügen) und geben dir einen Schritt-für-Schritt-Aktionsplan, um in weniger als einer Stunde ein monetarisiertes Spiel zu veröffentlichen.

Gesamt: etwa 11 Minuten bis zum spielbaren, monetarisierten Prototyp.

js<br>const config = { type: Phaser.AUTO, width: 800, height: 600, physics: { default: 'arcade' }, scene: { preload, create, update } };<br>function preload(){ this.load.image('player','assets/player.png'); this.load.image('spike','assets/spike.png'); this.load.image('coin','assets/coin.png'); }<br>function create(){ this.player = this.physics.add.sprite(100,450,'player'); this.spikes = this.physics.add.group({ key:'spike', repeat:5, setXY:{ x:200, y:0, stepX:120 } }); this.coins = this.physics.add.group({ key:'coin', repeat:10, setXY:{ x:150, y:300, stepX:70 } }); }<br>function update(){ // einfache Links/Rechts-Bewegung … }<br> | | Diffusionsbasierter Asset-Creator | Erzeugt PNG- und SVG-Assets on the fly; Stil (Pixel-Art, Flat, handgezeichnet) und Auflösung lassen sich festlegen. | Prompt: „Pixel-Art-Sprite-Sheet für einen blauen Roboter mit 4 Laufbildern.“ → 64 × 64 PNG-Sheet, bereit zum Einfügen in das Projekt. | | Visuelle Drag-and-Drop-Oberfläche | Nodes repräsentieren Spielobjekte, Events und Monetarisierungsblöcke; das Verbinden erzeugt automatisch das zugrunde liegende Skript. | Ziehe einen Score-Node auf die Canvas und verbinde ihn mit dem CoinCollected-Event-Node – die KI fügt im Hintergrund score += 10; hinzu. | | Eingebaute Physik und Kollision | Vorkonfigurierte Arcade-Physik; Gravitation, Abprallverhalten und Reibung lassen sich per Schieberegler anpassen, ganz ohne Code. | Schieberegler: Gravity Y = 800 → Sprünge fühlen sich sofort schwerer an. | | Monetarisierungs-Plug-ins | AdMob, Google Play Billing oder Stripe für Abos lassen sich mit einem Klick aktivieren. | „Rewarded Video“ einschalten → die KI fügt ad.showRewardedVideo(onReward); hinzu, und ein UI-Button erscheint automatisch. |

Im Folgenden findest du ein konkretes, vollständiges Beispiel, dem du in deinem eigenen Playground-Konto folgen kannst.

„Erstelle einen Idle-Clicker, bei dem der Spieler auf einen Mining-Laser tippt, um Erz zu sammeln, Upgrades die Menge an Erz pro Klick erhöhen und ein Sternenfeld im Hintergrund langsam scrollt.“

// ==== script.js ==== let ore = 0; let orePerClick = 1; let upgradeCost = 50; function preload () { this. load. image ( ' laser ', ' assets/laser.png ' ); this. load. image ( ' star ', ' assets/starfield.png ' ); } function create () { // Hintergrund-Scrolling this. add. tileSprite ( 400, 300, 800, 600, ' star ' ). setScrollFactor ( 0 ); // klickbarer Laser const laser = this. add. image ( 400, 300, ' laser ' ). setInteractive (). on ( ' pointerdown ', () => { ore += orePerClick; oreText. setText ( `Ore: ${ ore } ` ); }); // UI oreText = this. add. text ( 20, 20, ' Ore: 0 ', { fontSize: ' 24px ', fill: ' #fff ' }); upgradeBtn = this. add. text ( 20, 60, ' Upgrade (50) ', { fontSize: ' 20px ', fill: ' #0f0 ' }). setInteractive (). on ( ' pointerdown ', () => { if ( ore >= upgradeCost ) { ore -= upgradeCost; orePerClick ++; upgradeCost = Math. round ( upgradeCost * 1.5 ); oreText. setText ( `Ore: ${ ore } ` ); upgradeBtn. setText ( `Upgrade ( ${ upgradeCost } )` ); } }); } Vollbildmodus öffnen Vollbildmodus schließen 3. Monetarisierungsblock hinzufügen Ziehe den Rewarded-Video-Node auf die Canvas. Verbinde ihn mit dem Upgrade-Button-Node.

Die KI fügt ein: function onReward () { ore += 10; oreText. setText ( `Ore: ${ ore } ` ); } ad. showRewardedVideo ( onReward ); Vollbildmodus öffnen Vollbildmodus schließen Jetzt können Spieler eine kurze Werbung ansehen, um einen kostenlosen Erz-Bonus zu erhalten.

Auf Play drücken → das Spiel lädt sofort. Klicke auf den Laser, beobachte, wie der Erz-Zähler steigt, und probiere den Upgrade-Button aus.

Dein Spiel ist live, monetarisiert und auf jedem Gerät erreichbar.

Mit Vorlagen lassen sich häufig gestellte Fragen schnell beantworten oder Snippets zur Wiederverwendung speichern.

Möchtest du diesen Kommentar wirklich ausblenden? Er wird in deinem Beitrag verborgen, bleibt aber über den Permalink des Kommentars weiterhin sichtbar.

Für weitere Maßnahmen kannst du in Betracht ziehen, diese Person zu blockieren und/oder Belästigung zu melden.

Automatisch übersetzt. Das Original auf Englisch ist unten aufklappbar.

Original (Englisch) anzeigen

The moment Google announced Google Playground this summer, the tech community stopped scrolling and started building. Within hours the phrase “make a game in minutes” was trending on Twitter, exploding across Reddit threads and spawning dozens of TikTok demos that showed a parent, a college student, and a hobbyist all launching playable titles without writing a single line of code.

Why does that matter? The global gaming market is on track to exceed $250 billion by 2027, yet the supply of skilled developers can’t keep up. At the same time, the creator economy is hungry for low‑code tools that turn ideas into revenue streams fast. Google Playground sits at the crossroads of these trends: an AI‑driven, drag‑and‑drop environment that writes scripts, generates art, and even suggests monetisation tactics on the fly.

In this practical guide we’ll cut through the hype, walk through the core features, show you real‑world examples (including code snippets you can copy‑paste), and give you a step‑by‑step action plan to launch a monetized game in under an hour.

Total: ~11 minutes to a playable, monetized prototype.

js<br>const config = { type: Phaser.AUTO, width: 800, height: 600, physics: { default: 'arcade' }, scene: { preload, create, update } };<br>function preload(){ this.load.image('player','assets/player.png'); this.load.image('spike','assets/spike.png'); this.load.image('coin','assets/coin.png'); }<br>function create(){ this.player = this.physics.add.sprite(100,450,'player'); this.spikes = this.physics.add.group({ key:'spike', repeat:5, setXY:{ x:200, y:0, stepX:120 } }); this.coins = this.physics.add.group({ key:'coin', repeat:10, setXY:{ x:150, y:300, stepX:70 } }); }<br>function update(){ // simple left/right movement … }<br> | | Diffusion‑based asset creator | Generates PNG/SVG assets on the fly; you can lock style (pixel‑art, flat, hand‑drawn) and resolution. | Prompt: “Pixel‑art sprite sheet for a blue robot with 4 walking frames.” → 64 × 64 PNG sheet ready to drop into the project. | | Visual drag‑and‑drop UI | Nodes represent game objects, events, and monetisation blocks; wiring them together builds the underlying script automatically. | Drag a Score node onto the canvas, connect it to the CoinCollected event node – the AI adds score += 10; behind the scenes. | | Built‑in physics & collision | Pre‑configured Arcade physics; you can adjust gravity, bounce, and friction with sliders—no code required. | Slider: Gravity Y = 800 → instantly makes jumps feel heavier. | | Monetisation plug‑ins | One‑click enable AdMob, Google Play Billing, or Stripe for subscriptions. | Turn on “Rewarded Video” → the AI adds ad.showRewardedVideo(onReward); and a UI button automatically appears. |

Below is a concrete, end‑to‑end example that you can follow in your own Playground account.

“Create an idle clicker where the player taps a mining laser to collect ore, upgrades increase ore per click, and a background starfield scrolls slowly.”

// ==== script.js ==== let ore = 0; let orePerClick = 1; let upgradeCost = 50; function preload () { this. load. image ( ' laser ', ' assets/laser.png ' ); this. load. image ( ' star ', ' assets/starfield.png ' ); } function create () { // background scroll this. add. tileSprite ( 400, 300, 800, 600, ' star ' ). setScrollFactor ( 0 ); // clickable laser const laser = this. add. image ( 400, 300, ' laser ' ). setInteractive (). on ( ' pointerdown ', () => { ore += orePerClick; oreText. setText ( `Ore: ${ ore } ` ); }); // UI oreText = this. add. text ( 20, 20, ' Ore: 0 ', { fontSize: ' 24px ', fill: ' #fff ' }); upgradeBtn = this. add. text ( 20, 60, ' Upgrade (50) ', { fontSize: ' 20px ', fill: ' #0f0 ' }). setInteractive (). on ( ' pointerdown ', () => { if ( ore >= upgradeCost ) { ore -= upgradeCost; orePerClick ++; upgradeCost = Math. round ( upgradeCost * 1.5 ); oreText. setText ( `Ore: ${ ore } ` ); upgradeBtn. setText ( `Upgrade ( ${ upgradeCost } )` ); } }); } Enter fullscreen mode Exit fullscreen mode 3. Add a monetisation block Drag the Rewarded Video node onto the canvas. Connect it to the Upgrade button node.

The AI injects: function onReward () { ore += 10; oreText. setText ( `Ore: ${ ore } ` ); } ad. showRewardedVideo ( onReward ); Enter fullscreen mode Exit fullscreen mode Now players can watch a short ad to get a free ore boost.

Press Play → the game loads instantly. Click the laser, watch the ore counter rise, and try the upgrade button.

Your game is live, monetised, and reachable on any device.

Originaltitel: Build & Monetize a Simple AI Game in 30 Minutes with Google PlaygroundQuelle: dev.to (dev.to). Original öffnen