An update.

Thand — Thu, 15 Jul 2010 17:04:49 +0000

As I’m sure all 4 of you noticed, I’ve added a portfolio link. As I’m also sure 2 of the 4 of you noticed, it doesn’t work. Will it ever? Only time will tell.

Multimedia II Final Project

Thand — Sat, 17 Apr 2010 01:33:10 +0000

In this tutorial, we will be creating a movie with multiple animations controlled by ActionScripted buttons. You can click HERE to download an example .fla.

SECTION A: WHAT YOU WILL NEED

1. At LEAST 6 small, animated GIF and/or SWF files

2. A number of button graphics equal to the number of animated clips you have

3. A 550 x 400 image to use as a background

SECTION B: SETTING UP THE FLASH FILE

1. Go to File -> New. With Flash File (Actionscript 3.0) selected, click OK.

2. Create 4 layers: Actions, Animations, Buttons and Background.

3. Import all your graphical assets (buttons, animations, etc.) to your library by clicking on File -> Import -> Import to Library

4. With the Background layer selected, drag your 550 x 400 background from your library to the stage.

SECTION C: SETTING UP THE BUTTONS

1. Looking at the library, you’ll notice that for every image you imported, Flash created a symbol version of it as well. If that is not the case, continue to Step 2 of this section. If Flash has indeed done this, skip down to Step 5.

2. To create a new symbol, click on Insert -> New Symbol. Give the symbol a name relevant to what it will contain, making sure the type is set to Movie Clip, and click OK.

3. You will now be inside your new symbol. One way to tell is that there will be a little blue arrow towards the top left corner of the stage window.

4. Drag one of your animations from the library to the stage and hit that blue arrow. You have now created a symbol of your animation that Flash can manipulate with ease.

5. On the Buttons layer, place your button symbols in their desired location by dragging them from the Library. In the case of the provided example, the actual “buttons” are part of the background image, and the Buttons layer just contains some low-opacity symbols placed over them.

6. Click on one of your button symbols and open the Properties window. In the Instance Name field, give the button a name. This name will be used to identify the button in ActionScript. Repeat this process for all of your buttons, taking care not to use the same name twice.

SECTION D: SETTING UP THE ANIMATIONS

1. On the Animations layer, place one of your animation symbols on the stage by dragging it from the library (if your animations haven’t been converted to symbols, do so by following Steps C2-C4).

2. For every animation symbol you have, create a blank keyframe on the Animations layer.

3. Place one of your animations on every keyframe.

SECTION E: ACTIONSCRIPT, THE GOOD STUFF

1. Right-click the first frame of your Acions layers and click on Actions.

2. If you were to test your movie right now, chances are you wouldn’t see much. Your movie clip is only a handful of frames, and Flash will speed through them by default. In order to stop this behavior, type in stop(); on the first line of the Actions window.

3. Next, we will create our functions. Functions are the basic units of code that can be invoked in ActionScript. A lot of what you’ll type in ActionScript will either be a function, or call a function. On a new line, start by typing function, a space, then the name of your function. You can name a function just about whatever you want, but it’s best to keep it short and relevant to what the function does. Basically, if it shows an animation of a butterfly, call it butterfly. After naming your function, type in (event:MouseEvent) {gotoAndStop (1);}. Assuming you named your function butterfly, your line should look like this:

function butterfly(event:MouseEvent) {gotoAndStop (1);}

The (event:MouseEvent) lets Flash know to execute the butterfly function when the user’s mouse performs a certain function. The {gotoAndStop (1);} portion are the actual instructions of the function. In this case, the butterfly function will advance the movie to the first ((1)) frame on the timeline and stop the movie.

4. On the next line, write another function for your next animations, giving it a unique name relative to the animation you have in your second frame and changing the 1 towards the end to a 2. This means the function will advance the movie clip to the second frame instead of the first. Repeat this pattern for the remainder of your animations.

5. Next, we need to add Event Listeners to our buttons. Event Listeners tell Flash what to do when something happens, like a mouse click or a keystroke. Starting on a new line, type in the Instance Name of your first button (in the case of the example, joystick). Follow this with .addEventListener (MouseEvent.Click, Function); where the word “Function” is replaced by the name of one of the functions you created earlier. If the Instance Name of your button is joystick, and you want to make it call the butterly function when it’s clicked, your line of code would look like this:

joystick.addEventListener (MouseEvent.CLICK, butterfly);

6. Repeat this process, assigning an animation to each one of your buttons.

In this tutorial, we will be creating a movie with multiple animations controlled by ActionScripted buttons.

You can click HERE to download an example .fla. The assignment has changed entirely from the handout I gave you on Tuesday… so feel free to toss that.

