Your chosen game and why you picked it
In the first place, I made it after seeing this article.
I chose Retro Tetris. Tetris was a pretty tough challenge for me, new to game development, because it needed a bunch of algorithms, a bunch of features. But with the help of prompts, I was able to make it pretty easy. I felt it was important to lead the prompts a little smarter and more precise.
Effective Prompting Techniques Discovered
1. Describe Problems with Context
Effective:
- After pressing spacebar for hard drop, then using arrow keys to move, the next block doesn't appear
- When I press ESC, the pause message appears but it's not centered
Ineffective:
- The game has a bug
- Something is wrong with the controls
2. Build Features Incrementally
Instead of asking for everything at once, break it down:
1. Create a basic game board
2. Add block movement with arrow keys
3. Implement collision detection
4. Add line clearing mechanics
5. Create a scoring system
3. Be Specific with Numbers and Positions
Effective:
- Move the block spawn position from the 5th column to the 6th column
- Position the level-up popup at x=460, y=350
Ineffective:
- Adjust block positioning
- Move the popup to a better location
How AI handled classic programming challenges
Collision Detection Algorithm
AI generated an efficient 2D grid-based collision system:
public checkCollision(piece: Tetromino): boolean {
const shape = piece.shape;
for (let y = 0; y < shape.length; y++) {
for (let x = 0; x < shape[y].length; x++) {
if (shape[y][x]) {
const boardX = piece.x + x;
const boardY = piece.y + y;
if (boardX < 0 || boardX >= TetrisBoard.BOARD_WIDTH ||
boardY >= TetrisBoard.BOARD_HEIGHT ||
(boardY >= 0 && this.grid[boardY][boardX] > 0)) {
return true;
}
}
}
}
return false;
}
Examples of development automation that saved you time
Project Setup Automation
I was very low on building and running the game, which helped me a lot.
AI generated complete build configuration:
{
"scripts": {
"build": "tsc && vite build",
"deploy": "npm run build && gh-pages -d dist"
......
},
"devDependencies": {
"vite": "^6.2.0",
"typescript": "~5.7.3",
"gh-pages": "^6.1.1"
....
Automatic Code Refactoring
Transformed a monolithic 300+ line class into modular architecture:
Before: Single large update method
After: Separated concerns with dedicated methods for timing, rendering, and game logic
Constant Extraction
AI automatically identified and extracted magic numbers:
private static readonly GAME_WIDTH = 1000;
private static readonly GAME_HEIGHT = 800;
private static readonly BOARD_X = 250;
private static readonly BOARD_Y = 50;
private static readonly DROP_SPEED_BASE = 1500;
GitHub Pages Deployment Setup
Generated complete Vite configuration for deployment:
export default defineConfig({
base: '/retro-tetris/',
build: {
outDir: 'dist',
assetsDir: 'assets'
........
});
Code examples of interesting AI-generated solutions
Retro-Style 3D Button Effect
AI translated visual reference into CSS-in-JS implementation:
private createRetroButton(text: string, x: number, y: number): Container {
const buttonContainer = new Container();
const button = new Graphics();
button.rect(0, 0, 160, 50);
button.fill(0x4A4A4A);
// 3D effect implementation
button.rect(0, 0, 160, 3).fill(0xCCCCCC); // Top highlight
button.rect(0, 0, 3, 50).fill(0xCCCCCC); // Left highlight
button.rect(0, 47, 160, 3).fill(0x222222); // Bottom shadow
button.rect(157, 0, 3, 50).fill(0x222222); // Right shadow
button.interactive = true;
buttonContainer.addChild(button);
const buttonText = new Text(text, {
fontSize: 18,
fill: 0xFFFFFF,
fontFamily: 'Arial',
fontWeight: 'bold'
});
buttonText.anchor.set(0.5);
buttonText.position.set(80, 25);
buttonContainer.addChild(buttonText);
return buttonContainer;
}
Dynamic Difficulty Scaling
Level-based obstacle generation system:
public addRandomBottomBlocks(level: number): void {
const blockRows = Math.min(level, 10); // Level equals number of rows, max 10
const blockDensity = Math.min(0.3 + (level * 0.1), 0.8);
for (let row = 0; row < blockRows; row++) {
const y = TetrisBoard.BOARD_HEIGHT - 1 - row;
for (let x = 0; x < TetrisBoard.BOARD_WIDTH; x++) {
if (Math.random() < blockDensity) {
this.grid[y][x] = Math.floor(Math.random() * 7) + 1;
}
}
}
this.renderWithCurrentPiece(null);
}
Animated Level-Up Popup
Blinking text effect with automatic cleanup:
private showLevelUpPopup(): void {
const levelUpText = new Text(`LEVEL ${this.gameState.level}!`, {
fontSize: 48,
fill: 0xFFFF00,
fontWeight: 'bold'
});
levelUpText.anchor.set(0.5);
levelUpText.position.set(460, 350);
levelUpText.name = 'levelUpText';
this.addChild(levelUpText);
let blinkCount = 0;
const blinkInterval = setInterval(() => {
const text = this.getChildByName('levelUpText');
if (text) {
text.alpha = text.alpha === 1 ? 0.3 : 1;
blinkCount++;
if (blinkCount >= 10) {
clearInterval(blinkInterval);
this.removeChild(text);
}
}
}, 200);
}
Screenshots or gameplay footage of your final creation
Core Gameplay Features
- 12x20 game board with pixel-perfect rendering
- Seven standard Tetromino pieces (I, O, T, S, Z, J, L)
- Proper piece rotation and collision detection
- Line clearing with cascade effect
- Progressive speed increase by level
User Interface Elements
- Real-time score and level display
- Next piece preview window
- Pause/resume functionality
- Game over screen with retry/home options
Visual Design
- Retro aesthetic with 90s-style button design
- Pixel art styling with clean borders
- Smooth animations and transitions
Level Progression System
- Level increase every 10 lines cleared
- Dynamic obstacle generation (level = number of obstacle rows, max 15)
- Increasing game speed with level progression
Control Scheme
- Arrow keys for movement and rotation
- Down arrow for soft drop
- Spacebar for hard drop
- ESC for pause/resume



https://github.com/JadenWe/retro-tetris
GitHub - JadenWe/retro-tetris
Contribute to JadenWe/retro-tetris development by creating an account on GitHub.
github.com
'Jaden's spectrum > 💡 Tech Tips' 카테고리의 다른 글
| 깃허브 디렉토리 별 계정 설정 방법 / github directory account setting (0) | 2025.04.16 |
|---|---|
| 맥 OS와 VMware Fusion 간 공유 폴더 생성 (0) | 2025.02.18 |