Gamebook Framework

General (non-technical) New Apps / Works in Progress
#1

I’ve been hacking away at a gamebook “framework” (think:  Choose Your Own Adventure kinds of stories).  The code is fairly usable now so I thought I’d post it:

Let me know if you find it useful!

A gamebook app framework based on Corona SDK and Twine.

This framework will allow you to quickly create your own gamebooks (where you choose your own path through the story) and deploy them into an app. The framework uses the Corona SDK, so you can create Android, iPhone, Ouya, and other formats (and sell them in app stores if you wish).

The general workflow:

  • Use Twine to create the text for the book, including the standard Twine macros.
  • From within Twine, you can edit single passages and also see the overall structure of your story (what passages link to other).
  • When you’re ready, just export the file to text (File menu, “Export source code”) and put that in the ‘assets’ folder in the framework.
  • Use that inside a Corona simulator to view and test the app with different screen sizes.
  • When you’re ready, “Build” the app from within Corona and the system will send you a read-to-deploy app package (e.g. apk file for Android).
  • For Android, you can transfer the apk to a real device and install it for further device-specific testing.
  • Or you can upload that package to an app store and away you go!

Twine: http://gimcrackd.com/etc/src/

#2

You are a genius! How did you get the idea of building this?

#3

The UI isn’t that great - Can  you make it better? I could help you. Or can the users change the source code? It will be much easier then…

#4

The idea is to use an HTML template, including an embedded stylesheet, and then embed the “passage text” into that via keyword substitution (keyword==PASSAGE_TEXT).  So you should be able to change background colors, background images, text colors, text size, etc. all by modifying the HTML template in assets/theme.html.  

Of course, inside the passage itself you can include images, inline font changes, etc. – this isn’t handled cleanly by the Twine GUI, but it seems to pass through most HTML (so it’s a kludge but it seems to work).  I haven’t tried it, but I assume you could include inline CSS to position different text/images in different locations on the screen too. 

I suppose other keywords could be parsed too … passage-title, different background images for different passages, etc.  But haven’t gotten there yet!

The rest of the “app part” of the framework could be modified just like any other Corona app.  The splash screen is just a storyboard scene (you can do animations, etc.); the main screen with the buttons is just a set of widget.newButton objects (you can turn them into clickable newImageRect’s pretty easily).

#5

Thanks Jbp1. Your template will surely be of enormous help to me.

#6

Hi Jbp1,

I just installed the template, it works wonderful!

I’ll be playing around with it.

Thanks for sharing!

#7

You are a genius! How did you get the idea of building this?

#8

The UI isn’t that great - Can  you make it better? I could help you. Or can the users change the source code? It will be much easier then…

#9

The idea is to use an HTML template, including an embedded stylesheet, and then embed the “passage text” into that via keyword substitution (keyword==PASSAGE_TEXT).  So you should be able to change background colors, background images, text colors, text size, etc. all by modifying the HTML template in assets/theme.html.  

Of course, inside the passage itself you can include images, inline font changes, etc. – this isn’t handled cleanly by the Twine GUI, but it seems to pass through most HTML (so it’s a kludge but it seems to work).  I haven’t tried it, but I assume you could include inline CSS to position different text/images in different locations on the screen too. 

I suppose other keywords could be parsed too … passage-title, different background images for different passages, etc.  But haven’t gotten there yet!

The rest of the “app part” of the framework could be modified just like any other Corona app.  The splash screen is just a storyboard scene (you can do animations, etc.); the main screen with the buttons is just a set of widget.newButton objects (you can turn them into clickable newImageRect’s pretty easily).

#10

Thanks Jbp1. Your template will surely be of enormous help to me.

#11

FYI – I just uploaded a new version that gets rid of the webview objects in favor of “pure corona” objects – I just couldn’t get the webview to not flash a “cannot load file” image as it transitioned off-screen (or not without a massive delay).  

This means no bold, italics, etc. but it may make it easier to add non-book stuff into the mix (i.e. a “moveto” command to place text on top of an image).

#12

Hi Jbp1,

I just installed the template, it works wonderful!

I’ll be playing around with it.

Thanks for sharing!

#13

FYI – I just uploaded a new version that gets rid of the webview objects in favor of “pure corona” objects – I just couldn’t get the webview to not flash a “cannot load file” image as it transitioned off-screen (or not without a massive delay).  

This means no bold, italics, etc. but it may make it easier to add non-book stuff into the mix (i.e. a “moveto” command to place text on top of an image).

#14

Is it possible to make the image like a link to any passages?

#15

In general, yes, but this isn’t available in the BookApp yet, sorry!

There might be a way to hack it through Corona, you’d just put a touch handler on the image.

#16

Hmm… It’s a solution. Thanks. And thanks for your framework too.

#17

Is it possible to make the image like a link to any passages?

#18

In general, yes, but this isn’t available in the BookApp yet, sorry!

There might be a way to hack it through Corona, you’d just put a touch handler on the image.

#19

Hmm… It’s a solution. Thanks. And thanks for your framework too.

#20

Hi there,

I have ‘installed’ the gamebook app framework based on Corona SDK and Twine and have build the .apk file that worked for my Android phone. It is super and worked just as described, thanks! I have a question for the maker (jbp1). Currently it’s not possible to save state on this small app to continue another day, with for example the ‘page number’ and silver key in your inventory (e.g. variable). Is it possible for you you can extent this tutorial with this extra functionality or could you give me a pointer what route to take to implement this feature in my own app using your framework?

I am planning to write a complete gamebook (with lots of variables, like page numbers, keys, potions, weapons, etc.) and to save state between different sessions is a must.

I hope you, or this community can help me out with this of give me a good pointer where to look?

Thanks in advance and all the best to you and to you all…

Jeroen Wolf, from Amsterdam (the Netherlands)