Create a Pong Game in HTML5 With EaselJS – Tuts+ Premium

Carlos Yanez on Jan 24th 2012 with 6 comments

Tutorial Details

Difficulty: Beginner
Platform: HTML5
Language: JavaScript
Software used: HTML/JavaScript Editor
Estimated Completion Time: 2 hours

It’s Premium tutorial time! This week, Tuts+ members will learn how to use the EaselJS JavaScript library (along with SoundJS and TweenJS) to create a version of the classic Pong game in HTML5.

Premium Preview

Click to play the demo

In this tutorial, we’ll create a clone of the classic game, Pong, in HTML5, using the EaselJS library. The game will have multiple screens, sound effects, and a (very simple) AI opponent.

Read the Full Tutorial

Premium members can access the full tutorial right away!

If you’re not yet a Premium member, you can still read the first few steps of the tutorial.

Tuts+ Premium Membership

We run a Premium membership system which periodically gives members access to extra tutorials, like this one! You’ll also get access to Psd Premium, Vector Premium, Audio Premium, Net Premium, Ae Premium, Cg Premium, Photo Premium, and the new Mobile Premium too. If you’re a Premium member, you can log in and download the tutorial. If you’re not a member, you can of course join today!

Also, don’t forget to follow @envatoactive on twitter, circle us on Google+, like us on Facebook, and grab the Activetuts+ RSS Feed to stay up to date with the latest tutorials and articles.

Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By Carlos Yanez

Rollover to read this author's bio or click through to see a full list of posts by this author.

Carlos is a Web/Logo Designer, Flash Developer with passion for great designs and cool applications.

Plus Premium

Wassim Ouartsi

Nice tut !
Ni AI, but really good !
james

Nice tutorial. But, the AI is very disappointing. It makes it too easy to win. Would have found it much more useful if you would have included a better AI system. Still not *bad* though.

http://michaeljameswilliams.com/ Michael James Williams

Fair point. Here’s a decent code snippet for a more “human” Pong AI. It’s in Java, but should be fairly easy to port to AS3 :)

james

Thanks for the link Michael. Looks dead simple to port over.
http://michaeljameswilliams.com/ Michael James Williams

Convert to JavaScript, I meant! Haha, old habits die hard…