game dev

Ludum Dare is great! Not just because it motivates me to create (and finish) a new game, but also because I use it to update Creatine. So, as usual, after the compo I’m releasing another version creatine, now the release 1.0.0!

This version is big. It has a lot of new stuff and a lot of changes for the old features. But before talking about the modifications and additions to the library, let me talk about how I was felling about creatine 0.2…

To be honest, I wasn’t happy about the previous version, I added several classes to handle storage, sound, layout, scenes, among other things. But they weren’t working together, there were some annoying bugs (in special with transitions) and I was spending a good time rewriting the same base structure for new games, over and over.  So I decided to rethink some things: how can I make my development easier and faster? My conclusions and desires after that:

  • I want to use a visual editor to build my scenes, something like Overlap2D or one tool of my own.
  • I need more flexibility for fast prototypes (sometimes I just want to test some idea).
  • Modularity is cool, but is not a great deal. A class that controls all modules would be more useful and would save some time by eliminating the base common structure that I was rewriting every project.
  • I need more fluffy things, more juice, which means that have to be easy to add particles and visual or sound effects to the game.
  • I want to have a physic system and other predefined behaviors easy to use in my games (such as a platform system, or 2d top-down movement and collision system).
  • Other details that I don’t remember right now (it is Sunday 11PM, give me a break!).

With these things in mind, I started to update creatine.

Game

The main addition to creatine is the Game object. The game is now the core of my library, because it is the responsible to create and initialize all game systems. For example: it is the game that creates the canvas element; the game also stores all creatine helpers (now called managers), such as the director (SceneManager), the device,  display and many others.

The game class is based on Phaser core, so if you know Phaser you may find this familiar. A game has 5 states: ”boot”, “preload”, “create”, “update” and “draw”. In the boot state you can initialize 3th-party libraries and some configuration of the engine. In preload, you will set which files should be loaded by the engine and may be show a preload scene. In the create state you will create and initialize all game objects, including scenes and object pools. The update and draw states are the main loop, and are executed every tick. You can use these state by passing functions to the game:

var game = new tine.Game(null, {
  boot    : function() {},
  preload : function() {},
  create  : function() {},
  update  : function() {},
  draw    : function() {}
})

The first argument of the Game class is the configuration object. This could be only an url to a JSON file containing the configuration. Notice that, with this, I will try to keep all engine data-driven, so you will be able to configure everything using this parameter. Right now, it has the following default values:

{
  project          : 'creatine_game',
  width            : 800,
  height           : 600,
  container        : null,
  framerate        : 60,
  background_color : '#000',
  resources        : {
    base_path : './',
    manifest  : []
  }
}

To set configuration you can do:

var game = new tine.Game({framerate:30, width:300, height:500});

or yet:

var game = new tine.Game('myconfig.json')

where ‘myconfig.json’ is the json file containing the configuration values.

Resources and Factories

Creatine now have an interface to PreloadJS (the ResourceManager) and a factory manager. The resource manager helps you to load general assets in a more pleasant way and also helps you to load specific assets (such as spritesheets and audiosprites) in an easier way. For example, now you can set which files you want to preload in the preload state:

var game = new tine.Game(null, {
  preload: function() {
    game.load.image('id', 'src.png');
    game.load.spritesheet('id2', 'src.png', data);
    game.load.json('id3', 'data.json');
    ...
  }
});

Or you could define these assets in the manifest (pretty much like how you do with PreloadJS):

var game = new tine.Game({resources: {
  manifest: [
    {id:'id', src:'src.png'},
    {id:'id2', src:'src.png', data:{stuff here}, type:'spritesheet'},
    ...
  ]
}});

With your stuff loaded, you can create objects easier:

var game = new tine.Game(null, {
  preload: function() { ... },

  create: function() {
    var bitmap = game.create.bitmap('id', {x:100, y:400, regX:'center', regY:'bottom'});
    var sprite = game.create.sprite('id2', 'animation');
    var map = game.create.tilemap('id3');
  }
});

 

Scenes and Transitions

Scenes now have some default method that you should override to use, such as “enter”, “pause”, “resume”… To create a scene, you must define a new class inheriting the scene class, an easy way to do that is by using the new shortcut:

var MyScene = tine._scene({
  initialize: function() { ... },
  enter: function() { ... },
  update: function() { ... },
  ...
});

You can also create your scenes before starting the application and register them to the director, using an unique identifier:

