Monogatari v1.4

Monogatari has one simple mission, make visual novels accessible and available for everyone by bringing them to the web. This is a huge task, it has to be a tool that matches everyone’s experience and makes the task of everyone involved in VN creation easier.

For writers it features a simple language and path creation that’ll allow them to just focus on writing an amazing story without having to struggle too much while providing translation possibilities in a very simple manner.

For artists it gives them the power to use a whole lot of tools and formats and even use vectors that will look amazing on every resolution. We are not talking just about images here, CSS provides you the possibilities to do just about anything, from amazing GUIs to a whole world of animations!

For developers it provides not just an engine but a framework as well, as a mainly web developer I’ve made Monogatari in a way that the games created using it are not simple games, they are full websites and take advantage of every little trick and feature the web has to offer.

I’ve encountered many times that people with background on other engines have troubles getting that concept, the fact that their visual novel is not just a game, it is a website by itself, Monogatari game creators are doing the work of a web developer but in a very simplified way, simplified does not mean it holds you back, it means it makes it easy to create simple things and provides you the right tools to take you to the moon.

The newest Monogatari v1.4 was silently released this week and it is one of the biggest updates so far. Not only in the addition of new features but also in the improvements of many previously added features that were not quite as polished as I wished them to be, it had a major code refactoring and a huge amount of bugs were fixed.

Huge Thanks to:#

This whole thing would of course have not been possible without the support of amazing people and I’d like to recognize them all (Hopefully I’m not forgetting anyone)!

• My Patrons - You guys are the best and this is possible because of you!
  • Cesar
  • Michael
  • Eléa
• BakaKiller - Thanks a lot for the French Translations revisions and additions!
• ign1ght - Thanks a lot for the Dutch Translations!
• DragoonHP - Thanks a lot for all the testing and contributions!
• Nando - Thanks a lot for all the help in testing, improving and creating awesome features!
• mapfde - Thanks for testing Monogatari on all kinds of iOS devices!
• Kagami - Thanks for helping on the improvement of Monogatari!
• Tamakimouto - Thanks for the help on improving Monogatari and helping on support!
• Kevin - Thanks for the quick testing and bug reports!

Lastly, I’d like to thank anyone who has ever tried Monogatari, sent an email asking for help or reported a bug, all of you make this all worth it!

So what are the new Features you can expect?

Typing Animation#

Something that was missing out since day one was that typing effect you find in a lot of visual novels and now, you’ll be able to find it on Monogatari as well!

The initial speed can be set up by the developers, it can also be deactivated globally (not showing any animation at all) or on a per character basis, so you can have characters which dialogs are animated and characters that don’t show any animation. This is also configurable for the narrator and centered special characters.

Since the speed may also be prone to personal opinions, players are also able to set their own speed settings with a new bar in the settings screen.

Auto Play#

Sometimes it’s a lot more comfortable to just push the auto play button and go through the novel as if it was a movie, this new feature will go through the novel without requiring the player to click/press a button every time they want to advance.

This however doesn’t mean that choices and inputs will be skipped, if the auto play reaches any element that requires user interaction, it won’t continue advancing until the user makes the required action.

Of course every one of us read at different speeds and that’s why there’s a new bar in the settings screen to control how fast the auto play will go.

New Dynamic Quick Menu#

Responsiveness has always been a focus for Monogatari, everyone should be able to play your game no matter what screen size they have, it should simply adapt to them in a nice and consistent way. At the beginning, the quick menu was was shown in the same way in desktop and mobile devices.

With this release, the quick menu is now dynamic, optimizing it for either mobile or desktop as needed.

On desktop it is now shown as a traditional quick menu (probably what most people is used to on a visual novel).

And on a mobile device,it’ll be shown as it was before, using icons instead of text which is much better for touch experiences.

Better Save Slots Management#

The save slots have been redesigned and will now use the local date and time format by default instead of just the date as they did before. Nonetheless, the date has now become secondary information. The new saving slots will allow players to set the save slot name, allowing them to have a better organization and also a way to recognize each save slot easily.

When you overwrite a save slot, you’ll be able to change the name if you need to or simply keep the same as it was before.

And as you can see from the “X” icon in the top right of every slot, deleting them is now possible!

This means you won’t have to set a predefined number of slots anymore, the player now have complete control on creating, overwriting and deleting their save slots. The Slots property available in the options.js file has now been repurposed and it only represents the number of Auto Save slots available.

Reversible Functions#

While the simple script format provides all the basics you need for your Novel, sometimes you need something more advanced, that’s why Monogatari allowed the use of common JavaScript functions but they had their own limitations, once a function would be run, going back on that part of the game was not possible. Rather than it not being possible, it was actually a fixed behavior Monogatari had due to some technical complications.

