This task seemed simple at first, but the more I thought about it, the more complicated it seemed. The trick is being able to split your image up into a grid, and then affect the grid pieces in an order that would start from one corner, and work its way to the other corner. I immediately started sketching down grids and trying to figure out patterns. With the help of a fellow employee, we found a pattern that worked for all directions.

The solution revolves around using a grid where the pieces are numbered by row and column. Here’s a simple example:

[0,0][0,1][0,2]

[1,0][1,1][1,2]

[2,0][2,1][2,2]

Lets examine the above example. We know we want to move from one corner to the opposite corner. Examining the grid, there’s a simple pattern using addition and subtraction. Travelling along diagonals, the items in a line all add up or subtract to the same values. 0,0 = 0; 0,1 = 1; 1,0 =1; 0,2 = 2, 1,1 = 2 etc…

Using this as our base, the next trick is how to loop through. The following is how it would work for one corner:

for (sum = 0; sum >= lastRow + lastCol; ++sum)
{
     for (row = 0; row >= lastRow; ++row)
     {
          col = sum - row;
     }
}

After that, all you have to do is affect your bitmaps however you woud like. Below are a few examples I came up with; Just click the image to begin the transition.

The first is a simple alpha fade with a large grid. This allows you to see whats going on from the most basic standpoint:

This example adds rotation and a subtle color transform:

This version scales the x values inward and randomly moves their x position slightly. Again there is a subtle color transform:

This last version is similar to the last only it uses the Y axis as opposed to the X:

With this technique, I’m curious to see what other people can do with it!

Additionally, the game is wrapped around a sweepstakes where the grand prize is the all-new Ford Taurus Limited.  Players must complete all seven weeks to be eligible to win the grand prize.

Can you catch The White Shadow? Play now!

Have what it takes to stop the Bugs Gone Wild or Alien Invaders?  If you like old school games give them a play. Bugs Gone Wild. Attack on Mother Earth.