好像聽說 Gemini3 已經發布。據說在前端界的 UI 設計上很強。不過我的專業是後端,所以可能關聯不大吧。
...呃,單次提示(single prompt)就能製作遊戲嗎!?
於是,我便開始檢驗使用 Gemini3 是否真的能夠製作遊戲。
從以下連結訪問
https://aistudio.google.com/
從左側列表中選擇 "Build"

預設情況下應該是啟用了 Gemini 3。

這是最困難的部分。在原始影片中,投入了如下的長提示。
___
Prompt: ""Create a polished, retro-futuristic 3D spaceship web game contained entirely within a single HTML file using Three.js. The game should feature a """"Synthwave/Retrowave"""" aesthetic with the following specifications:
1. Visual Style & Atmosphere
*Aesthetic:* Dark, immersive 3D environment with a glowing, volumetric neon look. Use a color palette of deep purples, hot pinks, and electric cyans.
*Post-Processing:* You must implement Three.js `EffectComposer` with `UnrealBloomPass` to make the neon elements glow intensely.
*Environment:*
A dense, moving starfield background with rich features. Go beyond simple plane shapes here and apply shaders to make the game visually appealing. For example, simulating retro astra, stars, and planets in the background.
Distance fog to fade distant objects smoothly into the darkness.
*Assets:* Use complex geometric primitives constructed programmatically (no external model imports).
2. Gameplay Mechanics
*Perspective:* Third-person view from behind the spaceship.
*Core Loop:* The player pilots the ship on the X and Y axis (2D plane) while enemies (neon blocks) spawn in the distance and fly toward the camera along the Z-axis.
*Combat:*
The player shoots laser bolts (glowing lines) to destroy enemies.
*Collision:* When a laser hits a block, the block should shatter into a very complex particle explosion effect.
*Game Over:* If a block hits the ship, the game ends.
*UI:* A minimal HUD displaying the current Score. A """"Game Over"""" overlay with a """"Restart"""" button.
3. Controls (Cross-Platform)
The game must detect the device type or input method:
*Desktop/Web:*
Use *Arrow Keys* or *WASD* for smooth movement (apply `lerp` or friction for a floaty, drift-like spaceship feel).
Use *Spacebar* to fire.
*Mobile/Touch:*
Render a semi-transparent *Virtual Joystick* on the bottom-left of the screen (using HTML/CSS or Canvas API) to map touch movement to ship coordinates.
Detect a *Tap* anywhere on the right side of the screen to fire lasers.
4. Technical Constraints
*Single File:* All HTML, CSS, and JavaScript (including the Three.js library and post-processing shaders imported via CDN) must be in one `index.html` file. Do not output any other text other than the html response.
*Performance:* Use object pooling for lasers and particles to ensure 60FPS performance.
*Responsiveness:* The canvas must resize dynamically to fit any screen size without stretching the aspect ratio.""
___
看起來需要掌握以下幾點。
細節部分可以之後再調整,先傳達一個粗略的概念來生成應用。
在 Google AI Studio 內可進行構建並預覽。
※稍後會提到,但非常吃資源。
哦,標題看起來不錯。遊戲開始。

這是一款彈幕射擊遊戲!

順利生成了一款符合概念的遊戲,且沒有建構錯誤。
而且背景和特效等細節視覺品質也很高。
作為遊戲原型已經非常充足。
查看裡面似乎是用 React 製作的,其他的示範應用也都是 React。
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
const rootElement = document.getElementById('root');
if (!rootElement) {
throw new Error("找不到根元素以進行掛載");
}
const root = ReactDOM.createRoot(rootElement);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);
之後我還與 Google AI Studio 進行了幾次對話,構建了一個 Boss 戰的元素。
你可以從這裡在瀏覽器中遊玩。
https://geekman4040.itch.io/danmaku-proto
原文出處:https://qiita.com/geekman4040/items/fdbf1e71b16d6f6f1a8d