Blog Action Day: Clean up With a Beautiful Watery Game
videos

Blog Action Day: Clean up With a Beautiful Watery Game

Tutorial Details
  • Program: Flash
  • Screencast Duration: 80 mins

It’s October the 15th and Activetuts+ is again taking part in Blog Action Day! This year we’re aiming to raise awareness about clean water and water conservation. In today’s screencast, we’ll be building a vertical scrolling game, with a very watery feel..


Blog Action Day

First and last, the purpose of Blog Action Day is to create a discussion. We ask bloggers to take a single day out of their schedule and focus it on an important issue. By doing so on the same day, the blogging community effectively changes the conversation on the web and focuses audiences around the globe on that issue.

Screencast: What’s Covered?

In this screencast you’ll learn how to setup and use PerlinNoise with the DisplacementMap filter to create a water-like effect. You’ll learn how to use the KeyboardEvent to listen for keys being pressed and create smooth motion of the object in response. We’ll cover how to use the hitTestObject to test for collisions and finally we’ll create a particle system class with watery wake-like behavior.

There’s loads to cover, so let’s dive in!


Part 1: Introduction

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 2: Foam Particles

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 3: Keyboard Movement

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 4: Logs

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 5: Trash

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 6: Adding Objects to the Stage

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 7: Scoring

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!


Part 8: Wrapping Up

Don’t like ads? Download the screencast, or subscribe to Activetuts+ screencasts via iTunes!

Franci Zidar is ProximaDD on Activeden
Tags: Videos
Add Comment

Discussion 7 Comments

  1. Ian Yates says:
    Staff

    Don’t forget to check out what the other Tuts+ sites have been up to for Blog Action Day :)

  2. kamal98 says:

    This looks very interesting we need more video tutorial like this that takes you through the whole game design process.

  3. Michael says:

    This would have been better if it were in flash cartoon format. Unfortunately, the bitmap rich images while cool, really chug along slowly in most browsers. Looking forward to redoing in vector flash to see how well the effects look in that format.

    • Franci says:
      Author

      The performance is due to DisplacementMapFilter with the PerlinNoise being quite big. Since water is the theme I went with it because it really looks nice, you could make it smaller and it would increase the performance considerably, it’s a balancing act. Complex vectors generally perform much worse then bitmaps so that shouldn’t really be an issue.

  4. Love your tutorials, Franci!! Nice game with nice graphics. Works just great!

  5. Alex says:

    How do I get rid of the shadow effect put on the boat, trash…?

Add a Comment

To add a code snippet to your comment, please wrap your code like so: <pre name="code" class="html">YOUR CODE</pre>. You can replace the class name with "js," "css," "sql," or "php." If there are any "<" or ">" within your code, please search and replace them with: &lt; and &gt; respectively.