Thursday, December 24, 2009

Christmas Hurl



I recommend going to the large version here and saving the .swf to your desktop.

The holidays are here! In celebration, I've whipped up the above. It's a simple little tree decoration thing that showcases a few concepts. First off, we have gravity and physics. As each ornament falls, it picks up speed, giving the illusion of gravity pulling. Surprisingly, faking gravity is INCREDIBLY easy! You see, each movie clip is moving a set amount every frame (shown as _y+=dy where dy is a number). The trick here is that the "dy" constantly increases by a set amount. So let's say dy starts at 0 but increases by 1 every time.

Frame1:
dy = 1
old _y = 0
new _y = 1

Frame 2:
dy = 2
old_y = 1
new _y = 3

Frame 3:
dy = 3
old_y = 3
new _y = 6

and so on...but remember, you're likely running around 24 -31 fps, so your change in dy should probably be tiny (experiment with this to simulate different gravities! I tend to use .1 as a baseline, but it changes depending on how I want something to move).

Speaking of dy, the bouncing effect is a neat little trick, too. When the movie clip hits the bottom, it is first moved to the bottom edge of the screen (if something is moving fast enough it goes PAST the bottom of the screen, so this rights it) and then it's dy is multiplied by -.7. Why not -1? In the real world, some energy is lost to the ground when a ball bounces (ever have a really heavy box fall beside you? Even if you didn't get hit, you definitely felt the box thud! That's the dissipated energy...some of it, anyway).

The last little bit I'll share with you is how to calculate the speed of the thrown object. To be honest, this was an experiment that I really didn't expect to work. But surprise! Work it did. Essentially, we're keeping track of two values. Where the mouse is NOW and where the mouse was a frame ago. These values are updated every time the mouse moves, and the difference between the two is stored as a number. When you release the ornament, that difference is used to determine the speed of the the thrown object. Nifty, eh?

Well, that's it for now. Merry Christmas!

Sunday, December 20, 2009

Feelin' Lucky?



Larger version here.

In a departure from the stuff I normally do, I decided to make an actual game. Here you have a 4-reeled slot machine. You place your bet (top 3 red buttons) and your risk of the spin (bottom 3 red buttons). Then click the purple "roll" button and you're off!

Your winnings are determined by how many of the rings line up once the spin is completed.
No Matches: 0
One Match: (your bet) x (risk/2)
Two Matches or 3 of-a-kind: (your bet) x (risk)
All Four: (your bet) x (risk) x 5

This isn't an absolutely crazy to program game. I use modulus (%) to determine when or if one of the rings should stop. Each ring is simple a tweened animation, and every 1, 2, or 5 frames (based on risk 1, risk 5, or risk 10 respectively) it rolls a counter to see if it should stop or not.

Once all four rings are stopped, the frame number of each is pushed into an array. Each value in the array is compared to the rest of the values to see if they match. Different numbers of matches indicate what the winnings should be. I wasn't quite able to compare a single value against everything else and then exclude it from the array (probably could, but not worth the headache), so a non-match actually shows up as 4 matches (the checked value in the array checks against itself as well).

Oh, and the little "$" button in the corner refills your credits to 100 if you are below 100 credits.

Friday, December 18, 2009

Rising Bubble



