EnchantJS – creating games with Javascript

January 20, 2014 Leave a comment

Last year I had a plan to start learning to create games with HTML and Javascript, and although I made some headway I got lost in the myriad of Javascript libraries. I tried CreateJS, which is free and good, but I felt it was a little complicated for teaching to my class, and I also looked at ImpactJS, which ended up being too expensive. I tried several other javascript libraries for creating games, but quickly ran into brick walls, suddenly unable to find quality tutorials or resources that were easy to understand.

Recently I discovered EnchantJS, which is described as “A simple JavaScript framework for creating games and apps”, and I am happy to report that it comes with some decent documentation that would be suitable for using with my students. Within a couple of hours I was able to implement some basic game elements with EnchantJS – sound, animation and input controls and finally felt as though I was getting somewhere with creating Javascript games. A bit more work is required to get a fully functioning game, but the tutorials and documentation I’ve discovered so far have been very good and have included excellent explanations (or at least better than for other Javascript libraries I’ve encountered).

For those of you interested in following this up, here are some of the resources I’ve found so far:

EnchantJS – download EnchantJS here. Also includes a starter tutorial that explains most of the basics very well.

Penguin Dive Tutorial – a step-by-step tutorial on making a complete game, with good explanations along the way.

CodeLeap – online tutorials on creating apps with EnchantJS. It’s in Japanese, so you may need to use Google Chrome to translate it to English. It has a browser based code editor that allows you to test your code right away.

Crash Course – created by Cal Poly, this course uses CodeLeap and takes you through the creation of a simple game.

Video tutorials – some video introductions to using EnchantJS.

Video showcasing some of EnchantJS features including OpenGL and 3D.

Slideshare on animation with EnchantJS.

Introductory tutorial (Japanese) covers the creation of maps. Google Translate does a good enough translation!

Advertisements

January Game

January 14, 2014 Leave a comment

My plan is to do fewer games this year for One Game A Month, but these games will be bigger and better than anything made last year. At present I’m planning two games – the first is a top-down shooter and the second is a point and click adventure. My plans may change, and I may do some small games each month depending on the optional themes at #1GAM.

The top-down shooter is a project I’m working on with my Game Development students. They’re making maze games and some are adding features such as roaming baddies, shooting, combat and object collection. The game I submitted for January’s #1GAM grew out of the college project, as some students wanted to learn how to make a top-down shooter game. The working title is ‘Spawn of the Dead’, and the object of the game is to survive as long as you can against endlessly respawning zombies. My plan for the game is to add more levels, features, better graphics, sounds and a storyline, completing the game around May or June. You can play the current game (Flash required).

Spawn of the Dead game

The player movement was simple to implement, with the rotational movement and shooting the trickiest part so far. This is all working adequately, so my next task is to work on the zombie AI. At present the zombies simply run towards the player. This presents a small problem as sometimes the zombies overlap each other and get stuck behind walls. I’m trying to figure out a way to get them to behave more intelligently, perhaps moving in different directions if they collide, and trying to find ways around obstacles if they become stuck. I’m not sure how to implement this – perhaps they will have different ‘states’ – seeking the player, avoiding other zombies and seeking a new route. AI is not something I’ve used much, so this will be a bit of a learning process for me. I’m planning to do a few test games to try out different methods of implementing the AI.

Sketch of game

Original game concept sketch

Addendum: testing of the game has identified a fundamental flaw, in that the player can stand in a spot where the zombies cannot get them. This means that the timer can keep counting continuously and astronomical scores can be achieved! This will be fixed by changing the timer to a ‘number of kills’ score.

Reflection

December 29, 2013 1 comment

The original purpose of this blog was to reflect on my Game Design classes and provide information and help to others teaching game design. However for the past year I’ve been distracted by One Game A Month – a challenge to create one new video game each month of 2013.

I am pleased to say that I completed the challenge and hope to be in the top 10 of participants when the year ends. At time of writing I’ve slipped to position 3 in the top 100 high scores after keeping the top position for over three weeks.

no1

My original aims were to begin creating games with Adobe Flash and by the end of the year have learned enough HTML5 and Javascript to start creating games with those tools. This hasn’t happened unfortunately as the learning curve has been too steep for the short time I’ve had. Still, I managed to create 12 decent, playable games during 2013 and the practice has made me a much quicker programmer, with my last two games taking me only a few hours to create rather than days. Despite that, the games I’m most proud of are actually the ones I created at the start of the year. I had clear plans for these as they were intended to be used as educational games on the King Robert the Bruce website.

