Jscrambler helps to protect our HTML5 games

jscrambler_protection

We love to code HTML5 games and JavaScript is a nice programing language but unfortunately everyone can access to the source code of our games. And that includes those cheeky guys who doesn’t want to respect existing license agreements or those just looking for “inspiration” for their next cloned game.

Luckily we have a powerful ally called Jscrambler.

Jscrambler is quite intuitive and it’s web based. There are some other javascript obfuscators but JScrambler offers the most complete and secure solution. Its version 4 has just been released. According to Pedro Fortuna, CTO of JScrambler:

“Version 4 brings the product from a code protection solution to a platform that provides a tamper-proof environment to the application, making sure it is executed without interferences and by legitimate users only.”

We’d like to show you an example of the level of protection that Jscrambler offers, we’ll take a function of our game “Alien Kindergarten” and obfuscate it.

We can see that even after using JSbeautifier the code is quite difficult to understand. Besides site-locking they offer some interesting transformations such as dead code insertion (that’s why the obfuscated code is longer) and member enumeration.

Mission accomplished…. it looks like that doing the whole thing from scratch is much easier than attempting a reverse engineering.

Ahhhh! forgot to say that Jscrambler is optimized for games and doesn’t affect performance.

New Foot Chinko game with new tricks

We are happy to announce we are working on a new Foot Chinko chapter.

 

new-footchinko-eurocup 

It’s been a long time since the original game was launched and we were excited about the possibility of developing a new Foot Chinko game. During this time it seems that our little creature has been growing in popularity. Although the game was released over a year ago, enthusiastic players keep on uploading videos: Foot Chinko on youtube

Is it our imagination or does it look like searches on google for the keyword “foot chinko” are growing? Results on google trends

We are going to release an HTML5 exclusive version of the game for Spil Games. This version will feature the Eurocup 2016 and will include a couple of new mechanics.

We are also considering a native version of the game for iOS, Android and Windows phone using Unity. By combining the old game levels with the new ones, we could have almost 150 different levels, but the truth is, in this time we’ve learned so much about level design that designing a complete new set of levels is an interesting challenge.

So, what kind of publisher do you think would be a good partner for this adventure? We would love to hear your thoughts…

Help phaser development

 phaser_logo

We’ve been using an html5 game engine called Phaser for over a year. It’s open source and was created by a photon storm.Our experiences with Phaser have been fantastic. We’ve tried several frameworks but found Phaser the best game engine to develop our games from the usability and performance points of view.Now Richard Davey, the man behind Phaser, has started a campaign to collect money to be able to dedicate more time enhancing his incredible framework.Please check this out:

>> Phaser on Patreon

RavalMatic defies the USA

RavalMatic has broken the embargo imposed to Russia by the USA and sold its most strategic game to Comon Games, a courageous Russian company.
The negotiations were conducted with maximum secrecy in Viena by one of our agents and high level officials of Comon Games. Once the deal was completed, we inserted an usb memory in a banana. That usb contained all the project files. The banana was part of a bananas cargo that left the harbour of Barcelona 3 weeks ago with direction to Istanbul.
Nobody of the crew was aware that among the thousands of bananas they that transported there was such a dangerous game!
The third of June, two members of the Russian embassy in Istanbul got the banana, carefully extracted the usb key, ate the banana to destroy all evidence and flew to Moscow to deliver the app-files to top executives of Comon Games.
 
 

 

bananamania – breaking the rules

bananamania_carrousel_02

Our latest game is here. After the success of FootChinko any other studio would have done a sequel, but we decided to produce bananamania, surrealism in its pure state.

Hopefully players like it. We don’t know if it’s a good game, as players have to decide on that. But one thing is for sure: it’s a game that goes round and round in circles.

Its peculiarities start at the preload scene, as it lacks of the typical preload bar or a number measuring the loaded percentage. Progress is just a collection of unconnected dots that grow to conform a big pixel banana.

It’s original! We’ve taken the risk of not producing a match 3 or the clone of a successful mobile game, which is exactly what publishers love and finance.

Opposite to the html5 casual games currently published, it doesn’t target a particular kind of player. Everyone who is bored of playing clones of clones is welcomed to bananamania.

Its title is too long. Many publishers misspell the name when answering our emails.

The home scene is too elaborated and detailed, sometimes we think that we’ve invested more time on that scene than in the whole game.

No tutorial.

It lacks a story and its setting is unrelated to the game play.

The score text, which on any other game would be just readable and noticeable, gains prominence and spins, hurting even the game play itself by doing that.

3 of its 6 levels are hidden to the player, he/she doesn’t even know that they exist! and a semitransparent and disabled arrow button leads nowhere.

Its high graphic weight doesn’t correspond to its simple game play. Graphic assets and game play are quite unbalanced. The simplicity of the game mechanic rests value to the amount of work put on the pixel art, visual and audio effects instead of praising them (as a couple of publishers think).

The basis of the game mechanic is breaking the player’s flow continuously. Opposite of what game design books recommend, bananamania is ridiculously difficult and keeps on offering frustration without any rewards to the player (as real life sometimes).

The player can’t control the game characters, which is uncommon, just throw them bananas.

The player encounters hazards without previous warning.

And last but not least, maybe just one person in the world will be able to finish the game. So much effort on a single player in the era of the online masses, doesn’t make any sense from a materialistic point of view.

Too many contradictions in your head? Don’t go bananas and play bananamania. Here is the link:

bananamania

Ура! Ура! Social Foot Chinko has been launched!

footchinko_social_features

We are proud to announce that a social version of Foot Chinko has been released this week on Vk, the Russian equivalent of Facebook.

It’s our first game with social features and we’ve developed it for a cool Russian company called ComonGames.

