Postfour mini-Postmortem and mini-intro-to-d3.js

Yo.

So this is my game, Postfour : Reconstruction.

In this game, you play as the military leader of a space civilization that just won a 4x war, and now you’ve been elected as political leader and you have to help all the other civilizations rebuild their infrastructure and become self-reliant.

I’m going to talk a bit about making it, but not a lot, because it went super-smoothly and there’s not a lot to say, and then I’m going to talk about D3.js, the interactive data visualization library I used to make the game, and its potential as a game engine.

mini-postmortem

This is the second time I’ve finished an LD (out of four attempts) and the first time I’ve finished the jam with a team (out of two). I was pretty busy in the lead-up to this LD, so I didn’t spend a lot of time preparing or trying to assemble a team. The people I asked were pretty busy, and even the devs who really wanted to do it and said they’d try to show up couldn’t commit, which was a good thing, because none of them showed up. (Not bitter, not sarcasm, genuinely okay with all this.) This is okay, because the lesson I learned from last time is to scope a project for significantly fewer people than you expect, because people have a lot of reasons for not showing up, and most of those reasons are completely legitimate. I scoped the game for me as t he only programmer, and that worked out.

I did have an artist. She was a friend of a friend who responded when I hit up a mailing list said mutual friend and his friends use to plan parties. I’d never met her before and she’s pretty cool. Here’s her website. She didn’t have a lot of time that weekend either, but she helped with some UI design and drew the really cute portraits you see in the game. She plans to help out with the full version of the game, so expect to see more cute art in that one too.

These are the four different alien species. There were 10 different visually distinct individuals total (three per race except top right), and two expressions (mad and not mad) per visually distinct individual.

So that’s the team.

The game came out exactly like I planned it except not – every feature you see in the game was in the original this-is-what-we’d-do-if-we-had-a-lot-of-time idea for the game, but most of the features didn’t make the cut for Friday night scope reduction. There was originally going to be no trading and no concept of infrastructure and production in the LD version, but there were going to be scripted plot points about various political figures doing various things, and you needing to make decisions that would affect the political climate of the game. The goal was to prevent the war from breaking out again and make it to the end of your term.

As I started coding though, I realized that the elements I had scoped out were the more game-like elements, and the elements I had scoped in better served as icing on the cake, so I flipped it around. Only one non-player character with any personality made it into the game – the politician who is pissed that xe is relegated to mere advisor while you, a military leader with no political experience, hold all the actual power. Xer snide dialog is entirely contained in the help window and the end-game screen, but a few people got some laughs out of xem. I guess we’ll see how many when the humor score gets revealed tomorrow.

(Pronoun use didn’t make it into the game at all, but your species (the top-left humanoid species) has no concept of gender, while the crab species, the glowing eye species, and the floating ball species all do, and it confuses you. But that got scoped out.)

Nothing really dramatic happened during development. There were no crazy issues with getting anything to work. There was an exploit that I knew about and let stand for a long time that would let you trade beyond the ostensible max on the trading slider, but I fixed that on Monday. The fix introduced a bug though, and I managed to fix that with less than a minute to go before the deadline, so I guess in the movie version, that would be the big edge-of-your-seat moment, but I really should have just fixed the exploit sooner. There is still a situation you can get into in the game where the above-the-max thing happens as a result of infrastructure growth or cancelling trades in the middle of a chain of trades, but it’s not really an exploit, and I haven’t even decided on what the correct behavior should be.

One of the problems I did have was that I used a purposely bad color scheme during production to remind me to come up with a better one, and it grew on me.

::sniff:: I miss you, light blue on light grey.

Known issues:

