Case 10 - Victory or defeat

Nortrom MacFree - Beta version by ~SveinE89 on deviantART

In this week’s case our objective was to create some kind of way to show the player that you’ve either won or lost. In addition we also were supposed to create a starting menu with instructions and a button to start the game. In the win/loose screens we should make it possible to restart the game.

In this case I first had to reorganize my script-file. I learned what I needed to do in our group meeting on Monday, where we were introduced to the concept. The first function I called in was the constructor, where all the main objects of the game are added. But now that I needed a start screen, I had to move this constructor further down in the script. I added two new functions over it; the intro and menu function (in addition to the functions for the buttons).

I spent a lot of time this week on designing the different screens, since the programming went pretty smoothly. I decided to make the loosing screen a so called “blue screen of death”, which is a familiar term in the computer world. I created a replica of the well known blue screen that appears in the earlier versions of the Windows operation system when you crash your computer. I also decided that instead of creating a button to click with on with your mouse to restart, I just bound a key to restart the game. This suited the blue screen more, since you often got the message “Press any key to attempt to continue”. For the intro and win screen, I decided to create a small movie sequence to create a sort of background story.

After letting people see my game and give me feedback, I also spent a lot of time revamping the game. I made it a bit harder by adding more enemies, and increasing their speed. I’ve also added a timer that makes you lose if the time runs out. I also worked on the design and placing of the different objects.

Case 9 - Behold: Sound.

In this week we got to make sounds and music for our game. All the sound have to be triggered by AS3. It also has to be license-free, meaning that I can’t use for instance Britney Spears – Oop I did it Again in my game.

I wanted to have one special theme that was going to loop in the background, a sound when the hero picked up orbs, a sound for when the he hit enemies, some catch-phrases my hero would shout out every once and a while, and some other music bits I could use in my intro/outro. I tried looking on the internet on several free-sound web-pages, but I wasn’t completely happy with the material I found. Therefore I contacted a friend of mine, who makes digital music and sounds. I explained how my game worked and described what kind of sounds I wanted. And after a while I got some material that I’m very happy with.

The way of adding music was quite simple. On our group meeting on Monday I learned all I needed to know. This time Ole Andreas created a chat-like thing in our Fronter-room that he used to show us what code we needed to use sound in AS3. I think that method worked out really good, because we could all talk, read/write the code, and use the code by typing it in our own scripts at the same time.

The way I added sound to my game was quite easy. First I imported the necessary properties, made variables for the sound I would use from my library, and then I made variables for 3 different sound channels. By creating sound channels you can play several sounds “on top of each other”. For instance background music and a sound when you pick up orbs. I created one channel for background sound/music, one for sound-effects, and one for vocals.

I managed to add a background music easily and a sound when you pick up an orb. One problem I’ve encountered here is that I chosen to just scale the orbs down to 0 when they’re picked up, instead of removing them, and that leads to that every time I walk over the place where an orb used to be, the sound is also played. I’m currently working on this at the moment and I won’t publish a new version of the game before I feel comfortable with it.

Case 8 - Picking It Up

The task in this case was to create something for the hero to pick up and gather. In some games a timer is also implemented, so if you wanted the game to be timed, this was the case to solve it.

I decided to create my energy orbs in an array. An array is a kind of container in AS3 which contains several instances of an object. When I had placed to orbs in this array, I used the code and placed them individually around my level. In this week I also placed out the platforms, creating a first draft of my world. I also tried spreading the orbs around randomly using a math code, but I wanted to have full control over them. I also decided to only have 4 orbs around the map. And story vice these were the energy orbs to charge our hero’s gun so that he could defeat the Mother-Virus.

In the lab on Thursday, they showed a really good and simple example of how to create and use an array. They created 10 balls, and first placed them orderly around the screen, then randomly using the math code I mentioned earlier. This really helped me a lot, and made me understand the usage of arrays.

I decided not to use a timer in my game, because I wanted it to be simple. I may later add a timer if I see that the game needs more challenges. But I tried to make a “test-timer” just for the learning experience, and it worked well. The examples shown in the lab were also very useful here.

One way I think I’m going to implement the timer later, is when I’m going to move my enemy back and forth. Since I move all my backgrounds, platforms and objects, instead of my character, I have to find a way to make my enemy move along the x-axis, without using a code similar to the ones we created in case 3.

Case 7 - Bad Guys

In this case we were supposed to design enemies for our heroes. Like I’ve mentioned earlier I was going with viruses and Trojan horses as the bad guys. These bad guys should have some kind of AI, they can follow the character, patrol a certain path or whatever. In this case we also were supposed to learn about using more than one class/.as-file. This can make your code easier to control and is a must if you’re creating bigger applications.



That is one of the bad guys; The Virus.