We’ve gathered valuable experiences with the server side of the game. Social Foot Chinko represents a technical quantum leap for us, considering that not very long ago, we were wasting our time with hopeless dress up games…

Stepping up performance with TexturePacker

Companies are always thriving in order to step up their performance, and every little bit helps. In fact, we are no different. Thus, we like to pick up proper tools, matching to our needs. And our last decision was to implement TexturePacker.
texturepacker sprite sheet
TexturePacker is a spritesheet building software. And the best at it, if you ask us. Why? May you ask. Well, there’s a lot say then. We’ve tested pretty much all other options, both browser based or native software, and we came to feel what makes it different.
First of all it’s fast. Ridiculously fast. It takes less than half a minute to just take all your sprites and convert them into a functional spritesheet. Moreover, it’s also easy. Default settings fit in most scenarios, which really helps with newcomer fellows. And this can be extrapolated to anyone who wants to start building spritesheets as well.
Then, it is a powerful tool too. It lets you save your spritesheets in a wide pool of over 40 supported data formats. We mainly use JSON files, as we work with HTML5, but it also supports the most popular frameworks, like Corona, Unity or Cocos2D. It really has a lot of options to toy with in search of the blending or look you’re after, be it with preloaded settings, or adjusting values one-by-one. Special mention to the “Reduce border artifacts” option that prevents halos from appearing in OpenGL, which we found utterly helpful.
To sum up, it’s continuously being updated, keeping up with all the frameworks it works with, preventing those pesky incompatibilities that happen from time to time and mess up your day.
And last but not least, it’s low priced. We like to see it this way: A lifetime license that includes one year of updates costs around 30€. Then you can add up more years of updates for the same price.
Summarizing, we invested in TexturePacker because it  offers us ease of use and performance, at an affordable price for an indie studio.

TexturePacker is available on www.codeandweb.com.

It’s time to optimize the loading time of html5 games

Loading time is critical on mobile html5games. Some optimizations can be achieved by reducing the size and the quantity of the assets to be uploaded without giving up quality.

We’ll describe some of the basic things that can be done to minimize loading time. They are quite standard, followed by most developers and include optimizations on these fronts:

 

Audio – Code – Graphics

 

Audio

Our game Foot Chinko contains more than 30 audio effects, that’s a lot. We wrapped them in just 1 audio file with this open source application:
Tõnis Tiigi Audio Sprite on github

The resulting file is called audio sprite. Size wasn’t reduced but the amount of assets indeed, and this helped a lot to keep loading time low.

Game Engine – code

We are currently implementing Phaser for all our html5 games. Our cute Pocahontas Slots doesn’t make use of all the capabilities of this great and robust framework. It doesn’t need the physics module, for example. Instead of referencing this file in the index.html:

phaser.min.js (709kb)

we include the smaller:

phaser-no-physics.min.js (472kb)

Don’t forget to minimize your code too.

Graphics

Choose a good and unique resolution, all assets of your game will be dependent of this initial decision. We usually work with the iPad2 resolution, that is 1024 x 768 px. Our games look alright on desktop and devices with a big display without punishing players with smaller resolution devices.

Did you know about texture atlas?

http://en.wikipedia.org/wiki/Texture_atlas

A good program to generate them is Texture Packer. Once you’ve packed all the images into a texture atlas is time to compress the resulting png. We use an online tool called tinypng for that. This is the last step before releasing the production game.

In case you need a simple background image with a color gradient, for example, let’s say for the sky, generate a bitmap procedurally.

Foot Chinko: level design and game flow

Foot Chinko, our casual approach to football (soccer) games, has the biggest amount of levels ever seen on a Ravalmatic game (+90 levels). Editing them was a major effort per se, but then, arranging them properly wasn’t either a simple task. Without no particular literature about this specific stuff, here’s how we figured we could handle the task.

Foot Chinko level design

When you do level design it is key to have a tool that is visual and fast to use. The agility you have when building and testing the levels is very important to produce good stuff. If the task is a heavy and time consuming burden, the levels will consequently be designed in less iterations. That’s what happened in previous games of the studio resulting in more plain level design or an exaggerated amount of time invested on the task.

Enriqueto, had already used the Flash IDE as a visual level design layout that could be later parsed into data about items, their location and contextual level data (seconds, type of goalkeeper, etc.). Testing those levels was as easy as exporting the Shockwave file, running a json exporter, and testing the game on the browser.

Foot Chinko editing tools

Ivan then edited a huge amount of levels in several iterations, discarding some of them due to technical limitations, and getting the most out of sketched ideas and emerging game mechanics. Some of Foot Chinko’s levels felt more skill-demanding and some other had a more random development, but the general idea was to keep a wide variety of levels, offering contrasted flavors. While a random level could be more appealing for a casual player, as the game progressed, those levels should be gradually replaced by more technical ones. If the resolution of an advanced match was just in the hands of luck, the more experienced players could get frustrated. Speaking about Foot Chinko‘s difficulty, it’s really hard to keep objectivity, since your skills will probably be above the average user, so try to make some early testing during this stage of the level design process.

Finally, we printed cards of every single level we had. That helped us to have an overall look, and making groups of levels (passive/interactive, slow/dynamic, easy/hard) and then arranging them alternatively, considering the general difficulty progression during the whole game and the partial difficulty progression of each tournament. Placing the cards on sticky panels was really useful to identify visual patterns and also make agile tweaks. The final step is testing that level progression with players. With the help of metrics we’ll be able to notice if there are some particular tough levels that break the natural progression of the game.

panels featuring all levels in Foot Chinko(The plants had strong arguments about the game flow, but the plastic one showed a deeper analytic vision)  

There are probably better ways to deal with level designing and arranging, so we would be glad to hear your suggestions. Take care!