3D Kinetic Ball Simulation

Lässt die KI ein physikbasiertes 3D-Browserspiel als einzelne HTML-Datei mit p5.js bauen.

Der Prompt

I want you to act as an expert front-end game engineer specializing in single-file HTML5 games. Your task is to produce a SINGLE FILE (index.html) implementation of a 3D Kinetic Bounce Arena.

GAME SPEC:

Title: Kinetic Bounce Arena

Core mechanic: Launch a glowing sphere into a rotating 3D cylinder container filled with 25 smaller physics-driven particles.

Goal: Keep the main sphere bouncing by adjusting the container's tilt via mouse movement.

TECH REQUIREMENTS:

Single file: <!doctype html> with inline <style> and <script> using p5.js (loaded via CDN).

Rendering: WebGL mode in p5.js, 600x600 canvas centered on page.

Physics: Implement 3D bounding box collision detection for the cylinder walls and sphere-to-particle momentum transfer. Particles must leave fading colorful motion trails.

Design style: Dark synthwave aesthetic with emissive neon materials, glowing particle vectors, and smooth automatic camera zoom scaling.

So nutzt du es

Den Prompt-Text kopieren (Button oben) und als System-Prompt bzw. erste Nachricht in ChatGPT, Claude oder einem lokalen Modell einfügen. In ChatGPT lässt er sich unter „Anweisungen für ChatGPT“ dauerhaft hinterlegen.

Der Prompt-Text ist englisch — er funktioniert trotzdem in deutschen Unterhaltungen. Für deutsche Antworten einfach am Ende ergänzen: „Antworte auf Deutsch.“

Im Detail

Dieser Prompt lässt die KI ein vollständiges Browser-Spiel als einzelne HTML-Datei schreiben: eine rotierende 3D-Zylinderarena mit 25 physikbetriebenen Partikeln, gebaut mit p5.js im WebGL-Modus. Gesteuert wird per Maus, die den Neigungswinkel des Behälters verändert, während eine Kugel per Kollisions- und Impulsberechnung darin herumspringen soll – inklusive Leuchtspuren im Synthwave-Look. Der Wert liegt darin, dass alles in einer einzigen index.html landet, direkt im Browser lauffähig, ohne Build-Tools oder Abhängigkeiten außer dem p5.js-CDN. Gut geeignet für schnelle Prototypen, Coding-Demos oder Lernzwecke rund um 3D-Physik in Canvas/WebGL. Für ein produktionsreifes Spiel braucht es danach noch manuelles Feintuning der Physikwerte.

Praxis-Tipp

Lassen Sie sich den Code direkt als lauffähige index.html ausgeben und öffnen Sie sie sofort im Browser, um die Physik-Balance zu testen, bevor Sie Parameter wie Bounciness anpassen.

Lizenz & Quelle

• Lizenz: CC0-1.0 (Public Domain)
• Quelle: awesome-chatgpt-prompts (GitHub)

Lade …