After discussing in the group meeting on Monday, I thought this would be an easy case. But as I got working on the code, I realized that I was wrong. It took a long time before I really understood the point of doing it this way, and I’m not sure I’ve done it now either. I can see the usage of more classes is valuable in bigger projects, but with a small flash game like this I’m not quite sure.




Here is the second bad guy in the game: The Trojan Horse.

After a while I managed to create the 2 classes; one main-class and one enemy-class. In the enemy-class I set the positions etc, and gave my enemy a very simple AI, that just makes him patrol back and forth. I have not created a function that says what is going to happen if our hero hits him, but I am working on it.

Case 6 – Making the World

Case 6 - Designing the world by ~SveinE89 on deviantART

In this case we were supposed to design our backgrounds and other characters in the game. The storyline and contents of the game were also to be defined.

I’m going to start my game with a small intro, showing a person working on his PC and then suddenly it gets infected by a monster-virus. His only hope is Nortrom MacFree, the antivirus-man. You will be controlling the hero inside the computer, where he is faced with a lot of dangers. I’m thinking of having two types of enemies; Virus (a green, yucky, annoying creature that will be following our hero around) and Trojan Horses (a more mechanic creature patrolling a given path).

Throughout the level our hero will be collecting energy-orbs. These orbs will be used at the end when he reaches “the mother-virus”. He will use the orbs to charge his virus-demolishing-gun. This sequence I’m going to make as an animation, like the intro.

I created a background that looks like the insides of a computer, well a broken computer that is. This virus infection was so powerful that the computer actually got damaged physically. When I’m going to implement this background into the game, the hero will always be centered and the “camera” will follow him when he moves back and forth, moving the background accordingly. I’ve also designed a couple of platforms/grounds that I’m going to use in the game.

Picture of the entire background below:

Case 5 - Jump and fall

Case 5 - Jump and ground by ~SveinE89 on deviantART

In this week's case our objective would be to create a jumping motion, and a ground that the character wouldn't fall straight through.

In the previous case I had already created a jumping function, using a guide i found at www.mrsunstudios.com, but now I had to look at it from another point of view. In this case we had to implement gravity to our character. And as most of us know, gravity is a force that pulls us down. In the actionscript-world, that meant that I had to move the character down, along the y-axis, every frame. So when I told the character to move up with my jump-function, the gravity then pulls him down again.

And as in real life, if there weren't any kind of ground below us, we would just keep on falling. In our group meeting on Monday, we were also introduced to the while-loops. I used this in the function that happens every frame, and used the hitTestPoint option to check if the character was hitting the ground I made. So whenever the character hit the ground, it was pushed up. With that while-loop and the gravity working together, the character could move around the ground without falling through.

Case 4 - Pushing the keys

Nortrom MacFree left and right by ~SveinE89 on deviantART

In this week’s case our task was to move our character to the left and right, much like our last case, but this time using the keyboard. And when the character is not moving (when you aren’t using the keyboard) he should be in his idle position.

As mentioned this was kind of similar to our last case, but with a few new challenges, such as learning about keyboard events in ActionScript. I decided to start on a new script instead of continuing on the one from case 3. The reason is that you learn a lot more if you physically write in the new script, in comparison to just copy-pasting or editing something that you’ve written earlier or someone else has written.

I used the Learning ActionScript 3.0 book, found tutorials on the web, and got help from classmates to solve this case. After a while, when I managed to move the character and change the animation, I tried to find out how to make him jump. I managed to make him jump, but had some trouble with the animation so I decided to put that on ice for a while.

Finally I added a background to make the whole thing a bit more alive(This is not the final background Im going to use in the game).

Case 3 - Let the scripting begin!

Case 3 - Running with AS3 by ~SveinE89 on deviantART

In this case we were supposed to use ActionScript 3.0 to move our character. Also, the character should never leave the screen.

My main goal of this case was to learn and understand the basic principles of ActionScript. Throughout the week I studied the Learning ActionScript 3.0, chapter 1 and 2, discussing the topics in the group on Monday, and following the walkthrough on Thursday.

I’ve got some experience from AS1 and 2, and some from HTML and CSS, so my first experience with AS3 wasn’t as scary as it could be. So I managed to make the character move across the screen pretty early. The way I did it, was to add a function with an event listener witch “commands” the character to move along the x-axis each frame. The way I made him turn at the end of the screen was to add a function that said that the character should reverse his speed and flip him horizontally when he reached a specific point on the screen.

On top of the post, I added a link to the finished product. I also added a screenshot of the script at the bottom.

Case 2 – It’s alive!

Nerd Idle by ~SveinE89 on deviantART


Nerd run by ~SveinE89 on deviantART


Nerd jump by ~SveinE89 on deviantART

