Thursday, October 28, 2010

Make a Simple ActionScript 2 Button in Flash CS5

For the sake of simplicity I will show how to make a very simple button. I'll not go into detail with the up/over frames. Let's start by creating some text:

You don't want this text acting like text so you're going to turn it into a graphic. Go to Modify -> Break Apart.
This will leave your text looking like this:

Repeat the same action Modify -> Break Apart. This turns your text into graphics AND eliminates the need to embed your fonts (neat!).

Go back to Modify -> Convert to Symbol. You'll get this window:

Make sure type is Button, name your object (start_btn) then click Export for ActionScript. Make sure what you have looks like the above picture. Now, double click your text and it should open up another timeline for your graphic. Name your current layer "text" and lock it. Create a new layer above it and name it "overlay".

What we're doing is creating a "click area". If we didn't add this, it would be difficult or even impossible for the user to move their mouse over the physical area of our text. Use the rectangle tool and create a rectangle covering our text. It doesn't matter what color.
With this shape still selected, go to your Properties window and change the Alpha to 0%.


Now go back to your main timeline. Make sure your movie clip is selected and go back to your properties window and give it an instance name. In this case we named it clickBtn.

Now for the coding. In your main timeline create a layer called "actions". Click on the frame and open your actions window. Here's all the code you need:

stop();

clickBtn.onRelease=function()
{
//add stuff that happens when clicked
gotoAndStop("play");
}


In this case I told my button to go the frame labeled "play".

And you now have a cool button!



[download] .fla source

Breakout!

Weapons of choice: Flash & PhotoShop CS5, AS3

So how do I break out of a breakout? It's a bit harder than I thought. I have to keep this game in line with my epic RPG, but how? I did the first thing I always do when starting a new project: research. I try as many breakout games as I can find. Commercial ones, free casual ones and ones made by the gaming community.

My findings: it's really really hard to find a good breakout game. Some good points are: having more challenges than getting rid of all the pieces on the board and adding bonuses that change the mechanics.

Awakening
The title is called Awakening because you are awaking the hidden knowledge inside this temple and at the end of it, one party member will activate a latent special ability (although you'll not see this or even know there's a party there).


Backstory
During the adventures of Sanctuary, our adventurers come across ruined temples in search for answers to the crisis happening in their world. One temple has a door that can not be opened unless you obtain three special runes that are neatly placed on the wall beside it. The catch is that you can't just grab them. They are slightly out of phase with reality and must be activated before they are collected.

Mechanics
Balls of energy (blocks) - Each ball released will send down a positivity or negatively charged ball of energy. If a ball is collected by the paddle, one of three random events will happen. If a positive charge is collected, a good thing will happen and likewise if a negative ball is collected something not very desirable will happen.
Paddle - will be controlled by the left and right arrow keys. It will start out with a ball of energy on it's surface and will be released by the up arrow.
Runes - Each rune will be sitting on a shelf. Each shelf must be hit to activate the rune. Once hit with the ball after it is activated it can now be collected. Once each rune is collected the game is over, even though there may be blocks still left on the board.
Score - the score will be kept track of by a dynamic text box and mostly hidden. When the score changes, it glows for a few seconds, taking on the behavior of the blocks.
Lives - lives will be taken care of similar to the score.

Graphics
This is my weakest point in game creation (and the hardest I'm working on). For this game I will create all custom graphics from PhotoShop. Since this is a ruined ancient temple, I decided to make the background a wall. This wall was created using nothing but PhotoShop filters. I left the purple tone in it because well, this is not an ordinary temple and wanted to convey more than just a mundane ruined wall. It could be the minerals or crystals inherent in the rock.

Originally I was going to let this be the background to place my objects but quickly realized no matter what I put on it, my objects were washed out due to to varied texture and colors this wall has. My solution was to use the opening frame's overlay which is just a black rectangle shape with transparency. This way you still see the wall behind it, but it forces the user to focus on the important stuff.

Saturday, October 23, 2010

Click - why can't I stop playing it?


Click by ~AeryithV on deviantART

I laughed when my sister said this about this most simple game, but I couldn't help but sport a big smile. It's really not an intended game, it was a sand box to test the functionality I have in my Flash game. The only reason I put this on my blog is that I feel I took what A Theory of Fun and Game Design was saying. Strip down a game to it's simplest mechanics, and if it's still fun, it's a good game.


My three year old son just had to play it every time he saw me working on it. I added some background color, took care of some extra coding stuff, added a silly noise and he would play this for hours on my laptop while I work on my game.


I think I hit the mark with this simple but still somewhat fun mechanic of what I am building in my Flash game Swift Tales. I'll go into more detail about my game in another blog, but I am building Swift Tales with ActionScript 3 and Flash CS5.

Friday, October 22, 2010

Save Transparent .tga for kgPanels in PhotoShop

Saving alpha channels with targa files is fairly easy. Here I am creating a simple UI for my warlock.

NOTE: When making custom panels for this addon, remember the size of each panel must be in the powers of 2, not exceeding 512. For example, my panel is 512 pixels by 256 pixels. As long as the width and height are in powers of 2, you will see your art. Sizes can be 2, 4, 8, 16, 32, 64, 128, 256 and 512.

Here's my finished panel, but I need to add an alpha channel before I can save it. I would suggest to put your finished work on one layer. Hold your Crtl button down and click on your Layer 1 area in your layers panel. This will make a selection of whatever you have in that layer.



Next, you want to click on the Channels pannel next to your Layers pannel.


At the bottom of this panel you want to click on 'save selection as channel' button.  This will create your alpha channel. Click on the eye next to it. You should see a pale red area where your transparency is.


You should now be able to Save As, select Targa, and look, Alpha Channels can now be checked (keep it checked).

Now when you bring it in to Kgpanels, you will see it with it's transparency.


Friday, October 1, 2010

My Gaming Roots

Commodore 64
I figure this blog better start out with a bit of explanation of why I like to make games. Simple answer: I love playing them and they have amazed me since the first time I played Pong on Atari at my babysitter's house. My Dad introduced me to programming when I was 10 (1990), and I was programming my own games in Visual Basic on my Commodore 64. I still have fond memories of storing my programs on my cassette tapes.

I joke I was so poor growing up I used to have to make my own games. That's kinda true though. I didn't get my first true gaming console, the Nintendo NES until 1992. Before then, I would follow my brother to his friend's house down the street. He was lucky enough to have an NES before us. I would just sit and watch them play. I was the little sister, so I didn't get much chance to play, but I didn't care - I just wanted to watch.