Branching dialogue using Ink

I used the scripting language Ink to write the dialogue for Nothing to Say, and it was an absolute joy to use, so here's a short devlog about how I used it and why I recommend it.

:blue_heart: Nothing to Say

Me and @Rose's game for LD45 is Nothing to Say, a dating sim-inspired game with a puzzle element: you can't choose dialogue options unless you've unlocked the right letters, so you have to make strategic choices of letters to keep exploring the dialogue, earning hearts, and eventually to confess your feelings.

dog shorter.gif

The game is made entirely with HTML/JS/CSS. The only external library I used was Ink.

When working on the script, my goal was to write a fun, engaging dialogue that players would actually enjoy playing through multiple times. I didn't have a ton of time, so Ink was a huge help in letting me draft different interesting branches for the conversation.

:pen_fountain: Writing in Ink

Ink is a scripting language for branching stories from InkleStudios. I highly recommend it for any narrative game, especially games with lots of dialogue choices - it's super easy to write out the choices and the outcomes of each. (According to the documentation, there are considerably more complex features too, but I haven't explored those yet!) You write it in their editor, Inky, which lets you test the story as you go, completely decoupled from your actual game code.

ink.PNG

For Nothing to Say, the letter-unlocking mechanic was handled by the actual game code - the Ink script just included all the options, so I could play through the different options freely in Inky to try to write fun moments. Also, the script can be divided into sections, which makes it easy to shift things around later.

:bookmark: Tags

Ink lets you add any tags you want to each line - you can see in the screenshot above that I marked Zoe's expressions with smiley face tags. (I'll tell you what, adding in @Rose's adorable art was a big improvement over a lone smiley face floating on the screen!)

I also used tags to mark which lines score points for the game code, while simultaneously tracking the points in Ink to determine how Zoe responds to you at the end of the conversation. In Nothing to Say, you can't rescore points you already scored in a previous playthrough (except the pity point about how she appreciates the effort you're making, of course..) - that was handled by the main game code, since each playthrough was a fresh start from Ink's point of view.

:book: Hooking it up

The javascript version of Ink is a breeze to use. You just keep asking the Ink story for new lines or choices and it spits them out.

``` function getNext() {

if (story.canContinue){

    var line = story.Continue();
    var tags = story.currentTags;

function getChoices() {

story.currentChoices.forEach(function(choice) {

    var choiceElement = document.createElement('div');
    choiceElement.innerHTML = choice.text;
    choiceElement.addEventListener("click", function(event) {
        story.ChooseChoiceIndex(choice.index);
        getNext();
    });

    choices.appendChild(choiceElement);

```

There was plenty of processing on top of that, like testing the choice text against what letters you have unlocked, but the Ink story was a super solid core. :)

:heart:

There's a really quick look at how I used Ink in Nothing To Say. As an amateur gamedev and writer, I'm a huge proponent of how fun and easy it is to use. Definitely check out the Ink web tutorial if you're interested. (They have Unity integration too, that's a whole other story!)