SECTION A: WHAT YOU WILL NEED

1. At LEAST 6 small, animated GIF and/or SWF files

2. A number of button graphics equal to the number of animated clips you have

3. A 550 x 400 image to use as a background

SECTION B: SETTING UP THE FLASH FILE

1. Go to File -> New. With Flash File (Actionscript 3.0) selected, click OK.

2. Create 4 layers: Actions, Animations, Buttons and Background.

3. Import all your graphical assets (buttons, animations, etc.) to your library by clicking on File -> Import -> Import to Library

4. With the Background layer selected, drag your 550 x 400 background from your library to the stage.

SECTION C: SETTING UP THE BUTTONS

2. To create a new symbol, click on Insert -> New Symbol. Give the symbol a name relevant to what it will contain, making sure the type is set to Movie Clip, and click OK.

3. You will now be inside your new symbol. One way to tell is that there will be a little blue arrow towards the top left corner of the stage window.

4. Drag one of your animations from the library to the stage and hit that blue arrow. You have now created a symbol of your animation that Flash can manipulate with ease.

SECTION D: SETTING UP THE ANIMATIONS

1. On the Animations layer, place one of your animation symbols on the stage by dragging it from the library (if your animations haven’t been converted to symbols, do so by following Steps C2-C4).

2. For every animation symbol you have, create a blank keyframe on the Animations layer.

3. Place one of your animations on every keyframe.

SECTION E: ACTIONSCRIPT, THE GOOD STUFF

1. Right-click the first frame of your Acions layers and click on Actions.

function butterfly(event:MouseEvent) {gotoAndStop (1);}

The (event:MouseEvent) lets Flash know to execute the butterfly function when the user’s mouse performs a certain function. The {gotoAndStop (1);} portion are the actual instructions of the function. In this case, the butterfly function will advance the movie to the first ((1)) frame on the timeline and stop the movie.

5. Next, we need to add Event Listeners to our buttons. Event Listeners tell Flash what to do when something happens, like a mouse click or a keystroke. Starting on a new line, type in the Instance Name of your first button (in the case of the example, joystick). Follow this with .addEventListener (MouseEvent.CLICK, Function); where the word “Function” is replaced by the name of one of the functions you created earlier. If the Instance Name of your button is joystick, and you want to make it call the butterly function when it’s clicked, your line of code would look like this:

joystick.addEventListener (MouseEvent.CLICK, butterfly);

6. Repeat this process, assigning an animation to each one of your buttons.

SECTION F: PUBLISHING

1. To publish your finished movie, go to File -> Export -> Export Movie. If everything worked out, it’s because I’m brilliant. If not, you probably did something wrong. Good luck!

I can explain!

Thand — Tue, 13 Oct 2009 02:37:27 +0000

I’m lazy.

When I DO manage to muster up the strength and desire to do something, it usually goes towards school work and Street Fighter IV (with hints of Team Fortress 2 and Dungeons and Dragons Online sprinkled in). I’ve decided to make the site more visually appealing to the common man, and mean that in the most elitist way possible. I’ve been messing around with Flash a lot recently, so the end result show be something not eye-gougingly horrendous.

I actually wanted to make this post about 2 weeks ago, but forgot my WordPress password and was too lazy to type in my e-mail address (once) to recover it. True story.

Here comes a new challenger!

Thand — Sat, 18 Jul 2009 07:00:29 +0000

Have you ever looked at Cammy in Street Fighter IV and been like, “She’s pretty cool, but what would make her even BETTER was if she was an entirely different person. Like, Harley Quinn or something.”

Well, WISH NO MORE.

Basically, I had a day to kill yesterday and decided to whip up this Harley Quinn skin for Cammy in SFIV (PC):

I think Mr. J would be proud and confused.

Download it here.

Minor issue in terms of site/comic progression.

Thand — Thu, 09 Jul 2009 16:39:15 +0000

I picked up Street Fighter IV for the PC yesterday.

Later.

Status Update!

Thand — Sun, 05 Jul 2009 05:30:30 +0000

I’ll be honest, the only real reason I’m making this post is because I’m tired of staring at the other one. As for that “soon-to-be-posted creation” mentioned in the first post, it’s coming along.

In actuality, it’s been done-ish for a few weeks.

I’m still deciding on the final layout and presentation of it, as well as reworking and extending the script. When it’s finally posted, it’ll be totally worth it (for me).

Welcome to the Hippo!

Thand — Tue, 23 Jun 2009 23:04:06 +0000

In time, I hope to fill this site with various forms of entertaining media. For the time being, take a look at the webcomic that inspired my latest soon-to-be-posted creation.