Choosing the Right Technology for a Narratively Heavy Game

Because I wrote the book Unity in Action, an intro to Unity for programmers, one would assume I really like Unity as a game development tool. And I do; I would recommend Unity for the vast majority of game development projects. Like at least 90 percent, and possibly even 99.

Still, there are some more obscure types of games where Unity is not necessarily the best tool for the job. It just so happens that I’m in the early planning stages of one such game, so I want to discuss my technology choices for this project.

The Game
First off, I should give a bit of explanation about what kind of game I’m developing. Specifically, I’m developing (well, just planning to develop anyway) a digital version of a gamebook. If you want to know what a “gamebook” is, try looking here, here, or here, but long story short these are books best known to people through the “Choose Your Own Adventure” series. The third type of gamebook mentioned on Wikipedia is essentially a roleplaying game layered onto those books, and I’m planning to develop something even more elaborate by expanding beyond what’s possible in a physical book. I’m not the first person to put gamebooks on the computer, but I think I have some fairly unique ideas about what to do with the medium.

Naturally, this project will be narratively heavy and feature large blocks of text. While I would heartily recommend Unity for the vast majority of the things that come to mind when you think about video games (and again, a shameless plug for my book about Unity!) one thing Unity is not designed for is displaying large blocks of text. There are add-on components for doing cool things with text in Unity (shoutout to Text Mesh Pro here) but there’s little text handling built in for the simple reason that most games don’t display tons of text. And most games should purposely avoid interrupting the action with large blocks of text! I however have been exploring other options for my gamebook project…

The Tech
I’m going to build my game with HTML/CSS/JavaScript, and then package it into an app. Browsers are very good at displaying large blocks of text, because most webpages largely consist of text. You can format the text all kinds of different ways (fonts, sizes, colors, etc.), squeeze it into different parts of the screen, and all changes are handled automatically. That’s perfect for a digital book!

The main downside of building a game in a browser is that it can’t be too graphically sophisticated, but that’s not enormously important for what I have in mind. The newer graphical abilities in HTML 5 are more than enough for my needs. I’m already quite familiar with EaselJS so I’ll probably use that HTML 5 graphics framework. I also hear a lot about Phaser so I am considering that one, but Easel works quite well when I’ve tried it in the past, plus Easel seems to support more animation options (which could be quite handy for polishing the graphics later).

Once the game is developed in a browser, it will be packaged into desktop apps using either NW.js or Electron (I’m leaning towards the former, but have little experience with either) and mobile apps using Cordova.

Frankly, the tech choices for the game itself are pretty straightforward. Displaying nicely formatted text and deploying browser content in native apps are all solved problems. Where things really get innovative (and tricky!) is in writing the damn thing, so let’s take a look at the tooling there.

Creating Content
The obvious first place to look is existing tools for writing interactive narratives and dialogue. Well known examples include Twine, inklewriter, and Chat Mapper. I even looked at visual novel tools like Ren’Py. Ultimately however I don’t think any of these can build the kind of content I need. Don’t get me wrong, these are all great tools for interactive writing, but like I said I have something fairly… unique in mind.

Bearing in mind these great tips for doing interactive writing, I started looking for more customizable content creation tools. At first I hit on using yEd along with a bunch of custom properties; yEd is a very powerful graph editor that allows for nodes with custom properties, which sounds perfect for authoring a complex narrative graph. Unfortunately the level of customization still falls short of what I would ideally want, so I also looked into ways to build my own custom narrative editor. I figured that I could use the exact same desktop deployment tools as the game itself, so I searched around for JavaScript diagramming libraries and found JointJS.

At first my plan was to use yEd to build a prototype to prove that my narrative ideas even work, and then build a custom narrative editing tool after that first prototype. I even started writing a Python script (why Python? because why not nyah nyah) to convert yEd’s save files into the JSON format that my game engine will use. But then I saw this blog post from another game developer, in which he used JointJS to build a narrative graph editor for his game. Well, between the coincidence of someone building a tool just like I was considering, and how easy it sounded in his description, I’m now thinking I’ll just ditch yEd and build my own editor right from the start.

So, these are the tools I’m leaning towards and why. What do you guys think? I’m still really early in the development process (just planning really) so I’d love to have a lively discussion in the comments.

6 thoughts on “Choosing the Right Technology for a Narratively Heavy Game

    1. oo good point, I didn’t think of that. I don’t currently have 3D content planned, just 2D illustrations to go along with the text, but then I didn’t realize I could.


    1. Yarn is not directly useful since it’s basically Twine for Unity, but now that I’m taking a peek at their editor code I see that it’s a web app deployed to desktop like I’ve been working on for my editor. I may take a more thorough look sometime to see if there’s stuff I can adapt for my tool.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s