If you see this message, it means that your browser failed to load this file.

You should try the following : check your connection, disable ad-blocker, clear your browser cache, try in private mode, try from another browser/computer/connection.

Home »
BGA Studio
(for web developers)

• You are a web developer fluent in server side (PHP, SQL) and client side (HTML, Javascript) languages

So this presentation looks easy and fun to you.

• You want full access to the BGA development stack to develop complex games (but we still advise you to start with something simple for your first game!)

Check the documentation and tutorials to get started!

What is BGA Studio?

Getting started

4 slideshare presentations to get ready to use BGA Studio in 30 minutes:

Reference Documentation

This page comes from BGA wiki, and has been written by BGA players community. Feel free to edit it!

What is Board Game Arena Studio?

Board Game Arena Studio is a platform to build online board game adaptations using the Board Game Arena platform.

It is open to any gamer with software development skills :)

BGA Studio website: http://en.studio.boardgamearena.com

Original announcement on BGA forum: http://forum.boardgamearena.com/viewtopic.php?f=10&t=1973

How to join the BGA developer team?

Please see this page: How to join BGA developer team?

Great, I'm in! ... How should I start?

If you didn't already, check the presentations at the top of this page to get the basics.

Then, you should checkout the First steps with BGA Studio to make sure that runs fine.

After that, we strongly advise you to take one of these game creation tutorials:

Then start editing files and see what happens! ;)

Once you're done with tutorials, you can start a real game (or join existing project)

If you have any questions, please check out the Studio FAQ first, then if you didn't find the answer you were looking for, please post your question on the development forum.

BGA Studio documentation

BGA Studio Framework reference

This part of the documentation focuses on the development framework itself: functions and methods available to build your game.

File structure of a BGA game

Game logic (Server side)

Game interface (Client side)

Other components

BGA Studio game components reference

Game components are useful tools you can use in your game adaptations.

  • Deck: a PHP component to manage cards (deck, hands, picking cards, moving cards, shuffle deck, ...).
  • Counter: a JS component to manage a counter that can increase/decrease (ex: player's score).
  • Scrollmap: a JS component to manage a scrollable game area (useful when the game area can be infinite. Examples: Saboteur or Takenoko games).
  • Stock: a JS component to manage and display a set of game elements displayed at a position.
  • Zone: a JS component to manage a zone of the board where several game elements can come and leave, but should be well displayed together (See for example: token's places at Can't Stop).

Undocumented component (if somebody knows please help with docs)

  • Draggable: a JS component to manage drag'n'drop actions.
  • ExpandableSection: a JS component to manage a rectangular block of HTML than can be displayed/hidden.
  • Wrapper: a JS component to wrap a <div> element around its child, even if these elements are absolute positioned.

Reference for classes in game class hierarchy

  • Table: a PHP class that you inherit from for the game php

BGA Studio user guide

This part of the documentation is a user guide for the BGA Studio online development environment.


Tools and Advice



Please remember me

Join the BGA Studio developers team

To start developing on BGA Studio and get access to development environment, you need to create an account below.

Personal infos provided in this form is NOT shown to anyone but BGA Studio admin, and is NOT used for any other purpose that BGA Studio organization.

(Must be valid. We may remove accounts from developers we can't contact.)

(3 to 20 characters. No space, no number, no special characters)

(The exact username you are using on BGA)

Important: we need your REAL name to attribute your work on the Studio & to send you stuff by Post when needed.

Important: we need your REAL name to attribute your work on the Studio & to send you stuff by Post when needed.

Please enter the security code you see

I agree to Terms&conditions for developers of BGA Studio.


Advise needed on Tooltips


I managed to add tooltip for my card game (Riftforce).
Actually it is only a bigger image of the card but I plan to improve it with translation of the description on it.

But, I am facing strange behaviour.
First here is my code.
In tpl :

CODE: Select all

var jstpl_guild_tooltip = '<div class="card-guild card-tooltip guild_${guildName}"></div>';
In css :

CODE: Select all

.card-guild {
    background-image: url('img/GuildSummoners.png');
    background-repeat: no-repeat;
    display: inline-block;
    background-size: 1100% 100%;
    position: absolute;
    justify-self: center;
.card-tooltip {
    border-radius: 18px;
.guild_fire{background-position: 0% 0%;}
In JS :

CODE: Select all

this.addTooltipHtml( 'guild_' + guildId, this.format_block('jstpl_guild_tooltip', {
                'guildName' : guildName.toLowerCase(),
What is happening :
  • A strange "graphic artefact" is appearing in the upper left corner https://imgur.com/a/kw6qCm5
  • Sometimes the tooltip does not appear and the card is "hover-blinking" with this CSS class (the card have it too, by design). When this happens, I cannot clic on card to select it (and trigger an action)

CODE: Select all

.card-possible-selection {
    cursor: pointer;
.card-possible-selection:hover {
    transform: scale(1.1);
    z-index: 100; 
Do you have any clue/explanation for these behaviors ?
05/13/2021 3 comments

Same notification received twice

For a reported bug, I start thinking that a single notification could be received twice by the client.
My notification is related to taking ressources and for some weird reason, the player reported the ressources was taken twice.
Going through the replay of the game, there is no such cases and ressources are correctly taken, used and displayed.

Due to the client/server architecture, could some corner case exists such as the following one ?
  • Server send a notification to all players, It goes through internet, so maybe some acknowledgement exists.
    At the ends, the server surely needs to save the last notification send to a player in case of connection issues.
  • Player1 receives and handle the notifications, aknowledge it and the server records the last notification.
  • Player2 receives and handle the notifications, aknowledge it, but the aknowledgement never reach the server due to connection time out or something similar
  • Since Server don't get any acknowledgement from Player2, it retries to send the same notification again which this time succeed and is properly aknowledged, but is applied twice for Player2
Since the arguments from a received notification holds an 'uid' field, it can be easy to check on the <game>.js that the received differs from the last handled uid before handling it... but such a feature isn't it already part of the BGA framework internal checks?

CODE: Select all

        notif_myNotif: function(args) {
            if (this.prev_notif_uid == args.uid) return;
            // manage the notification at UI level
            this.prev_notif_uid = args.uid;
Does it makes sense ? I can't find in the table database any field related to notification uid apart from the gamelog table within field gamelog_notification. For instance : [{"uid":"609bd1460d552","type":"messages","log":"$...

I think I faced myself such case of double notification for other games when connecting from multiple devices to mobile phone.

Related bug : boardgamearena.com/bug?id=40992
05/12/2021 7 comments

Developer wanted for Monster Highway by One Day West Games


We've really been enjoying playing games on BGA and decided to try and get our games onto this platform for others to enjoy. We currently have approved license agreements with BGA so now we are looking for developers to help us out and bring our game to life.

Monster Highway - Monster Highway is a board game where 2-4 players are building roadways using tiles to get to your Home Base. After a nuclear meltdown at a power plant, the lake next to it was quickly saturated with radioactivity. An alligator in the lake transforms into a road smashing, car crushing monster. Be the first to build your roadway and drive your car from ground zero to your home base to win the game. Beware of the monster and of your opponents. No one is safe on Monster Highway! Playtime is approximately 20-30 minutes.

To learn more about the game, you can find information here: https://www.onedaywestgames.com/product ... er-highway

We are available to answer any questions regarding rules of the game and provide an necessary art assets required to build the game.

Thank you again for your time,

Bob Craig & Ryan Craig
One Day West Games
05/11/2021 Comment on this

Application loading... ...
THANK YOU : You are one of our most loyal players!
Get the best from Board Game Arena for only €2 / month.