You see, since these are user-defined functions where you can do anything you want, the problem was knowing what the function did, if you don’t know what it did then there is no way to revert it and thus going back was blocked.

With this release, another approach was taken. Instead of trying to figure out what the function did, there simply is now a way for you to define your function and the function that reverts it. You and only you know exactly the effects of a function you made so it makes sense you are also allowed to define the way to revert it.

Hence, a new JSON object was born, the "Function" object.

Now, let’s see how it works with a simple example. Imagine you are building some kind of RPG elements in your game and thus your player has stats. Normally, those stats would be declared inside your storage variable like this:

"use strict";
// Persistent Storage Variable

let storage = {
	player: {
        intelligence: 0,
        ability: 0,
        strength: 0
    }
};

Now, inside your script you would probably make some modifications of those stats depending on what the user does or how the story goes.

let script = {
    // The game starts here.
    "Start": [
        "h Currently you have {{player.intelligence}} points of Intelligence but you seem far more intelligent, how about we add five points?",
        function () {
            storage.player.intelligence += 5;
            return true;
        },
        "h There you have it, you now have {{player.intelligence}} points of Intelligence",
        "end"
    ]
}

So, if we played this game, the first text would appear, then after we click for the next one, the function would be run adding 5 points to the intelligence stat and immediately would show the next text. If we wanted to go back to the first text once the second one is displayed, it wouldn’t be possible, Monogatari doesn’t know what changed and thus prevents the user from going back but now we have a solution for this!

let script = {
    // The game starts here.
    "Start": [
        "h Currently you have {{player.intelligence}} points of Intelligence but you seem far more intelligent, how about we add five points?",
        {"Function":{
            "Apply": function () {
                storage.player.intelligence += 5;
                return true;
            },

            "Reverse": function () {
                storage.player.intelligence -= 5;
            }   
        }},
        "h There you have it, you now have {{player.intelligence}} points of Intelligence",
        "end"
    ]
}

As you can see, we replaced the function with the new "Function" object which has 2 properties, an "Apply" function which will run when going over the game and the "Reverse" function which will be run when going back. This now solves the previous problem we had since we are using "Apply" to add the 5 points and "Reverse" to subtract them in case the player went back and thus makes possible for players to go back even when a function was run. Just as with common functions, you can use Promises and also control the flow of the game by returning true or false in the "Apply" function.

Wait Statement#

It’s something common to add little pauses along your game, either for an animation to finish or simply because your plot requires it. The wait statement now allows you to do this in a simple manner.

let script = {
    // The game starts here.
    "Start": [
        "Hello there! I want you to wait 5 seconds now",
        "wait 5000",
        "Wow, that was a long time!",
        "end"
    ]
};

The wait statement allows us to make the game wait for a certain amount of time before continuing, this will also ensure the player can’t advance until the wait is done.

Taking the sample code,the first dialog will be shown, then, when the player continues, the wait statement will make it wait for 5 seconds and then the next dialog will be shown.

You may be wondering why it says 5000 instead of just 5 in order to wait 5 seconds, the reason behind it is that the wait statement accepts the time in milliseconds, therefore we have to make the conversion from seconds to milliseconds for it to work as we want.

Improved Particles System and Shake Animations Support#

Particles and Shake animations were one of the additions that v1.3 brought, however they were not quite right integrated and needed some extra work to use them, with this release these features are now fully integrated into the engine and will allow you to use them just as you do with all the other things!

For particles systems, the performance was greatly improved since now all remaining operations are canceled after they are stopped. This means it will free up resources and thus your game won’t become slow. Particles are a great way of adding effects such as rain, wind, stars and other ambient animations!

For Shake animations, the library used was not working as intended due to some differences with how Monogatari used animations, it has then been fixed and now you can use them just as the other ones with just it’s class name! Here are the names of the animations:

• shake
• shake-hard
• shake-slow
• shake-little
• shake-horizontal
• shake-vertical
• shake-rotate
• shake-opacity
• shake-crazy
• shake-chunk

If you want to see how they look like, there’s no better place than the CSS Shake Library Website. Thanks a lot to those guys for creating this awesome library!

Those new animations can also be used with the "infinite" class to make the animation infinite just as with the other ones.

Updated Demo#

The Demo has been updated to this latest version so you can take a look at all these new features right away!

Monogatari 1.4.1#

A small point release was just made as well to address a few encountered bugs, the only file that’s changed from v1.4 to v1.4.1 is the monogatari.js so you can just replace that file and you’ll be just fine.