var game = new tine.Game(null, {
  create: function() {
    // Create scenes here
    ...

    // Add your scenes to the director
    game.director.add('menu', new MyMenuScene());
    game.director.add('level', new MyLevelScene());

    // Run a scene
    game.director.replace('menu')
  }
});

Transitions are now working as they should be! You can use any transition in any function (replace, push or pop), repeatedly, or without having to wait the current transition.

Input handlers

We have input now! Keyboard, gamepads, mouse and touch. They don’t work together yet, but they are pretty cool already. Instead of putting code here, I suggest that you take a look into the creatine example folder and into the API documentation.

In the next releases I want to create a common Input or Control object that group all type of inputs together. So instead of checking the state of the keyboard, mouse and touch, you could simply check game.control.isDown(‘action a’) . Moreover, you should be able to redefine the input commands.

Particles!

Particles are so so so so cool! Creatine uses the cocos2d particle style. So if you want to create some fire you do:

var emitter = null;

var game = new tine.Game(null, {
  preload: function() {
    game.load.image('particle', 'assets/particle_red.png');
  },

  create: function() {
    var image = game.create.bitmap('particle', {regX:'center', regY:'center'});
    emitter = new tine.Emitter(image, 500);
    emitter.emitX = 512;
    emitter.emitY = 288;
    emitter.angle = -90;
    emitter.angleVar = 10;
    emitter.speed = 100;
    emitter.speedVar = 20;
    emitter.life = 2000;
    emitter.lifeVar = 500;
    emitter.emissionRate = 150;
    emitter.startScale = 0.3;
    emitter.compositeOperation = 'lighter';
    
    emitter.start(-1);
    game.stage.addChild(emitter);
  },

  update: function() {
    emitter.update(game.time.delta);

    if (game.mouse.isDown(tine.buttons.LEFT)) {
      emitter.emitX = game.mouse.x;
      emitter.emitY = game.mouse.y;
    }
  }

})

Unfortunately, the current particle system has some limitations. For example, it cannot change the particle colors due to performance. It also must be updated manually, sometimes I forget that!

Sounds and Storage

The SoundManager is simpler now, it does not separate music from sound effects, but you still can add sound groups to it. The coolest thing is that sound works together with the StorageManager, so when you change the volume or the mute, the sound manager stores this information locally and you don’t have to worry about that anymore!

Legacy Stuff

Some things will be changed to a better structure, such as the layout managers and the custom display objects. They are still in creatine but they weren’t updated this time.

Moar of Creatine

To now more about new stuffs in creatine, check it out:

You can also contact me for any doubt or suggestion.

Read more

So, I finally decided what to do for this ludum dare, which has the theme “unconventional weapon“. My weapon of choice is “Democracy“, a humble tribute to Heinlein’s novel – and, of course, the Verhoeven’s movie – Starship Troopers.

Player controls an invasion operation at a distant planet, inhabited by big insects , in order to spread “democracy” through the galaxy. The player must exterminate the insects and collect the planet resources to win.

This is what looks like for now:

sample1

Read more

As the first post of the year, I wish you all a great 2015!

