# I made a strategy game with AI opponents using p5 \[Devlog\] **URL:** \ **Category:** Gallery\ **Created:** [September 30, 2025, 8:05am UTC](https://discourse.processing.org/t/i-made-a-strategy-game-with-ai-opponents-using-p5-devlog/47254 "2025-09-30T08:05:39Z")\ **Posts on this page:** 3\ **Page:** 1
**Author:** ![colin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/colin/32/230_2.png) [@colin](https://discourse.processing.org/u/colin)\ **Post date:** [September 30, 2025, 8:05am UTC](https://discourse.processing.org/t/i-made-a-strategy-game-with-ai-opponents-using-p5-devlog/47254/1 "2025-09-30T08:05:39Z")
![Capture d’écran 2025-09-19 à 10.47.50](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/3/e/3e6b979b447a50c7ce871288a0d46424a02f146c.png) ![Capture d’écran 2025-09-19 à 11.12.21](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/e/1/e1b43c9b23fa4a994d507be358a700d6e323848f.png) ![Capture d’écran 2025-09-19 à 11.16.34](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/3/4/3490077e9607a5725eec2679e81d86d68e8da676.png) ![Capture d’écran 2025-09-19 à 10.49.50](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/c/3/c3bc7247460ccd53d9bab9b5d7879074ab9281a9.png) Hi there, it’s been a while since I published a project using **p5.js**. This one was an interesting challenge design wise, but also had a lot of challenging parts in the development. I learned a lot along the way and I thought I might share a bit with you here : - **Overall architecture and consistency** : This project, while being short to play (5-10mn), is by far the most complex I’ve worked on in terms of development, and I stumbled quite a lot while building its overall architecture. Along the way, I had to adopt coding conventions and repeatedly iterate on different parts before achieving a consistent whole. There’s still plenty I could refine. If I were to do it again, I’d probably consider using TypeScript, mainly to avoid going back and forth between function to double check parameters types and so on. - **AI move calculation** : I used Web Workers for the first time to run algorithms while keeping animations smooth. It’s super handy, I definitely recommend playing around with it if you haven’t yet. - **AI algorithm optimization** : I ran into a lot of logic puzzles to make the AI opponents feel challenging while still running efficiently in browsers. One effective solution was to enforce a specific order in which the AI selects and tests moves, which avoids generating a large number of duplicate game states to compare. - **Animation queue** : This turned out to be more challenging than I expected. Some animations are asynchronous, while others need to wait until previous ones resolve. Designing a consistent system for this required careful thought, and it’s still not as handy as I’d like. - **Terrain generation** : I wanted everything to be generated dynamically to make map design iterations easier, so I relied on a shader. A single shader handles the background, terrain, and lighting effects. The trickiest part was tracking down NaN values that occasionally appeared, causing black pixels on older devices. - **UI design** **UI design** : This was the part I expected to be the hardest. I wanted the game to be strategic while still easy to grasp. Design-wise, I think I stripped the gameplay down to the minimum very efficiently, but given our short attention spans in browsers, I still had to put a lot of effort into making the game understandable at first glance. I was lucky to have a good number of playtesters who helped me spot small edge cases that were confusing. One great solution I found was using day/night lighting to reinforce changes in game states. I also realized the game could already be played in five distinct ways, based on the options available when starting a new game, so I created five dedicated interfaces with subtle changes to support each mode. As always, **p5** was a big help when it comes to display elements on the screen, managing curve vertex, 3d models and different canvas. I would be happy to discuss the game or any developpement aspect with you here. If you have any feedbacks, it would be very appreciated ! 🙂 The game can be played here : > **[Balkan Bounds by Martian's Parlor Entertainment](https://martiansparlor.itch.io/balkan-bounds)** > > Link residents to their relatives ---
**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\ **Post date:** [September 30, 2025, 8:54am UTC](https://discourse.processing.org/t/i-made-a-strategy-game-with-ai-opponents-using-p5-devlog/47254/2 "2025-09-30T08:54:39Z")
> [@colin](#): > > If I were to do it again, I’d probably consider using TypeScript, mainly to avoid going back and forth between function to double check parameters types and so on. Most IDE linters recognize js-doc comments as datatype hints. A simple example: > Notice that types Visitor & VisitorWithGtc are defined in this file, also using js-docs syntax: > Alternatively, we can define types in “.d.ts” files using TypeScript syntax; mostly for more challenging types that are hard to be expressed using js-docs: > ---
**Author:** ![colin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/colin/32/230_2.png) [@colin](https://discourse.processing.org/u/colin)\ **Post date:** [September 30, 2025, 8:57am UTC](https://discourse.processing.org/t/i-made-a-strategy-game-with-ai-opponents-using-p5-devlog/47254/3 "2025-09-30T08:57:49Z")
Never tried this before, looks very handy !