Alright, first post après capstone. This is just a little experiment toying with trigonometric functions as a method of movement. Once you click somewhere in the stage, a bubble is added. A few starting values are randomly selected and then plugged into the function of a sine (sin) wave. The x coordinate of the bubble is the result of the sine wave function. A constantly increasing value is plugged into the sine function and the result is the x coordinate. Since a sine wave is a repeating, oscillating curve, we get the left to right motion. The change in the y coordinate is simply a constant increase (though that constant is randomized at the beginning of the bubble's life cycle).

Enjoy! Expect another post (maybe something a little more complex) in the next few days. If you have any suggestions or just want to see something specific, let me know. I'll see what I can do!

Monday, December 7, 2009

Sketchy



Time is tight what with the end of semester fast approaching, so here's another little experiment I whipped up back in the day. The gist of this program is that whenever the mouse button is down, Flash generates an empty movie clip which is then filled with a line created through Flash's built-in drawing API.

The main unique thing about this is that Flash grabs the endpoints of the line from the mouse and a tiny movie clip on the stage. Though this may not be too awfully different from your standard drawing program, this process could be animated easily. In fact, I have another version of this where the origin points move around randomly drawing lines between them. The effect is much like an old familiar Windows screensaver.

I probably will hold off on posts until after this Friday. This Friday is IUPUI's capstone night where I will be presenting my final senior project. If you're in the Indianapolis area, feel free to stop by and check out all the nifty New Media projects!

Friday, December 4, 2009

Eno?



This is a super basic little thingum...but then, I'm also feeling a little fried at the end of this week. This requires headphones or speakers, and though it may take it a second, I swear it IS doing something after you click start.

This is pretty much an incremental counter that, when it hits a certain point, cues in an .mp3 and calls a function that adds the little sound notification text. Nothing huge, but I did use some similar code to create the soundtrack for my upcoming capstone project.

Tuesday, December 1, 2009

Stay on target...



Just a little quick one. Here we have a "seeker" movie clip that is constantly on the hunt for those delicious little green orbs. It will turn to face the nearest one (or the one it's currently chasing) via some trigonometry. The chasing is nothing too incredibly complex. There's an invisible hit box surrounding the seeker and when it hits a green orb, the seeker's change in coordinates is based off of where the orb is relative to the seeker.

You may notice the seeker has a preference for one of the orbs. I believe that if both orbs are within sight, the seeker goes after the one it is currently chasing. I have seen it do an about-face to chase the other orb, but I think that's because I've put in a cool down period for the chase. In other words, if the hit zone ISN'T hitting the green orb, the seeker will still give chase for a half second. During this cool down period (invisible to the viewer), the seeker can freely change targets if one is available.

Sunday, November 29, 2009

Dynamic Text Loading

EDIT: Okay, for some reason the embedded .swf couldn't locate the .txt file in the same directory. So, here's a link to a version that works.
Remember, use the arrow keys to move the letter origin point.

Alright, here we have another old random experiment from a few months back. Basically what we have here is a .swf pulling in text information from an external .txt file. Every half a second or so, we pull the next character from the text file and shove it into a new dynamic text field. This text field is inside a movie clip that simply fades over the course of a few seconds.

Simple stuff here, but it amuses me! But then, so do sparkly objects and keys, so...

Anyway, you'll find the .as file below (that houses the origin point's controls) and the .fla containing the code. The "testTxt.txt" is the text the .swf pulls from, so if you want to save these files to your local machine, be sure to grab that little guy, too.

ALSO, you may wonder why I have my loadVars line in the onEnterFrame function...sure, it costs a little more computation, BUT this allows for instant updating. You could have this .swf open, modify and save the .txt file, and BAM! The .swf instantly reflects the changes made without have to recompile. Slick, eh?

text file
.fla source
.as source

Friday, November 27, 2009

Shuffle Board



Ah, simplicity...

I sat down today and wanted to whip this up. After a couple hours, I realized I was getting nowhere. I was approaching this completely backwards. See, originally I intended to keep an array of the x and y coordinates of each dot. THEN, I wanted to shuffle each of those arrays around and assign them to the dots. This turned into a huge hassle, as I realized by completely shuffling them, you always had some overlap (it was possible to have several dots in the same location). SO, I tried to store each x and y coordinate as a pair into an array. That sort of worked, but based on how I originally added the movie clips to the stage, I could only truly randomize either the rows or the columns. Everything moved in this case, but if all columns were randomized, then all rows would move together as a group.

So then it hit me. Don't shuffle the coordinates. Shuffle the DOTS! Duh! If I would have approached this from that perspective at the beginning, this would have taken minutes rather than hours.

Source files:
scrambleDots.fla
Scrambler.as

Tuesday, November 24, 2009

CatScope Gradient Mask



Ooh, masking! For those of you who have never messed around in Flash or any other graphics package, the idea of a "mask" may not be completely clear. The way I think about it is that a mask acts as a window over another image. Look out your window. Think of the outside as a single large image. Your window (NOT the wall!) is the mask. It's a bit misleading in that a mask actually SHOWS something instead of hiding it.

That being said, the above is an example of a mask. Not only is it a mask, but it's a GRADIENT mask (notice how it fades to black around the edges). Gradient masks can be tricky in Flash, as you have to use a dynamic mask via actionscript instead of simply plopping a mask onto the stage.

Monday, November 23, 2009

Painterly



This is one of many similar things I've put together. I sort of lumped them all together into a "Painters" series. Essentially you have various leaders that will chase your mouse cursor. As they do, they drop off little dabs of "paint" which fade and drift away after a few moments.

At some point in the future, I might combine many of the Painters into one single object that I can upload here. There were so many types...some that twinkled, some that DIDN'T fade, some that snaked off into tiny little extra tendrils...

Once again, a simple but fun one! Enjoy!

EDIT: Almost forgot! The large version is here.

Sunday, November 22, 2009

Tiles



This isn't anything TOO amazing, but it's been laying around my drive for a little while. Just a fun little repeating sequence of tiles. And don't think this is the pinnacle of my programming! It's just a tiny little thing I whipped up quickly. Very quickly.

If you'd like to see it in a larger (1024x768) version, head here.

Welcome!

Welcome to this brand-spanking new blog! I have decided to set up an area where I can easily showcase my random workings in Flash. Why the title? Well, I've seen a million Flash workings that DO something. Either they're a set animation with a beginning and end, or a game that also only exists for a set time period. My creations tend to be a little more abstract and really don't have a set timeline. You see, they don't really have to do anything...

For the record, most everything I will be posting in the near future is still in ActionScript 2.0, but I plan to begin educating myself (finally) in AS3 after graduation this December.