Defusal Devlog 1: Starting from Scratch

Defusal Devlog 1: Starting from Scratch

·

4 min read

I'm hoping to increase our transparency and grow our bond with the community through these articles. I hope you enjoy reading them as much as I did writing them!

Getting Up to Date

Above - a screenshot of Defusal's main menu in 2022.

Almost 3 years have passed (wow!) since the initial concept for Defusal.io came to fruition. We knew from the start that we wanted to create a 2D top-down tactical shooter, free to play on web, PC and mobile platforms. It also needed to have real-time multiplayer and fast paced gameplay.

I quickly realized that, as a broke hobbyist solo developer, this was easier said than done. I'm lucky enough to have had 2 passionate and highly supportive artists by my side producing art and other assets (shout-out to nc and amadeo), but handling essentially everything else on my own was going to be a daunting task.

I'd be lying if I didn't say that these past 3 years have been a wild ride. Certain times were very productive while other times were plagued by hiatuses because of school, life, and sometimes a general lack of motivation.

After spending most of the last 1.5 years or so building the game in Unity, I decided that it wasn't going to be a good fit for my needs. In fact, I subconsciously spent most of my time developing the game's back-end rather than the front-end just to avoid having to work with the engine, which is something I've only noticed looking back. Unity is a great, powerful engine, but as we aren't going to need any advanced 3D or VR capabilities in Defusal and have no plans to target console platforms, I ultimately realized that I could drastically improve my own productivity rate using something more lightweight.

This brings us to the present day, where this devlog series begins! I'm currently reimplementing both the game's client and server in TypeScript and C# respectively for greater control.

The New Client

The new client is written in TypeScript language and then transpiled to JavaScript before running in the browser. I use Vite as my build tool to achieve this.

One thing I knew for sure was that I needed to find a capable rendering engine before starting. I chose PixiJS because it's pretty fast and easy to use, but also because it seems to be the only one still regularly maintained.

I got Pixi set up, added a few buildings (as sprites) to the world and checked how everything looked in the browser.

This is nice, but...

The New Server

The game world right now is pretty boring, and where's the player's character? We need a server for players to connect to and play on. It's a complex topic, but one I'll dive deeper into in another article.

Once I had a prototype server up and running on my local machine, I made the client connect to it. The server sends back world state data to all connected clients at a rapid rate (60 times per second in this case), which can be used to show/update players and other networked objects. Next, I created the visual model for players on the client so they could be rendered. Lastly, I added some extra features - making the local player look at the mouse and adding a basic camera to follow them, to name a few.

Trivially, I added a simple input sending system so I could move around the world with WASD or the arrow keys.

Then I spent some time designing a very bare-bones physics engine with bodies and colliders so the player couldn't walk through buildings. This was admittedly a harder challenge than I expected it to be, but after some trial and error I made it work.

Final Look

Of course, this is just the early beginning of a long journey ahead. There's any project's fair share of bugs to work out, improvements to be made, and features to be added. For the next devlog, I'm hoping to show off the player's idle + walking animations and particle trails. Thanks for reading until the end, and I hope you have a great rest of your day!