One Game A Month will continue in 2014, but at this time I’m not sure how much I will participate. Apparently the focus will be more on creating and updating games rather than making discrete games each month. This may fit in with my own personal plans, as during the next year I aim to create a game for the Android platform and have it available for purchase on Google Play.

For those of you who are interested in my computer games class (I’m teaching NPA Computer Games Development, Level 5), all of my students passed the Game Design unit and are making good progress in the Media Assets unit. Most of the students are working on creating maze-based games in Adobe Flash and one student is working on a 3D game using Blender. Top-down shooter games are the most popular genre this year, with bank heists, prison breaks and zombie survival being the most common themes. My students have been keeping a close eye on my progress in One Game A Month, and at the end of term they gave me a round of applause when they found I’d made it to the number 1 spot in the high scores. It was one of my most treasured moments of 2013, and I hope I can continue inspiring my students throughout their time at college.

The final stretch

December 2, 2013 Leave a comment

It’s December and the final #1GAM challenge has been issued. Three optional themes – FROZEN, SECRET, KITTY.

11 months of limbering up has paid off and my creative juices are already flowing, coming up with ideas to fit the themes.

Here’s my pixel kitty who will star in my final game of 2013.

pixel graphic cat

Categories: OneGameAMonth

A busy year…

October 24, 2013 Leave a comment

top5One game a month? Impossible!

It certainly seemed that way back in January, however here I am in October with 10 games under my belt. Few of them are ‘complete’ games. Most are just demo’s or have a single level, but each month I’ve tried to do something different, and this has stretched my game programming abilities and forced me to rethink old practices.

With over 6000 participants and over 4000 games posted to the site, One Game A Month has proven to be both a successful and educational adventure. I even managed to creep into the top 10 high scorers a couple of times, with my best position, number 4, being reached just this month.

Please try my games. They can be found at my One Game a Month profile page.

Categories: OneGameAMonth

HTML5 Games Development

HTML5_Logo_256With the support for the Adobe Flash Plugin in web browsers slowly being eroded, many game developers are looking towards alternative tools for creating web based games. Unity has become a popular choice, but again due to its reliance on a web browser plugin, its days may be numbered too. The current tools of choice for web based games seem to be HTML5 with Javascript.

With this in mind I have began learning to create games with these tools, and aim to write a series of tutorials to help others get to grips with them.

There are several Javascript libraries available to make the implementation of Javascript games easier. Impact.JS, CreateJS, LimeJS and Crafty are just a few of these libraries, some of which are free to use and some of which require licensing. I have decided to start with CreateJS as it is free and is designed with a syntax which is close to ActionScript (which makes it easier for Flash coders like me to use).

Although HTML5 games can be made with lots of different tools, there are great reasons for continuing to use Adobe tools in their development. Adobe Dreamweaver is useful for writing the HTML and Javascript code, and the Live view allows you to test your games within Dreamweaver, negating the need to use a web server for testing. Also, Adobe Flash CS6 with the CreateJS toolkit can be used for creating graphics and animations that can be used in your HTML5/Javascript games.

The following links are to tutorials I’ve used to gain some knowledge of HTML5 game development.

Creating a Pong Game with Create JS

Animating sprites with EaselJS (part of the CreateJS suite)

Getting started with CreateJS Toolkit for Flash

#1GAM April – latest game development

April 12, 2013 3 comments

After a break of a few weeks I’m back into development of my next game for OneGameAMonth.com.

April’s game is about escaping from a dungeon. Continuing the theme of my previous games, this new game is about a medieval Scottish knight trying to escape from an English dungeon. Knights and nobles were often taken prisoner by invading armies so that their wealthy families would pay a ransom for their release. In the game you are such a knight, captured and imprisoned awaiting ransom. However your character has some vital information for King Robert the Bruce, so must try to escape to warn him of impending danger. Whilst trying to escape you also have side tasks of gathering information about King Edward II’s plans to invade Scotland.

Here’s a short clip showing the basic gameplay and mechanics. The player character and enemy characters will be different in the final game.