'Drafter' is a 'Twine' like story editor

With 'Drafter' you can create interactive story games.
Interactive story games are text based (mini?) adventures.
Also you may use this tool for game prototyping.
'Drafter' is HTML5 and javascript based.
Because of this 'Drafter' is fully progammable.
You can edit and program the editor and the game-engine.

'Drafter' is a two ways editor

The first view is the note editor.
With the 'add note' button you insert a new note to the game.

If you want to use the script editor,
use the 'toggle' button.

First you should create a mini story.

First you should create a mini story with the
visual note editor. Try the tutorial example or
create your own story. Keep it simple.

If you want to script, take a look the game engine
source in the script editor. You should know some
javascript or learn it.

Now let's start and write a super simple mini story.

This story should have a start, an end and some credits.

First add a note.
Open the notes menu - '*' in the upper right.
Choose 'edit note' option.
The edit note box opens.
Add the title:
This is the start note
and the text:
Here the story starts.
It is a very short story.
How it will end is all your choice.

So you add and edit your frist note to the story.
You may save now the code and the game.
If you would close or reload the browser,
you can restore your current work.
But let's add a second note instead.
Title:
The end is near.
Text:
And now the end is near my friend.
Very near...
Famous last words.
Here is the third one.

Title:
Credits
Text:
Editor, game and game engine made by
Malte Kosian
You can contact me @maltekosian
via twitter, facebook, google or at linkedin
© 2014-05-31

Now you should save.
Notes needs connections.
To add a connection choose the 'add connection'
from a note's menu.
The connection box opens.
A connection has a text. The text is shown as
a choosable option like a html link.
This story game needs following connctions:
From start to end with the text:
Go to the end
From start to credits with the text:
Credits
From credits to start with the text:
Back to the start
From credits to end with the text:
Forward to the end
From end to credits with the text:
Credits

Save the game again.
Also export the story to store it on your harddrive.
Run a test by pushing the 'test game' button.
You can stop the test run with the 'stop test' button.

That's it.

The views of the finished tutorial example in editor.

The tutorial example will look like this in the note editor:


The script editor will show this:


And that's how a test run looks like:

With the 'add note' button you insert a new note to the game.

A note has a title, a text, connections and a unique id.
All value are empty after creation, except the uid.
To edit the note, open the note's menu - the * in the upper
right corner). Choose the option 'edit note'.
The note box opens in the upper left corner.

Here you can change the code of the game engine.

You need some basic knowledge of javascript programming.
Good resources for javascript are:
stackoverflow - for mostly any kind of questions in programming.
mozilla javascript reference.
html5rocks - good tutorials for HTML5, CSS and javascript.
w3schools - JavaScript Tutorial, try it yourself examples in every chapter.
Tip: search engines are your friend.

A note is single text.

It is like a tweet in twitter.
But it has connections (links) to other notes.
A note has a title, a text and connections.
A note is named 'Passage' in 'twine' - a connection, too.

Toggle between the two editor modes

source script editor to do the programming,
note editor for the game creation.

creates a new note

creates a new note,
adds it to the editor.game.notes array,
shows it on the noteeditor screen
and the note ist on the right of the script editor

What should you use?

save and load are storing in the browser.
These options use the localStorage or the indexedDB.

With ex- and import you store the game-data to the
computer's files system. Or you import some data from there.

If you want to pubilish you game, use the 'build'-button.

Building the final version of your game.

If you tested you game and code carefully, click the
'build'-button to download the final version of your
game.
It is a single webpage file with all data and source
will you need to publish the game in the internet.

Firefox users can install the editor.

Users of the Firefox Browser can install this editor
directly to the computer.
You can find the install button in the preferences
dialog box.
After a long golden day I've finished the 'native' node-webkit based
Application of hogventure's Draftercraft for
Windows in a 32bit version,
mac OSX 10.7+ 64bit version,
Linux32 and Linux64.
If node-webkit isn't able to run on newer distributions such as
Ubuntu 13.04+, Fedora 18+, Arch, Gentoo, derivatives of the above or so,
you might follow this link for help.
https://github.com/rogerwang/node-webkit/wiki/The-solution-of-lacking-libudev.so.0
Although I hope, you won't need this link, because I added the script 'hdc' to start the app.
You may link this to the desktop. Have fun and create great games.

What preferences can you use?

• install in firefox and do not save, just close
• extensions do not save, just close
• how to store
  • in the browser local store
  • on your computer
  • with dropbox, if you have a dropbox account
• source codes in in the code editor and to use in builds
• game title in firefox and do not save, just close

The media extension is the only avaiable and
working one.
Other will come.

Currently the extensions are experimental

You activate the usage of extensions in the preferences
dialoy box.

The media extension is the only avaiable and
working one.
Other will come.