For those who just want to try the games, here they are.
The experience is nicer on a computer display than on a phone, just because the computer display is larger.
(See the glossary below for definitions of a few terms.)
As a test of agentic programming, I decided to install the agent harnesses from OpenAI (Codex), X-AI (Grok), and Google (Gemini). Then I used all three harnesses, mostly Codex, to develop a circle pong game. It's just something I had seen written in Java before and thought it was kind of cool. It seemed like a good first project as it's visually engaging and easy to understand.
Agentic programming feels to me a lot like supervising a small group of software engineers. I started with a simple, open-ended prompt to all three harnesses.
Write me a circular pong program that I can play by moving a curved paddle around the circumference of a circle to keep the ball in the circle.
Then I took some of the ideas from the games they created and added some of my own ideas: the slider panel, game physics for the paddle,1 specifications for the controls, and aesthetics. Then I executed at least 30 prompts, mostly to Codex, to get the games exactly the way I wanted them. Some were simple prompts and some more detailed. Here's an example of a prompt to make the game playable on a phone as well as a computer.
Update circle-pong.html to support touchscreen devices such as iPhone and iPad.
1. Make a single-finger touch-and-drag perform the same game-control behavior as the existing mouse drag.
2. Preserve all existing mouse and keyboard controls.
3. Make the existing Start Game/Try Again button work with a touchscreen tap as well as a mouse click.
4. Add a Pause button above the "Press [Space] to Pause" text that can be activated by touchscreen tap or mouse click. It should perform the same pause/resume function as the existing Space key.
5. Preserve the existing Space-key pause/resume control.
6. Do not change any other behavior or appearance except what is necessary to add these controls.
Here's the prompt to replicate the retro styling of one of the games created by Gemini. Once I got circle-pong.html exactly the way I wanted it, I copied it to circle-pong-retro.html and sought advice from Chatgpt chatbot on how to write the prompt to the Codex harness.
Update circle-pong-retro.html so its visual appearance matches circle-pong-retro-gemini.html as closely as practical.
Use circle-pong-retro-gemini.html only as the visual reference. Transfer its retro styling, including colors, typography, panels, buttons, sliders, scanline effect, arena, paddle, ball, and other visual elements.
Preserve all existing functionality, game behavior, physics, controls, responsive/mobile behavior, text content, settings, and game rules in circle-pong-retro.html.
Do not replace circle-pong-retro.html with the Gemini implementation or copy its game logic. Modify only CSS, presentation markup where necessary for styling, and canvas drawing code required to reproduce the retro appearance.
The results mostly came out exactly as I'd intended. Just a few bugs that were fixed on the first try.2 Each file is about 700 lines of code. They are written in HTML, CSS, and JavaScript. It would take me a year to learn enough JavaScript and game architecture to write these, if I could do it at all. But I could do it in a day with coding agents. It's amazing what these harnesses and agents can do!
Chat Bot: An AI large language model (LLM) that conversationally returns text in response to your input.
Coding Agent: An AI LLM that has been trained on programming languages and open source software applications, and has whatever permissions the user gives it to read and write to files and perform other software programming tasks. These agents are trained on all of the software, use cases, models and frameworks that are available in the huge repository of open source software.
Harness: is software that manages the AI agent. The user gives the harness a task in plain English, and the harness supervises the agent to plan the work, execute the plan, test the results, and try again recursively if tests don't pass. Technically the human interacts with the harness and the harness interacts with the agent.
HTML, CSS, Java:Software languages for development of web pages. HTML provides the text and reference to static graphics, CSS provides uniform formatting and aesthetics, JavaScript provides dynamic functionality (moving objects, etc.)
Prompt:The instructions that a user gives to the Chat Bot or Harness.
1. In real-world paddle physics, if the ball always initiates from the center of the circle, and assuming no ball English (ball deflection by rapidly moving the paddle as the ball strikes it), then the ball will bounce straight back to the center of the circle because the paddle is an arc along the circle. That's pretty boring. Gemini wrote its pong game that way. Codex added a kind of game physics I'll call off-center deflection, meaning the ball deflects if it strikes away from the center of the paddle, proportional to the distance from the center to the strike point. Grok used off-center deflection and a large amount of ball English—so large that a fast paddle swipe would drive the ball sideways along the paddle with almost no way to recover. I decided to implement the same off-center deflection that both Codex and Grok used, and Grok's ball English but much less amount.
2. I'm not counting the time I asked Codex, all in one prompt, to take Grok's initial pong game circle-pong-grok.html and port over all of the controls and features I had been developing in circle-pong.html, because I liked the aesthetics in circle-pong-grok.html. That's of course a terrible idea, but I wanted to see if Codex could do it. It replicated the slider panel with the PLAY AGAIN button but placed it only half way into the circle. Even if I wanted to follow this path, it's better to request one feature at a time so that any bugs are easier to track down. I bailed on this path, and instead asked Codex, one feature at a time, to add a few aesthetics to circle-pong.html that were presently in circle-pong-grok.html: appearance of circle perimeter, appearance of paddle, comet tail on the ball, and a few other niceties.