Launch the editor in current browser for PC, Chrome, FireFox, Opera, Edge Chromium, Safari or their analogues

On-line GitHub
Download itch.io

Warning: Editor does not work in Internet Explorer and Edge browsers.

Step 1 : New project
Create a new project by clicking on the file icon in the upper left corner.

Step 2 : Setting up a new project
In the window that appears, specify the working folder with the resources for the project.

Step 3 : Available localization
Indicate the project name and available languages. The 1st added language will be set as default language of the novel.

Step 4 : Add story block
Click on "Create Project", now we can proceed to create a story block by clicking on the "Add story block" button in the lower right corner. A story in Tuesday JS is made up of story block that the reader can switch between as they progress through the story, using choices or their consequences.

Step 5 : Setting up a story block
We set the block name in Latin letters and the block color as desired. The player will not see these names or colors, they are needed for your convenience when navigating through the plot. Click "Create Block". The first created story block will be considered the start block by default. if necessary, you can change it in the project settings.

Step 6 : Add scene
Open the created story block by clicking on the three dots on the left side Click (+) for call the menu of elements And add a new scene to the story block in the pop-up menu.

Step 7 : Scene background
In the scene options window that appears, set the background image by clicking the folder icon.

Step 8
The dialog box that appears displays all matching files from the project's working folder.

Step 9
Specify images for other languages if necessary, otherwise the image for the rest of the localization will be taken from the default language Click “Apply” and you will see the scene appear in the story block.

Step 10 : Add Dialog
Now you need to add a dialog element to it. Click the top (+) button and select "Add Dialog".

Step 11 : Launch scene edit
In the item that appears, click the menu button and select "Scene edit". The Tuesday JS story structure is divided into story blocks that contain the story scenes, and inside the scenes there are dialogs with other elements like text, graphics and choices.

Step 12 : Main menu
We are now in the scene editor. Since the first created story block is the start one, it is logical to make the main menu in it. Under "Buttons & Choices", click (+)

Step 13 : Buttons & Choices
A button appeared in the layout And a panel with its parameters appeared in the right menu.

Step 14
For the button, set the "go to" parameter to the value "Next story" Which means that when you click on it, the story will continue in the current story block. After pressing "Back" button to return to the script.

Step 15 : add dialogue text
Add another dialog to the scene by clicking in the middle (+) and selecting the "text" element

Step 16 : Text setting
A window with parameters for the dialog will appear. We set phrases for all available languages. The text area both in the editor and in the already created novel will not be displayed if no text is specified, so the text must be specified for all translations. If the translation texts differ in the number of phrases, then you can write “skip”, then the phrase will be automatically skipped.

Step 17
Now we can see how the entire interface looks. Click the menu of this dialog box and choose "Scene edit".

Step 18 : Interface view
In the section "text panel (global)" we can change the text area. In the section "interface buttons (global)" add new buttons for the interface and their appearance. It is important that the mark (global) means that the changes will affect the entire story, and not a specific scene.

Step 19 : Add sprite
Now add the sprite to the scene, Find the "Arts" item and press (+)

Step 20
In the window that appears, select the desired sprite from the working folder.

Step 21
We place the element in the scene and set its parameters in the same way as with the buttons. And do not forget about localization.

Step 22 : Duplicate element
We create selection elements for the further development of the story. To do this, in the menu of the last dialog item, select the "Duplicate" item, so as not to place the sprites again.

Step 23
In copied dialog, select "Scene edit"

Step 24
In the Scene Content section click on "Edit Text" and set a new text for the dialog,

Step 25 : Character name
This time we will set the character name in the Settings Name Panel section. The name translation is set together with the text.

Step 26 : Name panel
Now we can see that the character's name has appeared in the scene, Just like in the text panel, the "name panel" does not appear if the name is not specified. You can change the appearance and position of this element in the "Name panel (globally)".

Step 27 : Сhoice
Then add select buttons in the same way as when creating a menu. In the section "Buttons & Choice". One of the buttons sets the value "go to" to "Next story". And back to the script.

Step 28
In the scene, add another dialog for choice with the value "Next story"

Step 29
Next, we will create a new story block for the development of an alternative story, and add a scene and dialogue with the sprite to it. (Following the same steps of previous paragraphs)

Step 30
Return to the scene editor for a dialog with a choice, for the second button set the value "go to" to a new story block.

Step 31 : Linking plot blocks
Now we can see the name of the new story block in the "go to" item. We select it and return to the script.

Step 32
Now we can see in the script that one of the choice leads to another story block.

Step 33 : Preview
Using the preview, you can check the project with the selected localization.

Step 34 : Save project
Most browsers save files by default in the Download folder, where the project will most likely be placed. To reopen the project, you need to move the json file of the project to the working folder.

Step 35 : Open project
When opening a project, just point to the folder where the json file is located and Tuesday JS will find it by itself. If there are multiple json files in the folder, Tuesday JS will ask which file you want to open.

Step 36 : Build project
The situation is similar when exporting a project to an html file. It will go to the Download folder, and it will need to be manually copied to the working folder to the rest of the history resources.

It is important to understand that Tuesday JS is still under development and some things may not work correctly.
If you notice something like this, be sure to send me an email: tuesdayjsengine@gmail.com