• Several sets of planets are nearly co-linear and as a result, sometimes people thought the middle planet was trading with the two end planets, and couldn’t figure out how to cancel the trade.
• The music doesn’t work on certain browsers and prevents the game from loading.
• There wasn’t enough visual indication of how planets were doing, and especially during the end game, a lot of the game was spent searching for the one or two planets that needed fixing.
• The help screen was too much to take in at once and it needed to be broken out into a tutorial.
• Likewise, several people didn’t notice that there were a couple of objectives listed in the treaty because the treaty was a little hard to find.
• Also, the second objective was impossible to address from the get-go and you had to start out by doing things that broke it and then go back and undo them later, and people didn’t realize this because I didn’t make it clear.
• In what should have been a two minute fix but I never got around to it, there should have been a status bar at the top indicating how much time you had left in your term, not just a fraction.
• Several things like how much industry a planet had and how much it would cost to do a certain action were not well messaged.

Features for the full version:

• More named, distinctive characters and interactions between them
• Scripted events
• Possibly multiple resource types? I don’t know.
• Procedurally generated maps, and difficulty settings
• Saves

D3.js

Before I start this section, I want to acknowledge that I have a history of really liking underpowered or inappropriate tools for programming projects. I would also like to state that I don’t believe D3 is underpowered, and I think it is only slightly inappropriate. If you are not convinced, and you are looking for a more traditional, less inappropriate html5 game engine, try phaser.

So D3 is a library designed for making slick, interactive data visualizations. It was created by Mike Bostock when he was at Stanford; he’s now at New York Times using it to make all the data visualizations they have. Some examples:

• The most detailed map you’ll see of the midterm elections
• Tracing the History of N.C.A.A. Conferences
• Across U.S. Companies, Tax Rates Vary Greatly
• Among the Oscar Contenders, a Host of Connections

Pretty nifty, no?

Anyway, that was the main library I used to make my game.

I think it has a lot of potential as a game engine.

And I don’t think I’m crazy for saying so.

I was thinking I was going to give a brief overview of how D3 works so you can get started learning it, but there are a ton of good getting-started-with-D3 things out there and they’re easy to find, and there are even more D3 samples with code. (Honestly, I’d even say skip the tutorials and just start playing around with the demos, then Google anything you don’t understand.) Instead, I’m just going to show you a few examples of things D3 can do that might convince you to give it a try as a game engine.

I’ll say it’s easy to learn, but you don’t have to take my word for it. Most of these examples give you the source code right on the page, and for the ones that don’t (my game included), you can get it by viewing the page source. (My game splits most of the functions out into other .js files, but they are also available for viewing and the page source will give you the links. I just realized I haven’t tested this on the itch.io link, so if it doesn’t work, the gdocs link should.)

D3 isn’t designed as a game engine, but it has some features you would expect any game engine to have.

• timer functionality
• Canvas and SVGoutput (also demonstrated: swarming behavior)
• basic collision detection
• physics
• particles
• path finding
• Whatever you want to call this – camera control?
• This is some sort of infinite map thing.
• Even multitouch support, apparently

It also has a bunch of features that you wouldn’t expect to see in every game engine but that could really be useful for certain types of games.

• Voronoi calculation
• Want some sort of fancy tech tree?
• Globe projections you haven’t even heardof (and all the ones you have, and TopoJSON connectivity so you can get maps of all sorts of things.)
• Quad trees

I could keep adding more examples, but I should stop somewhere.

I’m not the only one who sees the potential here.

• Some guy made D3 Tetris
• Some guy made D3 planarity
• Some guy made D3 pong
• A D3 version of that game where you try to trap balls in small areas
• Here’s a geography game.
• A rotating color matching game thing
• A game where you play as an antivaxxer and kill people?
• This guy’s going all out and making an RPG thing.

Anyway, if that all looks cool to you, check out D3. There are a shitton of examples here and you can also pick up the source code. You probably don’t even need the source code, since you can just go <script src=”http://d3js.org/d3.v3.min.js” charset=”utf-8″></script> to use it.

I am not sure if any of this will be any help to anyone, but I’ll put it up. If you have questions about D3 that aren’t answered above, go ahead and ask me here. I wanted this to be helpful and I’m not sure if it is as is, so I’ll make it right by answering any questions you have or pointing you to resources that do.