This last year was crazy, lot of changes in my Ph.D., several projects, great trips. As a reminder to myself, I will summarize my activities of 2014 relevant to this blog and record the promises of new year`s resolution for 2015.

2014

In April of 2014 I created this blog with 2 things in mind: I wanted to motivate myself to keep a frequency in my Game Dev studies by forcing me to always write a new articles here; and to serve me as a development diary so I could put ideas and thoughts here and after some time, I could revisited all my steps towards game industry. After 9 months, I wrote 39 posts and got more than 11 thousands views. I received some feedback (less than I wanted and more than I expected), via comments here and email. I thank you all for the audience, feedback and discussions.

In the half of the year I finally decided what to do in my Ph.D.. After months of (almost) unfruitful areas, researches and experiments, I decided to move on and research something related to game AI development, but with the requirement to also have something to do with robotics (there is a lot of methods and models fulfill that!). After some weeks of research and lot of readings, I decided to go in the direction of Behavior Trees, once it has some nice successful applications and big support on the game industry and now its being applied on robotics.

In consequence of my developments in the Ph.D. and my studies on Game Dev, I started 2 open source projects: Creatine and Behavior3JS. Creatine is my set of tools to develop games within CreateJS, while Behavior3JS is an implementation of Behavior Trees to JavaScript. I use Creatine to create my games while I use Behavior3JS to games and to my research. B3 received a lot of attention since its release (about 2 months in this moment), it already has 32 stars and 5 forks on github (it is my most-successful project).

Talking about games, I created 3 games for ludum dare but didn’t complete a few others. I’m really happy with my games this year – despite the unfinished ones – they weren’t great games but they have their importance to me. The last game of the year was Baa-Ram-Ewe, which earned the #35 place on the competition (there were more than 2600 submissions), I am really happy with this result and I hope to do better next time.

2015

For this next year, I want to:

  • Publish some papers about BT and machine learning;
  • Update and improve Creatine and Behaivor3JS;
  • Write more than 40 posts here in the blog and receive more than 11000 visits;
  • Write more ludum dare games and finally finish some full game;
  • I plan to work on the game industry, so I decided to learn – really learn – C++.

I thank again for all comments, talks, suggestion and critiques, on this blog, reddit, github and any other mean.

Read more

Ludum Dare 31, the last jam of the year, ended up very well for me. I created “baa ram ewe“, a game where you must herd sheeps with the mouse, moving them from a thin grass to a plentiful pasture. The game has a good – and solid, for an experimental game made in 48 hours – mechanics and a good overall aesthetics, I really liked the final result of this game. I also received a lot of positive feedbacks, mostly asking me to create a mobile version, which I decided to do.

Baa Ram Ewe uses a boiding algorithm (also known as flocking algorithm) to move the sheeps, to keep them together, and to avoid obstacles and dangerous elements. The boiding algorithm is a method to simulate collective movement of animals, such as fishes, birds, sheep, etc. For example, take a look a the following video, which shows a simulation of buffaloes running:

The algorithm is very simple. All agents in the simulation follow a set of simple rules. These rules defines how each agent will move accordingly to its neighbors flock-mates. The interaction between the agents generate an emergent behavior, as you can see in the video.

The rules used in these kind of simulation are really simple. Commonly, all boiding applications have the following ones:

  • Separation: the agent must avoid the nearest flock-mates by steering away from them;
  • Alignment: the agent try to head to the average position of the nearest flock-mates;
  • Cohesion: the agent try to move to the average position considering the nearest flock-mates;

You can see a visual example of these rules on the figure below (copied of the Craig Reynold’s site, the creator of this algorithm)

boiding_rules

(a) separation rule; (b) alignment rule; and (c) cohesion rule. From (http://www.red3d.com/cwr/boids/)

In Baa Ram Ewe, I used the algorithms presented by Conrad Parker in his site as basis. Summarizing, I have a FLOCKING function that moves the sheeps accordingly to a set of rules:

FUNCTION FLOCKING
  VECTOR v1, v2, ..., vN

  FOR EACH boid IN boids
    v1 = rule1(boid)
    v2 = rule2(boid)
    ...
    vN = ruleN(boid)

    boid.velocity += v1 + v2 + ... + vN
    boid.position += boid.velocity
  END FOR EACH
END FUNCTION

As you can see, you can define any number of rules, but be careful with that! More rules mean more complexity, you probably won’t be able to generate the behavior you want. Check it out the Conrad Parker site to a nice description of the basic rules.

See

 

 

Read more

Following the new milestone of CreateJS, I just released Creatine 0.2.0!

This version has some cool new additions to the library:

  • Tile Maps: now you can load maps created with Tiled by using the new TMXMap. It supports all maps projections of tiles (orthogonal, isometric and staggered) and all type of layers (tile, image and object). Check it out the examples.
  • Jukebox: a helper class to handle music and sound playback. With this class, you can set different volume setting for music and sounds, and play random sounds from a group.
  • Storage: a helper class to handle persistent data using the HTML5 localStorage. With this class you overcome the type limitation in localStorage (it only accept string variables) and , thus, can save and retrieve objects, numbers, arrays, etc.
  • Entity-Component-System: a ultra basic implementation of ECS model, I hope to provide more features in the future.

Moreover, there are some other modifications on the existing features:

  • Sizers now manage scale and registration point properties of children.
  • Fixed an initialization bug present in several transition.
  • A complete update to the class and inheritance model of creatine, following the new style of CreateJS.

Together with this new version, I also published the new website for creatine (the old one http://guineashots.com/creatine now redirects to the new site):

http://creatine.guineashots.com

Right now I’m updating my boilerplate to follow the new releases and to include a new improved architecture.

Read more