Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Twine combined with Phaser

After playing a little with Twine, I've realised that making even simple GUI elements it's not so easy. There are various components, like inventory screens, character editors, interactive maps, settings or menu screens, that can enrich pure IF game a lot. In most cases we need to write a Javascript code to add them. From a game dev perspective, not Twine editor, there are relatively simple to make. Especially if we use dedicated framework, like Phaser.

Twine 1.4.2, SugarCube v2.17.0, Phaser 2.6.2
mufu.paperplane.io/PhT.html

PhT_screenshot.png

I took some Phaser examples and tried to embed them within Twine passages. Simplicity of creating complex, branching narration that Twine provides combined with easy way to add some interactive, more colorful parts. Each component (menu.js, game.js) is a separate file. It should be relatively painless to reuse them, as easy as putting code in a "script" passage. (I don't mean you copy a whole script, you just put a few lines of integration code.)

There are many areas my Proof of Concept can be improved, for example it may become slow/unresponsive and/or hangs your browser for a moment (Thats what happened to me after a while of furious clicking). It should work with no crashes, though. I tried very hard to break it on Firefox and Chrome. It works without major problems on cheap 7" tablet I own. (Chrome, Dolphin Browser Mini). I wasn't very consistent with how variables behave. Some exists only within the scope of Phaser and are reset each time Phaser object is loaded, some values are at some point added to SugarCube collection and persist. My code also lacks any layer (API of some kind) between two frameworks (SugarCube and Phaser), that's something worth adding next.

Bottom line, it's not as polished as I would like it to be, but I decided to show it at this stage.
Sign In or Register to comment.