Create a flash movie like Linkin Park one

When I was looking at Linkin Park homepage, I was impressed by the intro. It’s very simple but very nice.

Linkin Park

To do something similar, we need four elements:

1) A b/w photo with an high contrast
2) PhotoShop
3) Flash
4) An awesome music track

Finding the photo

It’s quite easy to find (or shot) a photo… just remember it should have an high contrast between the white background and the black foreground.

I browsed some photos at flickr and found this one.

Very nice.

Now it’s time to open…

PhotoShop

What we need is a cloudy seamless semi-transparent background.

Let’s begin with the “cloudy seamless”.

To have a cloudy samless background, we need to create a document whose x and y sizes are divisible by 256.

Since we need to remove the seam only to the horizontal size, let’s create a 1024*800 document. Then press “D” to restore default foreground and background colors (or have them to black and white in any ohter way) and apply a Filter -> Clouds filter.

You should have something like this

Then, create a new layer and fill it with white. Add a layer mask to it and with the gradient tool make it transparent about in the vertical middle of the image. Then press Ctrl-E to merge layers.

Now you should have something like this:

Now, create a new layer and paint it black. Add a layer mask and do the same thing as before, but make it transparent in the last upper quarter ot the image. Then press Crtl-E to merge layers.

This is what I have now:

Now Ctrl-I to invert the image, Ctrl-A to select the entire image, Ctrl-C to copy it, then select the Channels palette and click on “Create new channel”.
A new channel named “Alpha 1” should be created. Select it and Ctrl-V to paste the image.

Return to the Layer palette, create a new layer and fill it with white. Then on Photoshop menu go to Select -> Load Selection and in the dialog box under “Channel:” choose “Alpha 1” then press “OK”.

Then press “Del” on your keyboard to delete the selection. Make this layer the only layer visibie in the document.

You should have something like that:
(note: the red/green squares means the document transparenct)

Save this image as PNG-24 with transparency and close Photoshop.

Flash

Create a new document with the same size of the “flickr” image and import the image on stage.

Then create a new movieclip and import the “fog” image you created. Duplicate the movieclip to have 2 “fogs” and from now on it’s just motion tweening with a initial tween to lower the fog and then a loop to cycle between the first moving for and the second one.

Basically, when a fog starts leaving the main scene, because it is moving to the left, the second one comes from the right. When the second is leaving to the left, the first comes back from the right… and so on, in this way

Now you only need an awesome music like the one Linkin Park can play… but I am not sure I will be able to write a tutorial about it… so download the source code (with the png file) and give me feedback.

Get the most popular Phaser 3 book

Through 202 pages, 32 source code examples and an Android Studio project you will learn how to build cross platform HTML5 games and create a complete game along the way.

Get the book

214 GAME PROTOTYPES EXPLAINED WITH SOURCE CODE
// 1+2=3
// 100 rounds
// 10000000
// 2 Cars
// 2048
// A Blocky Christmas
// A Jumping Block
// A Life of Logic
// Angry Birds
// Angry Birds Space
// Artillery
// Astro-PANIC!
// Avoider
// Back to Square One
// Ball Game
// Ball vs Ball
// Ball: Revamped
// Balloon Invasion
// BallPusher
// Ballz
// Bar Balance
// Bejeweled
// Biggification
// Block it
// Blockage
// Bloons
// Boids
// Bombuzal
// Boom Dots
// Bouncing Ball
// Bouncing Ball 2
// Bouncy Light
// BoxHead
// Breakout
// Bricks
// Bubble Chaos
// Bubbles 2
// Card Game
// Castle Ramble
// Chronotron
// Circle Chain
// Circle Path
// Circle Race
// Circular endless runner
// Cirplosion
// CLOCKS - The Game
// Color Hit
// Color Jump
// ColorFill
// Columns
// Concentration
// Crossy Road
// Crush the Castle
// Cube Jump
// CubesOut
// Dash N Blast
// Dashy Panda
// Deflection
// Diamond Digger Saga
// Don't touch the spikes
// Dots
// Down The Mountain
// Drag and Match
// Draw Game
// Drop Wizard
// DROP'd
// Dudeski
// Dungeon Raid
// Educational Game
// Elasticity
// Endless Runner
// Erase Box
// Eskiv
// Farm Heroes Saga
// Filler
// Flappy Bird
// Fling
// Flipping Legend
// Floaty Light
// Fuse Ballz
// GearTaker
// Gem Sweeper
// Globe
// Goat Rider
// Gold Miner
// Grindstone
// GuessNext
// Helicopter
// Hero Emblems
// Hero Slide
// Hexagonal Tiles
// HookPod
// Hop Hop Hop Underwater
// Horizontal Endless Runner
// Hundreds
// Hungry Hero
// Hurry it's Christmas
// InkTd
// Iromeku
// Jet Set Willy
// Jigsaw Game
// Knife Hit
// Knightfall
// Legends of Runeterra
// Lep's World
// Line Rider
// Lumines
// Magick
// MagOrMin
// Mass Attack
// Math Game
// Maze
// Meeblings
// Memdot
// Metro Siberia Underground
// Mike Dangers
// Mikey Hooks
// Nano War
// Nodes
// o:anquan
// One Button Game
// One Tap RPG
// Ononmin
// Pacco
// Perfect Square!
// Perfectionism
// Phyballs
// Pixel Purge
// PixelField
// Planet Revenge
// Plants Vs Zombies
// Platform
// Platform game
// Plus+Plus
// Pocket Snap
// Poker
// Pool
// Pop the Lock
// Pop to Save
// Poux
// Pudi
// Pumpkin Story
// Puppet Bird
// Pyramids of Ra
// qomp
// Quick Switch
// Racing
// Radical
// Rebuild Chile
// Renju
// Rise Above
// Risky Road
// Roguelike
// Roly Poly
// Run Around
// Rush Hour
// SameGame
// SamePhysics
// Save the Totem
// Security
// Serious Scramblers
// Shrink it
// Sling
// Slingy
// Snowflakes
// Sokoban
// Space Checkers
// Space is Key
// Spellfall
// Spinny Gun
// Splitter
// Spring Ninja
// Sproing
// Stabilize!
// Stack
// Stick Hero
// String Avoider
// Stringy
// Sudoku
// Super Mario Bros
// Surfingers
// Survival Horror
// Talesworth Adventure
// Tetris
// The Impossible Line
// The Moops - Combos of Joy
// The Next Arrow
// Threes
// Tic Tac Toe
// Timberman
// Tiny Wings
// Tipsy Tower
// Toony
// Totem Destroyer
// Tower Defense
// Trick Shot
// Tunnelball
// Turn
// Turnellio
// TwinSpin
// vvvvvv
// Warp Shift
// Way of an Idea
// Whack a Creep
// Wheel of Fortune
// Where's my Water
// Wish Upon a Star
// Word Game
// Wordle
// Worms
// Yanga
// Yeah Bunny
// Zhed
// zNumbers