by Today I am going to share how to create a cool and playable color ball game in Python with ChatGPT4. I originally wanted to start with a classical Tetris game. ChatGPT refused to provide the complete implementation of a full Tetris game on the excuse that it is too complex. Instead, it provided a very simple implementation as a starting template. But I changed my mind later on. There must be plenty of open source Tetris implementation in the wide open Internet. People who underestimate the capability of ChatGPT would insist that ChatGPT copied the code from some open-source repository. So I decided to ask ChatGPT to write a very niche game with fully customized game specifications. It’s the Color Ball game. I wrote this game using Java Applet 20 years as a graduate student. Then I wrote another android version of it 10 years later and submitted it to app store. Now I am asking ChatGPT to write a Python version.
So here it goes my game spec fed to ChatGPT:
Design a simple game using python. Create a board with 10×10 grid. In each turn, the computer generates a color ball at a random empty spot with a random color out of five choices. The player can select a ball and move the ball to another empty spot if there is a path between the spots. After moving the ball, if there are five or more balls of the same color on the same row or the same column or the same diagonal line, all these balls will be removed from the board. The game is over when the whole board is filled up.
So the code generation part is pretty smooth. However, ChatGPT stopped short of generating all the code. So I tried to ask ChatGPT to provide the rest of the code.
The code you showed me was not finished. Can you provide the rest of it?
Pleasantly, ChatGPT remembered where it stopped exactly and continued to provide the rest of the code.
So this capability to continue a longer response is amazing. All right, I pasted the generate code into Visual Studio code and got it to run. It runs without any syntax errors or missing imports. But all I got is a blank window with nothing in it. I quickly realized that the code doesn’t generate any new balls at the beginning. So the user will have nothing to move. I did forget to explicitly mention that requirement in the spec language although that should be implied. But hey, when I taught my 11 year old daughter to code in Python, she always wrote a function, didn’t write any code to call it and told me it didn’t work. So I know I shouldn’t complain since this AI is just a new born. So I added a nice reminder to that fact. Also I wanted to add grid lines to the game board.
So, I ran the code again and Hooray, I got a nice board with grid lines and three balls to start with.
When I tried to select the ball and move it, it is not moving as I expected. After some inspection, I found there is a bug at this place. The code to calculate the selected ball is wrong. The grid has a starting offset of (40,40). However, the ball is positioned on the intersection point of the grid line instead of in the cells. But ChatGPT4 calculated the row and column coordinates as if they are put in the cells. But honestly, a lot of novice programmers could make this kind of mistakes, especially when rounding is involved.
So I reminded ChatGPT to specifically look at this part of code and try to fix it. At first, it provided me with exactly the same wrong code. So I reminded him that it is the same code. At 2nd attempt, the AI got it.
After this change, the game is already playable but the selected ball will jump from the original position to the target position instantly. And it doesn’t check if there is an open path between the starting position and the ending position. So I put in a revision request as shown below,
Unsurprisingly, ChatGPT uses the standard BFS algorithm to identify the moving path of the ball. The code is rather long and I had to ask it to complete twice. I tried this updated code. It doesn’t work exactly as I expected. The ball shows up at the target position even before the moving animation started. Also, the starting position and ending position of the moving position is not correct. The last point turns out too challenging for the AI to fix all by itself. So I had to read the code and identify the actual line that caused the issue. Even when I pointed out the exact line, it still took me three interactions with the AI to get it to understand the issue. Here is the location of the bug. It is supposed to use cur.x() and cur.y() instead of prev.x() and prev.y(). To be fair, that’s a tricky issue that a lot of human programmers will run into as well. Without doing step by step tracing, it is actually not easy to identify this issue.
At the end, I have to be very exact in the hint for the AI to realize the issue. Check this out.
At this point, the game is playable with very nice moving animation. After that, I also asked ChatGPT to draw the balls with 3D effect and highlighted the currently selected ball, which it handled very well without glitches. I also asked it to generate three balls in each turn. Here is how the game looks like now.
Next I found that it doesn’t erase the balls properly when there are five balls of the same color in the same row, column or diagonal line. That takes quite a few iterations for the AI to get it all correct. But I got all I want eventually after explaining things in more and more details. Here is a video of the final game.
Some people like to focus the errors and mistakes made by ChatGPT and use it an excuse to dismiss it as a toy. Indeed, the ability and willingness to propose solutions even when they might be incorrect actually make ChatGPT more human-like. The ability to fix the issue after detailed interaction and communication clearly demonstrates that ChatGPT is able to understand the subtleness, exactness and nuances in the human language. That is potent and invaluable in my opinion.
Here is the complete code for you to download.
