http://www.brighthub.com/internet/web-development.aspxenhttp://www.brighthub.com/internet/web-development/articles/12615.aspxFri, 06 Nov 2009 20:48:47 GMTb133e95a-c263-4882-8f2a-b24547eff78e:12615MatthewCaspersonIn part 10 of the series we add the ability to display a scrolling tiled background. In part 9 of the series we added the ability to define a level structure using a series of timed function calls. This works well for placing enemies on the screen, but is not so useful for drawing the background level. In this article we will add the ability to ren...http://www.brighthub.com/internet/web-development/articles/12614.aspxFri, 06 Nov 2009 20:47:26 GMTb133e95a-c263-4882-8f2a-b24547eff78e:12614MatthewCaspersonIn this article we implement a system to define a level within the game. To this point our "level" has really just been one endless stream of randomly placed enemies. Obviously this is not ideal as it gives us as the developer no control over how the level plays out. In order for us to provide a structured level design we need a way to de...http://www.brighthub.com/internet/web-development/articles/11891.aspxFri, 06 Nov 2009 20:46:09 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11891MatthewCaspersonIn part 8 of this series we add some music and sound effects. In part 7 we added the ability to play animations, which then gave us some nice explosions. At this point we almost have something resembling a game, except for one: sound. In this article we will add some sound and music to the game. Fortunately for us Flex makes embedding, playing and ...http://www.brighthub.com/internet/web-development/articles/11890.aspxFri, 06 Nov 2009 20:45:07 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11890MatthewCaspersonIn part 6 we added collision detection. In part 7 we will add animations to allow us to include some nice explosions. In part 6 we introduced collision detection, which allowed us to destroy and crash into the enemies on the screen. But the enemies just disappeared, which was a little unsatasifying. In this article we will add animations, which in ...http://www.brighthub.com/internet/web-development/articles/11889.aspxFri, 06 Nov 2009 20:43:34 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11889MatthewCaspersonIn part 5 we added some enemies and gave the player the ability to fire it weapons. In part 6 we will add collision detection to allow the player to actually shoot the enemies. Collision detection is the ability to detect when two objects have collided, and then react appropriately. In part 5 we gave the player the ability to fire weapons at the on...http://www.brighthub.com/internet/web-development/articles/11016.aspxFri, 06 Nov 2009 20:41:43 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11016MatthewCaspersonIn part 4 of the series we added user input, and created a scrolling background to simulate flying over an ocean. In part 5 we will add some enemy fighters and player weapons. At this point in the series we have implemented enough underlying code to make adding new elements to the game quite easy. With GameObjectManager and GameObject classes handl...http://www.brighthub.com/internet/web-development/articles/11015.aspxFri, 06 Nov 2009 20:40:02 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11015MatthewCaspersonIn part 3 of the series we finally got to draw some graphics to the screen. In part 4 we will take this one step further and make the game object interactive. We will also create a background level that the player can fly over. The majority of Flash games tend to be quite simple in nature. They are 5 – 10 minute distractions that are played during ...http://www.brighthub.com/internet/web-development/articles/11014.aspxThu, 05 Nov 2009 18:02:10 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11014MatthewCaspersonIn part 3 we will add some graphics resources and display them on the screen. When writing a new program there is always a point where you first get to see the fruits of your labour. With the state and rendering “plumbing” now done we can start doing some fun stuff by adding graphics to our game and displaying them on the screen. But before we do l...http://www.brighthub.com/internet/web-development/articles/11012.aspxThu, 05 Nov 2009 17:58:48 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11012MatthewCaspersonIn part one of the series we created the initial Flex application class. In part two we will be adding states and a double buffered rendering process. In part one of the series we created the initial Flex application class. In part two we will be adding states and a double buffered rendering process. States are quite self explanatory: they represen...http://www.brighthub.com/internet/web-development/articles/40513.aspxMon, 26 Oct 2009 19:49:01 GMTb133e95a-c263-4882-8f2a-b24547eff78e:40513MatthewCaspersonIn part two we look at the remaining classes nessessary to finish off the basic JavaScript game framework. In part one we created the GameObjectManager class, which managed rendering to the canvas and allowed GameObject classes to update and draw themselves. Now lets take a look at the GameObject class. GameObject.js The purpose of the GameObject c...http://www.brighthub.com/internet/web-development/articles/14494.aspxMon, 05 Oct 2009 15:06:05 GMTb133e95a-c263-4882-8f2a-b24547eff78e:14494MatthewCaspersonA Silverlight development tutorial that shows you how to create your own 2D web based games. This series attempts to recreate a game originally developed with Flash, and can be used to highlight the differences between the two platforms. When it has come to displaying rich content on the web Flash was king. Its widespread deployment on Internet con...http://www.brighthub.com/internet/web-development/articles/14557.aspxThu, 01 Oct 2009 03:53:09 GMTb133e95a-c263-4882-8f2a-b24547eff78e:14557MatthewCaspersonA silverlight development tutorial that shows you how to create your own 2D games. This series attempts to recreate a game developed with Flash, and can be used to highlight the differences between the two platforms. In this article we will add keyboard input and start creating the game elements. In the last article we created some base code to dra...http://www.brighthub.com/internet/web-development/articles/14589.aspxThu, 01 Oct 2009 03:52:35 GMTb133e95a-c263-4882-8f2a-b24547eff78e:14589MatthewCaspersonA silverlight development tutorial that shows you how to create your own 2D games. In this article we implement collision detection. In the last article we created the basic elements we needed for the game like a player, some enemies and some weapons. However none of them could interact – the players bullets (and the player itself) would pass right...http://www.brighthub.com/internet/web-development/articles/15029.aspxThu, 01 Oct 2009 03:50:11 GMTb133e95a-c263-4882-8f2a-b24547eff78e:15029MatthewCaspersonA silverlight development tutorial that shows you how to create your own 2D games. This series attempts to recreate a game developed with Flash, and can be used to highlight the differences between the two platforms. This article shows you have to implement state management In this article we will take a look at state management. The term “state ma...http://www.brighthub.com/internet/web-development/articles/38364.aspxWed, 23 Sep 2009 23:51:10 GMTb133e95a-c263-4882-8f2a-b24547eff78e:38364MatthewCaspersonThe canvas element, along with some advancements in JavaScript engines, gives web developers the opportunity to create detailed and interactive 2D HTML web pages without any 3rd party plugins. This article introduces you to the canvas element, and describes some of its potential. HTML started life as a way to format a static page. Animated GIF imag...http://www.brighthub.com/internet/web-development/articles/11010.aspxWed, 23 Sep 2009 19:56:06 GMTb133e95a-c263-4882-8f2a-b24547eff78e:11010MatthewCaspersonGet started with Flash game development. This article shows you which tools to download and details the first steps in creating a Flash game using Flex and Actionscript. Getting Started With Flash Player and the Flex SDK Adobe has supplied everything you need to start creating your own Flash games. Creating a Flash game using Flex has several advan...http://www.brighthub.com/internet/web-development/articles/40512.aspxFri, 03 Jul 2009 18:32:52 GMTb133e95a-c263-4882-8f2a-b24547eff78e:40512MatthewCaspersonNow that we have seen how the canvas element can be used, it's time to start creating the framework that will be used as the basis of the final game. In part one we look at the first two classes/files that need to be created. By now we have seen what the canvas element is, how to use it and seen some effects that can only be created using t...http://www.brighthub.com/internet/web-development/articles/40511.aspxFri, 03 Jul 2009 18:32:44 GMTb133e95a-c263-4882-8f2a-b24547eff78e:40511MatthewCaspersonParallax scrolling is a technique that gives the illusion of depth to a 2D application. See how easily it can be implemented building off the framework that we have just created. Now that we have the beginnings of a game framework, lets do something fun with the canvas element. Paralax scrolling is a term used to describe a technique where several ...http://www.brighthub.com/internet/web-development/articles/39509.aspxMon, 29 Jun 2009 22:58:36 GMTb133e95a-c263-4882-8f2a-b24547eff78e:39509MatthewCaspersonLearn how to manipulate images in ways that were not previously possible using JavaScript and the canvas element. The last article demonstrated a basic implementation of the canvas element where an image was moved across the screen. While it was a simple example, the same effect could just as easily been achieved by modifying the properties of a ha...http://www.brighthub.com/internet/web-development/articles/38744.aspxMon, 29 Jun 2009 22:58:19 GMTb133e95a-c263-4882-8f2a-b24547eff78e:38744MatthewCaspersonSee how to draw to and animate the canvas element, with step by step example code and live demo application. Now that we know what the canvas element is , it's time to actually draw something onto the screen. First we need a HTML page to hold and display the canvas element. jsplatformer1.html The HTML is very straightforward. There are two importan...