Posted by & filed under Games, Motion Graphic, Web Design.

Easel JS is a javascript framework for HTML5 Canvas that gives it a display list like you would find in Flash. Download EaselJS from here.

These tutorials have been designed to take you through the basics of using Easel JS, making a simple game that introduces interactivity and creating animated content.

1 – Getting started with EaselJS

Adding text and images to the Canvas element, then make it move. Take a look at the finished example here.

Download assets here.

2 – Creating a simple clicking game with EaselJS

IMPORTANT – getObjectUnderPoint – only works if HTML file is on a web server, unless you use SAFARI

Click on spaceships to make them disappear and stop the invasion. View the finished file here.

Download assets here.

3 – Creating Sprite Sheets for Easel.JS with Zoe

Create sprite sheet from Flash assets. View the finished file here. Use arrow keys to walk left and right.

Download assets here.

4 – Working with SpriteSheets in EaselJS Tutorial

Control a character walking left and right with arrow keys. View the finished file here.

Download assets here.

Let me know if you want any more, I have code ready to go for a platform game demo.

Leave a Reply