Like I posted earlier, this was the week that we we’re going to start animating our characters. In our group meeting we discussed what problems and challenges we could face and how we were going to handle them. For me the biggest challenges in this case were to figure out which tweens to use on your character, and how to make the loops look smooth. I watched a lot of tutorials, and read in

I decided to try using the bone tool, which is a tool that makes a “skeleton” for your character, by binding symbols together in the “joints” of your choosing. When you use the bone tool, all your symbols (in my character, all the body parts) are confined into one layer called the Armature layer. And then you can easily move your character’s limbs the way you want it on the timeline, and the tweens/animations between the key frames are automatically generated. Using a science called inverse kinematics the bone tool creates a realistic way of moving the limbs, by connecting them together. I also spent some time modifying each “bone” by constraining the maximum and minimum angle.

I first created the idle animation. I decided to make my animations kind of dorky looking, trying to make my hero look like a nerdy, asthmatic and kind of silly. So in the idle animation I made him breathe really heavily. I also animated his face, with eye-blinking and his mouth moving to make him look more alive. This animation was made in the face-symbol, and since I use the same symbol in all the different animations his eyes and mouth moves in all of them.

When I started animating the running sequence I faced some trouble using the bone tool. Halfway through the animation when I was going to move the legs and arms back to their original position, the skeleton and animation didn’t work out the way I wanted it to. Therefore I decided to use the Classic Tween. When using the classic tween, you make key frames on the timeline, change position etc of each symbol, then create the tween between the key frames. This is maybe a slower way than using the bone tool, but I felt that I had more control.

In the end I placed the complete symbols in a sprite. In class, and by looking at the tutorial we got, I learned that a sprite is a flashfile containing several animations/symbols of a character, for instance running, jumping etc. Each symbol is placed on an individual frame in the timeline. Sprites are used when scripting.

Case 2

This week we're gonna start animating our characters. By Monday our character is going to move to the left and right, start a jump, and be in an idle position.

TO BE UPDATED!

-SEF

Case 1 - The First Steps

After some thinking I decided to make a platform game based on computer viruses and antivirus software. The actions in the game will be located inside a computer that is infested with all sorts of viruses, bugs, Trojan horses etc.

The hero of the game and the one you’ll be controlling will be Nortrom MacFree (also the title of the game), the antivirus-man. He’s going to be a geeky looking guy with a powerful armor, and his quest will be to find and destroy the “Mother virus”, or some kind of boss/nemesis. To be able to destroy this enemy, he has to fight his way through the computer, killing viruses and gathering microchips that he will use to defeat his nemesis.

Nortrom will go through the computer, and if doesn’t get killed by viruses or falls into fans etc. he will face his nemesis in an epic battle. This part of the game I’m probably just going to animate, due to my lack of programming skills. The game will be built up like a “standard” platform game, for instance Super Mario, where the “camera” follows the character to the right, as he moves from platform to platform without falling to his doom or getting whopped by enemies.

When I was designing my hero, I tried to make him as “simple” as possible. By that I mean that I tried to keep the numbers of vector points low. If a character has too many vector points, the danger of lagging in the game increases. It’s also a lot easier animating characters with a smaller amount of vector points. Therefore I used the shapes tool in Flash a lot, and then modifying these geometric shapes with the selection and sub-selection tool, dragging and forming the shapes as desired.

Here’s the finished hero of my game. The version that is shown from the side is the one that you’ll be able to control in-game. The other one is just going to be used in an eventual intro/outro.








Another thing I did to make the size of the flash file smaller, and the animation process more efficient, was to make each body part into a symbol. A symbol is a reusable object used in Flash. A symbol can be reused throughout your movie or imported and used in other movies. The advantage of using symbols is that the size of the symbol is only “taken into consideration” once even if you use it fifty times in a flash file.

I also distributed all the symbols into individual layers, so that I easily can lock the layers (containing body parts) I don’t want to edit, and be free to do what I want on the unlocked layer without worrying about messing up the other layers. Layers are in theory the same as transparent sheets of paper arranged on top of each other. Then each layer can be edited, drawn on and erased without affecting the other layers.

GOOD NEWS EVERYONE!

This blog is now in English!

-SEF

Case 1

I vår første case skal vi pønske ut en spillide. Videre skal vi tegne/designe en hovedkarakter som vi skal bruke i plattformspillet vårt. Vi må huske på at vi skal bruke karakteren til animering i senere caser og det er derfor viktig å designe den slik at den enkelt kan animeres.

-SEF

Første skisse til spillhelten

Første skisse av Nortom MacFree, som skal være helten i spillet mitt.

~~~BLOGG!!~~~

Denne bloggen kommer for det meste til å inneholde saker og ting om en skoleoppgave i kurset Animasjon og interaktivitet.

-SEF