1. Technology

HTML5 Canvas by Steve Fulton and Jeff Fulton

Learn to Use CANVAS for Online Games

About.com Rating 5 Star Rating

By

HTML5 Canvas by Steve Fulton and Jeff Fulton

HTML5 Canvas by Steve Fulton and Jeff Fulton

image courtesy PriceGrabber

Bottom Line

Learning to use the HTML5 canvas can be tricky. There is a lot to know and understand. But this book covers how to use the CANVAS element in great detail. It's easy to read and moves through the basics of drawing on canvas through intermediate and advanced features in a smooth and logical fashion. By the time you finish this book you'll have created games on canvas with sound, animation, video, and more. Learn how fun the CANVAS element can be by reading this book. I can't recommend it highly enough if you want to learn how to build games with the HTML5 canvas.

Pros

  • Very easy to follow—takes you through the different things you can do with canvas in a logical fashion
  • Goes into detail to help you learn all you can about the CANVAS element
  • You will learn how to build a working game in a canvas
  • And even how to make that game mobile with PhoneGap

Cons

  • The only con is that this book is very dense. It's not a book for beginners or people who are afraid of JavaScript.

Description

  • Chapter 1 introduces the CANVAS element and how to use it in your HTML. It explains the basics of HTML5 and how JavaScript will make your canvas come alive. You will even create a “Hello World!” canvas.
  • Chapter 2 helps you draw on the canvas. You will learn lines, shapes, paths (for circles and arcs), transformations, filling objects with flat color, gradients, and patterns, and even how to create shadows on canvas shapes.
  • Chapter 3 works with text on the canvas. You learn how to display basic text, change the font, add shadows, gradients, and patterns.
  • Chapter 4 helps you add images to your canvas. It also introduces you to simple cell-based animation and how to apply some transformations to your images. This chapter also shows how to use images as a pattern and how to manipulate the image by zooming, panning, and manipulating the pixels with the Pixel Manipulation API.
  • Chapter 5 moves into animation. You will learn about the physics of animation in a canvas, and how to make your drawings move on the screen and bounce off the walls of your canvas. This chapter goes into detail about how to work with physics in the canvas engine, which will become important when you're building canvas games.
  • Chapter 6 introduces adding HTML5 video to your canvas. It includes a quick overview of using HTML5 video and then goes into more detail about how to embed your video in your canvas. I especially like the video puzzle game you learn to build in this chapter.
  • Chapter 7 introduces audio to your canvas. There is a little about the HTML5 AUDIO element. You also learn how to play sound without any element at all by using JavaScript to insert it into the DOM. You also learn how to create a canvas audio player.
  • Chapter 8 looks at games in the HTML5 canvas. It compares HTML5 to Flash for games and explains the benefits and drawbacks to using canvas for games instead of Flash. Then it goes through the basic mechanics all your games will need in order to function well, including: graphics, animation, transformations, game physics, and a basic framework for your game.
  • Chapter 9 teaches you how to use a step timer to add sound to your bitmap games. This chapter takes you through all the steps to build another canvas game with sounds as well as images.
  • Chapter 10 teaches you about PhoneGap and how to use it to move your games from the big screen to the little screen—mobile devices. It doesn't talk about Android, but it goes into detail for moving your game to iOS devices like the iPad and iPhone.
  • Chapter 11 describes more advanced functions of canvas including 3D (all the above games were in a 2D context) and multiplayer games.

Guide Review – HTML5 Canvas by Steve Fulton and Jeff Fulton

The HTML5 CANVAS element is a very exciting new feature of HTML5. It moves game development on the web to a whole new platform. There is so much you can do with canvas that even one long book isn't going to cover it all. But this book definitely makes a good dent.

The primary focus of this book is developing games in the HTML5 canvas. And since this is one of the most enjoyable features of this element, it makes the book fun to read and experiment with.

I would strongly recommend that you read this book in order, and try all the examples so that you're not confused when you get to later portions of the book. It is not a reference book, although you can use it that way. Instead it takes you through how to do things with the HTML5 canvas step by step, and nearly every chapter has a sample game for you to build.

This book was a lot of fun to play with and I can't recommend it highly enough if you want to learn how to build games with the HTML5 canvas.

Disclosure: A review copy was provided by the publisher. For more information, please see our Ethics Policy.
  1. About.com
  2. Technology
  3. Web Design / HTML
  4. About.com: Web Design / HTML A to Z
  5. Books
  6. HTML5 Canvas by Steve Fulton and Jeff Fulton - Book Review

©2014 About.com. All rights reserved.