Thread by @CatsAndVultures

Over the past few months, we've been working hard on a Discord grand-strategy bot looking to push UI to its limits. Because of the complexity of the bot, we've had to restrict it to being guild-based. Here's what it is, and how we built it: 🧵

-Vis
#Discord #javascript #strategy

Originally built as an RP bot, it's now a complete grand-strategy game on Discord, developed from the ground up. Everything - from economy to combat has been coded into a new UI. It spans from the years 1500 to the present, and allows you to start your own custom country.

Armies, trade, and the economy all take place on a province map, which can be changed out each season according to player votes. Each province is specified by a 'Province ID'- AKA a number, like '11307'. This is how players can target and select specific areas of the map.

The game UI itself is quite clever: it utilises completely private channels and three embeds - a topbar, a middle embed for displaying content, and a bottom embed to provide alerts and tooltips for the player. In addition, three blank messages sit just below the middle embed ..

.. to function as a sort of control panel for the player in more detailed menus. This concept was first come up with in our Anno bot (still a WIP) a few months ago:

Unfortunately, whilst Discord's over-glorified emojis (AKA buttons) provided a great deal of flexibility up top, they were horrible for inline formatting. To solve this, we came up with a quick but effective solution: simply bold/bracket the text surrounding the button [Like so].

This text can then directly be typed out by the player verbatim to simulate a 'button press'. Since all player messages in the private channel are immediately deleted, the UX is seamless, and it almost functions as a 'text-only game'.

Of course, we can display far more than mere text. A map viewer (which can be repurposed for any image) has also been built to be utilised by players to see the province map and their own nations, and changes in real time every 10 seconds.

This can then be panned using the arrow emojis and zoomed in/out using custom magnifying glass emojis. Two additional emojis help provide control over the speed of panning as well.

The map itself is converted from a pre-made SVG map into a JPEG image, which is then ..

.. immediately cached in an invisible channel, uploaded, and its URL fetched before being shown to the player as that map. A simple Node HTML parser is used in changing the colours of the various provinces, and node-canvas for the labels and additional layering itself.

Since ditching a(n) (admittedly bad) custom SVG lexer, this has been mind-blowingly efficient. A couple thousand <path> el's can now be filled in milliseconds.

This cached map is then split into various mapmodes, such as 'political', or 'peace treaty' ..

.. which reflect the various mechanics they are meant to portray. The game's UI itself is split into various tabs (similar to other grand-strategy games such as Victoria II) that display various pieces of contextual information relevant to the player.

Of course, being a Discord bot, everything takes place on a single map in a global MP campaign. This means that the bot is turn-based (1 turn being every 3 hours), so players can get some well-needed sleep.

Oh, I forgot to say, but here's an example of our tooltips in action, from the Inventory menu:

We've also rendered the entire concept of bot commands obsolete using what we call 'Visual Prompts', which ask the user what to do step-by-step, editing the prompt along the way:

This custom implementation using message content is far better and more intuitive than what @discord currently has through 'slash commands'. As evidence of them needing to shove it down everyone's throat, an entire button in the chatbar is reserved just for typing a single '/'.

@discord .. and needless to say, Message Content, which makes this whole concept even possible in the first place is being stripped from bot devs who don't have it for whatever Discord deems a 'lawful purpose'. Yikes.

Luckily, we don't need to worry about that (yet) as a guild-bot dev.

@discord So, you might be asking how a couple of game mechanics here work by now. Let's get some of the harder things out of the way. Military and combat rely on what we call 'Army Management' commands to help manage potentially 100s of armies across thousands of provinces.

@discord These rely on a manual NLP ordinalisation algorithm for both Roman and Arabic numerals to help specify dozens of armies quickly, with arguments separated by commas.

@discord Once selected, these armies can then be given global orders- to garrison cities, to carpet siege, and other QOL functions you would come to expect from other strategy games. They then immediately embark on pathfinding over the province map to their target destinations ..

@discord And arrive based on a player's technology, army speed, and other options - such as whether to avoid attrition, or the territory of other players.
Related to combat are peace treaties, which we have custom mapmodes, allowing users to edit their demands in real time.

@discord Other mechanics, such as tech trees, are based on the #Stellaris model, showing a set number of 'cards' depending on the techs one has already researched, as well as their immediate descendants, or where they lead in the future.

@discord If you'd like to play, the whole game currently is in stabilisation beta - meaning that we're still hoping to work out some of the technicalities, but the game is open for everyone. Because the game is guild-based, you'll have to join us over at discord.gg/89kQY2KFQz to try it.

@discord Here's some extra screenshots of the bot for those interested: