Board Game Arena

Partly thanks to some excellent advice from this blog, I decided to publish NXS on Board Game Arena.

According to BGA’s own promotional material, they have over 1.6 million users(!), and over 700,000 games played per day(!).  That is a lot of potential players for any game.  Additionally, their ELO system makes it attractive for players to try out new games in hopes of getting good rankings they might not be able to get with an established game.

For these reasons, it really made sense for me to get NXS running on their site.

Warning, here there be nerdy stuff:

BGA uses Javascript, PHP, and MySQL, all of which are very standard web technologies.  They also take care of putting your content in a mobile friendly format, which is awesome (although that has had some challenges, more on that later).  They also handle all of the notifications, player communications, rankings, etc.  It really is a great platform.

I had already implemented a playable version of NXS using these technologies, so that made the process much, much faster.  However, fitting NXS into the BGA platform definitely had some challenges.  For one thing, BGA games typically use something called CSS Sprites for their graphics.  I had implemented NXS using HTML5 Canvas, and I really, really didn’t want to re-do all of the graphical components.  Luckily, their developers were open to a different implementation.  Thanks BGA for being open minded!

The next hurdle was that I had initially implemented NXS entirely client side.  That means that all of the game logic (determining what is a legal move, etc.) was all done in the clients browser.  Only later did I add the ability to play over the internet.  But in order to make those changes small, I still kept all of the game logic client side.  As the BGA developers pointed out, this could be a problem if somebody with technical knowledge decided to intentionally cheat, and send bogus moves to the server.  So, that meant re-writing the important pieces in PHP on the server.  PHP is definitely the weakest area of the three languages for me, so getting quickly up to speed was important.

Some of the BGA design components were also quite tricky to understand.  I’m not exactly slow, and their game-state system was a mind bender for me.  But eventually, I sorted it out.

My HTML5 Canvas implementation has caused a couple of issues.  First, it is nice if things happen when you hover your mouse over a game component.  This can be a pain in Canvas, because there are no individual components to react.  The entire canvas reacts to a mouse move event, for example.  The means redrawing the entire canvas for everything, and I didn’t want to do that if I could avoid it.  So there are a few minor niceties missing that would be easier in CSS Sprites.  The bigger issues is the interaction with BGA’s mobile interface.  Something is going on that neither their developer nor I understand yet.  I don’t think it is a big deal, but it forces the player to zoom in using their zoom button before he/she can move a piece.  You really want to be zoomed in anyway, so that you can target a hex precisely.  But still, it is non-standard, so hopefully they will be able to sort it out.

Play-testing:

Play-testing with a couple of different users has been great.  They have made some excellent interface improvement suggestions that I was able to implement pretty easily.  They are really things I should have thought of in the first place.  But hey, that’s why more eyes are better, right?

Overall, this has been a great experience, and I’m very excited about getting NXS in front of more people soon!