HTML5 game development blog

<!-- a HTML5 game development blog -->


twitter account

Thursday, October 8, 2015

JuJu Frog - a Game for Android made with Unity

Hi guys I made another little game for Android using the Unity engine with my friend Ivan you can find his blog and work here:

The game is free and you can find it on the Google Play Store. It's kind of an endless runner or jumper as you will with frogs, so what is there not to like just hop away. 

-Try the game here it's free-

Wildlife frog footage.

Wednesday, February 18, 2015

A Little Game I Made - Trivaders for Android

Hi guys I made a little game for Android using Unity3D (the free version of it) you can find it on the Google Play Store for free. So if you like you can check it out. If I have time I'm gonna do some tutorials on how some aspects of it were made or if something interests you fell free to ask I can always answer some specific question.

- Try the game it's free -

Trivaders for Android

Wednesday, October 9, 2013

Update - New versions of EaselJS and PreloadJS

So new versions of the libraries EaselJS and PreloadJS are out and I updated the tutorials to use them. No harm done we just changed the code that calls the libraries to use the new versions, no other changes were needed.
You can get them here:!/CreateJS

Also you can read more about the changes here for EaselJS 0.7.0:
and here for PreloadJS 0.4.0:

So feel free to explore and now we can move forward with our tutorials because we had to wait for the new versions of the libraries for some of the bigger changes, so stay tuned.

Monday, July 22, 2013

Tutorial 3 - Dragon of Bosnia: Classes in JavaScript - Making a Loading Bar Class

So this tutorial is on classes, I guess you know that they are quite important when it comes to programming and i hope you know what they are already, but we will do a little recap, so we can move on confidently to the game programming stuff. We will also make a class out of our loading bar from the previous tutorial so we can change it quickly to our liking.

Short introduction to classes and objects
When i learned about classes in school i remember that in a textbook they where explained with an example using cars. I guess that's good everything explained using cars is quite understandable, we all know cars. But I am bad at drawing cars so I will use trees instead to explain the concept. 

We know what trees are, they are big, they grow, have leafs and we can chop them down and make furniture. So that are the basics of being a tree but there are all sorts of them out there, a tree can be a oak, a pine or a palm tree which are all quite different but have the same basic properties in common like the having leafs thing and being chopped down for furniture. 

So our Tree class would be a basic concept a template of sorts of what a tree is with it's properties and methods, and we can use our Tree class to create specific tree objects (or instances) like a pine tree or a palm tree which are different from one another in some of the properties but both are still trees and inherit from our class.


Tuesday, June 25, 2013

Tutorial 2 - Dragon of Bosnia: Preloading Assets and Creating a Loading Screen Using PreloadJS and EaselJS

This tutorial will be on preloading assets as the title already says. If you read the previous one (Tutorial 1 - Basic HTML, Canvas and EaselJS) you have seen that our code is executed faster then the images are downloaded and we end up with a blank canvas until we refresh the page, so we have to make sure all our assets are loaded before we execute any code. To do this we will use the PreloadJS library which has some nice features to help us in our quest. You can find the PreloadJS library here: 
Here is a preview picture of how our loading screen will look like:

Preview picture of our finished loading screen

Fancy ain't it, so now that we know what we will be doing lets get started.

Thursday, June 13, 2013

Tutorial 1 - Dragon of Bosnia: Basic HTML, Canvas and EaselJS - Drawing Images to Canvas

So in this first tutorial we will make a html canvas element and draw something in it with the help of the EaselJS library. Nothing interactive right now just the basic stuff so let's get started. And here is a preview picture of what our canvas will look like at the end.

tutorial 1 - canvas html preview picturee
Preview picture of our finished work in tutorial 1.

First we create a simple HTML file in which we load the necessary Javascript and create a canvas element.

Wednesday, March 27, 2013

Prelude to the Real Stuff (Tutorials on Programming and Such)

Hi, so where should I start.

Recently I began working with a friend on a game for his newest short movie. Actually it started of as something like a Google doodle but ended up being a game of sorts. So i thought about sharing my experience on making such a thing with all the good people on the Interweb.

So basically it's a game that runs in the browser (using all the goodies of HTML 5 and JavaScript). If you like you can find the game here:

CLICK TO PLAY THE GAME (it's a work in progress).

You can also find the code of this version of the game on GitHub:

Screenshot  from the game

If you are intrested in the movie it is based upon here is the production blog of that one

So now to the more important stuff. From now on I will make a series of tutorials explaining how I made that  game (or a little bit simpler version of it) and give you all the source code as well so you can use it for your own projects. I guess this tutorials will be useful to get you started. In the future I plan to make more tutorials not based on this particular game but based on different games of different genres I will be making alongside you. I hope that it will be useful and that you like it.

So stay tuned for HTML and JavaScript galore.