Getting closer to the end! Time to add sounds.

Next case on the line is case number 9, in this case I’m going to add some music and sound-effects to my game.

Case 9: In this case you should add sound effects to various events in your game (jump-sounds, attack-sounds, etc.) and background music.

Difficulties: This case seems pretty simple, I think I’ll get most of it done fairly alright when it comes to coding the sounds. Finding approperiate sounds however, is a bit more difficult. I’m also going to use this week to add some more “features” to the game, or rather, bug-fixes – specifically adding a “inRange” function to the player, so you have to be in a specific range to be able to defeat enemies (unlike how the game is right now, where you can attack enemies from wherever).

Solution: Import the right classes -

import.flash.media.Sound;

import flash.media.SoundChannel;

Set variables -

var mySound:Sound = new thisistheSound();              // mySound (name of the variable - call this when you want the sound) :Sound (tells the variable that this is a sound) = new thisistheSound (makes a new instance of the sound you've exported into ActionScript)

var sc:SoundChannel;     // You need a SoundChannel variable as well (different sounds need different channels)

Add the soundfile to the main class function (constructor) if you want it to play “all the time” (as in background music) – or in the approperiate function if you want a specific sound for a specific event -

sc = mySound.play(0, int.MAX_VALUE);                        // 0 = starts song from beginning, MAX_VALUE = plays through the sound

I’ll update the post when I’ve finished this case.

Adding bonus objects (power-ups, health, etc.)

Time for the next case in the line – adding bonus objects to my game. I haven’t really thought much about bonus objects for the concept of my game, I didn’t take it into consideration at all when making the game-design, which obviously is flawed from my side. I don’t want to do something outrageous and innovative in terms of bonus objects and mechanics surrounding these bonus objects, I simply don’t think it’s approperiate for my game, but also because I feel I don’t have the skills required to add a very intricate system.

Case 8: In this case you have to add objects that the player character (PC) should pick up and receive points for. The points should be summed up and showed in a counter (Heads-Up Display). You also have to create some objects that the PC needs to avoid, when the PC hits these objects it should be indicated in some way.

Game Design (specific for this case): I want to keep the design and functionality of my game quite simple. Mostly because I think it suits the design-idea in my head, but also because I do not feel I am capable to add much more tham this with my current knowledge in ActionScript and Flash.

• PC encounters an enemy (NPC), the PC kills the NPC, enemy drops a bonus object (health), PC receives additional health (HP).
• Counter should show total health (simple HUD with icon/text).
  • If health is 1 and the PC loses versus an enemy or falls “out of” the level -> Game Over.
  • If HP is 2 (or more) and the PC loses versus an enemy -> Looses one HP -> Knockback effect to allow the player time to rethink the situation.
  • If the player falls “out of” the level (misses a platform and drops into the void) and has 2 HP (or more) then the PC should respawn at the start of the level.

I may include a timer, showing max allowed time for completing the level – when the time runs out, the game ends. Either that, or using a timer as a way to indicate score – less time used on completing the level awards the player a higher score when completing the game. I might add a timer feature if I have enough time, right now I just want to finish what’s vitally needed to make the game a game.

I’ve played around with some more ideas for my game, I’m not sure if I will be able to include them – but I want to let them out either way. The first idea I had was to add a multiplayer function.

Multiplayer concept

• Local, each player assigned to a set of three keys on the keyboard)
• Two players will be able to choose an attack before a timer runs out  (Rock, Paper, or Scissor)
  • When the timer runs out, the players need to have set an attack -
  • An animation plays out (scissor cutting paper, paper wrapping up rock, rock smashing scissor
    • Draw (equal attacks (would do nothing, perhaps animate the sprites in a clash before they get knocked back)
  • Score is added to the winning player
• Best out of three rounds wins

The second idea is a boss-encounter at the end of the level, specifically a “clone” of the player character.

Boss-encounter concept

• Able to randomly attack with either rock, paper, or scissor
  • Needs to somewhat be identified, but not too obviously, so the player in a way knows what to “counter” the attack with – like some sort of “Block” function. If the boss chooses rock – the player could choose either paper (to damage) or rock (to block/draw) to counter that attack
• “Mimics” the player character in some way
• Has a total of three lives, meaning you need to get a correct hit on the boss three times before you beat it

Difficulties: I’ve had a lot of trouble finding the approperiate code I need for the features to function like I want them to. I’m not sure how I can solve this, currently I usually need to find an example of the functionality I want to include in my game – look it over – then I try to assimilate the code with my own code. I sometimes also look up how a specific syntax works in either Learning ActionScript 3.0, or in Adobe’s Help section for Flash. I am also getting a lot of help from my neighbour, which is very good to have if I am struggling for too long on my own. Specifically with this case I had some trouble getting the attacks versus specific enemies to work, solving this seemed to be easier than I first thought it would be, but I got help to achieve the final result.

I’m still having a hard time understanding how different .as classes communicate with each other as well, Object Oriented Programming is a pretty tough nut to crack, but once the nut is cracked it’s beautiful and very “obvious” I suppose. I’ve still not understood it, so to me it’s still quite messy, but I hope I’ll get there.

Solution:

<updating>

Result: Visual Result, I still need to add a respawn function if you fall out of the stage. I also need to fix a proximity where you can attack the enemy. The source code behind my game will be uploaded and released when I’ve fixed these two problems.

Another case, this time I’ve got to add some enemies to my game.

So! Just three cases to go until I have to have a game finished, I feel that I lack a lot of experience and understanding necessary for creating a final game with Flash and ActionScript 3. I’ve needed a lot of help from “the outside” in the previous cases, and this case was no different. I got a lot of help from my neighbour and from Learning ActionScript 3: The Beginner’s Guide. Mostly input on understanding why and how to use several classes, mostly for structure.

Case 7: Time to add some enemies (or friendly players) to your game. You basically have to understand the concept of using object oriented programming (OOP) and adding artificial intelligence (AI) to one objects or more in this case – to succeed with this case. You’ll be introduced to creating a new class that will communicate with your already created “main” class.

Reflections: I understand by now that I, should, devote even more time to understanding and learning the very fundamentals of programming in ActionScript 3.0. I need to devote time I feel I do not have at all, it is a struggle when I do not really aim to be a programmer – programming isn’t why I mainly chose this education, I’m more creative than technical. This mental lock I have in my head has made me quarrel and reflect a lot about programming, it’s not making it easier to understand and finish every case from week to week either. I’m also having a hard time learning everything I need to learn to complete every case (Not to speak about learning everything not considered in each case. The cases only cover the very vital and necessary functions for the final game.), I guess it’s just a matter of finding relevant information whether it’s on the internet through forums or tutorials, educational books, or fellow students.

If I have learned anything over the few past months in this course, it is that I am not really suited for programming, although I try my best I feel I can’t get further than what I’ve managed this far. I don’t want to give up just yet, but I’m not far away from doing so, I do at least want to finish my game – and to fulfill the idea and concept I have in my head. I guess the game idea I had in the start was too ambitious for me. So next time I’ll need to find out what the idea I have in my head requires from me in regards to ActionScript and Flash in itself.

In this specific case I’ve learned small fragments of how to add artificial intelligence to another object for the game. In my game, the “other objects” are enemies, specifically scripted to follow the player character wherever it moves. I’ve been introduced to Object Oriented Programming (OOP), how to make another class (another .as file) communicate (import/export variables, functions, etc.) with a main-class. I’ve also learned how to add a roughly working “camera” (moving a Movie Clip when there’s input, imitating movement) in a sidescrolling game.

Difficulties: I had a lot of difficulties or problems I did not understand before starting this case. What I first did was chopping the problem into smaller pieces so it would be easier to work with. I had three questions I needed answers to

• What kind of code do I need to make a function randomly choose a number assigned to three different enemies? I want the game to have a different feeling to it each time a player starts the game.
• How can I add spawnpoints – where the player character walks past and an enemy “spawns” <insert number> coordinates to the right? I want the enemies to spawn when the player passes a certain object or point in my level. One spawnpoint should spawn only one enemy each.
• How can I add artificial intelligence to the enemies? I want them to follow the player character along the x-coordinates.

Solution: Here’s a bit of code, mainly the functions I added to solve the specific difficulties that this case introduced me to (bullet points above). I will try my best to explain parts of the code, do note that I am quite inexperienced with scripting in Flash, so you’re welcome to comment my errors if you see any.

This is the code I’ve used for randomly spawning different enemies when the player character walks through a specific x-position in the level.

var RNG=(Math.floor((Math.random() * 50)) %3) // This code is used to "randomly" run through 50 values until 0, 1, or 2 is returned. The Math.random function loops through values from 0.1, 0.2, 0.3 and so forth. Any value from 0 to 0.9 is considered "0", any value from 1 to 1.9 is considered "1", and any value from 2 to 2.9 is considered "2".

			if (RNG == 0) // If the RNG variable returns a value that is considered "0" - it uses the function called createEnemy1.
			{
				createEnemy1();
			}

			else if (RNG == 1) // If the RNG variable returns a value that is considered "1" - it uses the function called createEnemy2.
			{
				createEnemy2();
			}

			else if (RNG == 2) // If the RNG variable returns a value that is considered "2" - it uses the function called createEnemy3.
			{
				createEnemy3();
			}

This is what I have coded for the “createEnemy” function – it specifies what should happen when “createEnemy1/2/3″ is referred to.

private function createEnemy1()
		{ // start createEnemy1
		attackFrame = "rockAttack";
		walkFrame = "rockWalk";
		idleFrame = "rockIdle";
		} // end createEnemy1

		private function createEnemy2()
		{ // start createEnemy2
		attackFrame = "scissorAttack";
		walkFrame = "scissorWalk";
		idleFrame = "scissorIdle";
		} // end createEnemy2

		private function createEnemy3()
		{ // start createEnemy3
		attackFrame = "paperAttack";
		walkFrame = "paperWalk";
		idleFrame = "paperIdle";
		} // end createEnemy3

It basically tells the script to find Movie Clips which have the correct instance names for each enemy. I’ve made a sprite for the enemies, where for example the scissor enemy have three frames which consists of Movie Clips named “scissorAttack”, “scissorWalk”, and “scissorIdle” (these MCs contain the animation for said name).

This is the function I’ve used to specify where the enemies should spawn when the player passes specific “spawn points” throughout the level.

for each (var spawnObject in spawnArray)  					// Sends the functions of the loop into every spawnpoint (spawnObject) added to the spawnArray
			{ // start for each spawnObject in spawnArray
				if (spawnObject.x < handChar.x && spawnObject.spawned == false)
					{
						var newEnemy = new Enemy();						// Tells Main.as what Enemy.as is
						newEnemy.x = spawnObject.x+100;				        	// newEnemy spawn 100 x-coordinates to the right for the spawn point
						newEnemy.y = 300;								// newEnemy spawn 300 on the y-coordinates
						enemyArray.push(newEnemy);						// Pushes the enemy into the enemyArray
						addChild(newEnemy);								// Adds either of createEnemy (Enemy.as) into the stage
						spawnObject.spawned = true;						// Checks if the Enemy has been spawned on a spawnpoint, if yes, then the spawnpoint is set to true and disables the spawning of new enemies
					}
			} // end for each spawnObject in spawnArray

“spawnObject” is a Movie Clip directly on the stage in my Flash file. spawnArray is obviously an array, so I’ve pushed every spawnObject into the array in the top of my code, like this “spawnArray.push(spawn1);” where “spawn1″ is a graphical Movie Clip on my stage with the instance name called “spawn1″.

This is the function I’ve used for the artificial intelligence on my enemies.

public function Chase(handCharx, handChary)
		{ // start public function Chase
			if (handCharx < this.x-20)                    // if player (handChar) is lesser (to the left on the screen) than the enemy, enemy should turn to the left and follow the player.
                        {
                                this.x -= speed;
                                this.scaleX = -1;
                                gotoAndStop(walkFrame);
                        }
                        else if (handCharx > this.x+20)               // if player (handChar) is larger (to the right on the screen) than the enemy, enemy should turn to the right and follow the player.
			{
				this.x += speed;
				this.scaleX = 1;
				gotoAndStop(walkFrame);
			}

Result: Here’s the visual result, and here is the code behind the enemies. I haven’t added the main-class, but it involves some changes related to the newly added class.

I’ll write some more words about the solution later.

I received another 12 invitations from Google Wave today.

And all 12 of these need a new owner. If you want one just tell me why you’d like to check out what the fuss with Google Wave is all about in a comment below. Don’t worry though, I’m not very strict.

Update: And I forgot, please include your e-mail when commenting.

I currently have no more invitation left.

Some more information on the game design.

Time for case 6 and some reflections of what I’ve done this far. I’ll redo the way I’m setting up these posts from now, so the new way of structure should at least contain Reflection, Difficulties, and Result.

Case 6: In this case you’re going to work further with the design of the environment and the enemies for your game. You should also rethink your game-design and the idea behind your game, reflect about your experience. Do you have the skills to make your concept come true, if not, what do you need to learn more about? You should also blog about the history for your game,  elaborate the game-design, describe the interactivity, and “sell the concept to curious future players”.

Reflections: I feel the game-design for my game is pretty much complete, so as of right now I am not going to change it much at all. I think the idea behind the game itself is good on it’s own as well, I haven’t seen many examples of games alike the one I want to create, so I feel it’s innovative. My experience when it comes to fulfilling the concept in the aspect I want it to be like, is somewhat more diffuse – I feel I have a basic understanding of Flash, but I am yet experienced enough to create a lot of code purely on my own – as well as including different features that there’s no examples of from before.

Difficulties: For my concept I know that I’ll need to learn about random events, timers, artificial intelligence (for the enemies), and specific spawnpoints (I suspect this is basically coordinates).

Result: Click this link. It’s not at all done, basically a quick sketch of the environment (Grass, yay!), and a introduction (paste-in) of the three possible enemies.

The Rock, Paper, Scissor Game

Gamestory: It’s about the Hand. The Hand has to find his way “home” (to the end of the level), to find its way home it will have to defeat huge hordes of boulding rocks, razersharp papers, and angry scissors.

Game-design: Based on the popular “rock, paper, scissor” game where two human opponents first count to three by saying “rock, paper, scissor”, and then choose to use either “scissor” (beats “paper”), “paper” (beats “rock”), or “rock” (beats “scissor”) – the winner is decided from what the two human players picks.

I want to implement this kind of random and unforseen feeling in the game I am making, and hopefully I will be able to do that as well. I don’t want the player (PC – Player Character) to see the enemies (NPC – Non Player Character) before being right in front of (2-3 seconds) the enemy. I also want the NPC to “pop up” at selected spawnpoints along the level-design. The NPC should also be randomly selected out of three possible outcomes, either it’s a rock, a scissor, or a paper. The PC then have to use the right attack to defeat the NPC (Rock beats Scissor, for example).

Level Design: I want the level design to have a simple and minimalistic look, think in the ways of how Super Mario was done back in the day. I’ve decided that I want a simple and minimal level design mostly because I am drawing everything in pixels, dots by dots of colored pixels adding up to a final level in the end. Having something very detailed means a lot of work, in terms of adjusting pixels here and there. That’s hard for me to go through with as a student with both limited time on each project, and a lot of projects to do.

Interactivity: The PC can move to the left (A or Left Arrow), to the right (D or Right Arrow), and jump (W or Up Arrow (along with either A or Left Arrow, or D or Right Arrow to move in the air)). The PC can also attack, either as a scissor (H), paper (J), or rock (K).

Why you should play: Feeling lucky? Any new and experience-hungry player can join in on the fun he or she will get from The Rock, Paper, Scissor Game by simply:

• Being lucky in battles (RNG is always fun)
• Defeating horrendrous amounts of enemies (perhaps 5 in total, that’s really massive)
• Beating the tough (non-existant) high-scores
• Cutting, stoning (as in throwing/mashing rocks on people, not like smoking pot), and papercutting evil pixels to their inevitable death

I clearly have a really solid concept going on here! Perhaps not, but I hope I’ll make through with the concept and finalize the game. Which, of course, will be free to play for anyone who wants to give it a go. :)

Small bit of information, and a chance to get yourself an invitation.

What’s Google Wave?

It’s like a new social network thing, from Google. It uses waves (alike threads for SMSes from different contacts) to include messages, photos, videos, and documents between users. Several users can also collaborate on waves together, which makes it a seemingly nice tool for projects where some kind of communication is needed between coworkers. But who can better explain what Google Wave is, than Google? Watch this looooooong video from Google I/O 09

(Old beta build, but basically the “same” as the beta going on right now)

I have beta invites

Yes, I do! If you want one out of eight possible invitations, leave a nice comment saying how much you want Google Wave – and why you want it – in this post. Include your e-mail adress.

I currently have 0 invites left. I’m all out.

Adding Collision Detection to the “game”.

There’s basically four new things I’ve been introduced to in this case – hitPointTest/hitPointObject, the while loop, gravity, and velocity.

Case 5: In this case your character should follow the terrain you create for him/her/it. You also have to make it so that your character is allowed to jump when you press a key, the jump should move your character up and you have to use gravity to pull it back down on the terrain. Your character also needs to have the correct animation for the jump. If you want to; make it possible to move to either side when your character jumps.

I finished the jump-code and movement while jumping in my last case (Case 4), thanks to this tutorial and some classmates.

I’ll try to explain the new code I’ve added in this case.

var mainJumping:Boolean = false;
var jumpSpeedLimit:int = 10;
var jumpSpeed:Number = 0;

Here’s the new variables I’ve added to my code. It’s variables for the jump.

handChar.y -= jumpSpeed;
jumpSpeed -= 2;

This code simply makes the Movie Clip “handChar” take effect from gravity, the code says that “handChar” should always pull -2 down on the y-axis (vertical) until it hits the hitTestPoint which is assigned to the Movie Clip called “Ground”.

while(Ground.hitTestPoint(handChar.x, handChar.y-3, true))
{
         handChar.y -= 1;
         jumpSpeed = 0;
         mainJumping = false;
}

The while loop basically means do “this” when “that” happens, and it keeps repeating all the time, checking if there’s ground (objects) to stand on. Or in other words: when my character (“handChar.x” and “handChar.y” – for both x and y-axis) hits the ground (defined by “Ground“) it should stick to the ground.

if(upKeyDown)
{
	if (!mainJumping)
		{
			handChar.gotoAndStop(5);
			jumpSpeed=jumpSpeedLimit;
			mainJumping = true;
		}
	idle = false;
}

Here’s the “moveHand” function for my jump – you can see the variables here (jumpSpeed, jumpSpeedLimit, mainJumping).

Code for this case can be found here, the result can be found here.

More animation and code!

So, I was ordinarily done with case 4 in the last blog post I did about the case. I wanted to do a bit more with my code though, and with some help from Markus the neighbour I was able to add attacks to the script. It even works like I wanted it to!

When I tried coding this myself, I had one serious problem: How can I make the animation initiate when a specific key is pressed down -> Run through the animation for said keyframe when specific key is pressed -> Then stop and return to idle.

It seems that the main solution for this was adding a instance name to the keyframes within the sprite, and adding the named instance as a Event Listener (line 32 in my code). I also had to make a new function that would say when a frame was ended (line 46 in my code).

I’m still not completely satisfied with the result, the code is looking alright – but the graphic isn’t looking like I want it to, so I will have to fiddle around with that a bit.

The result can be found here, and the code can be found here.

Another bunch of wallpapers.

All images have been found on ImageFlash. Resolution on the images is 1900×1200 pixels.

Event Programming – making a symbol move with input.

So.. Another case filled with juicy traits of ActionScript programming, oh joy! Well, the “frustration” aside, it’s fun once you learn the hang of it, programming in ActionScript that is. I haven’t gotten the hang of everything yet, but I am starting to feel comfortable with some of the different strings, events, variables and functions.

Case 4: Make your character move left and right with animations, using keyboard functions. You also have to make sure the character goes into the idle-animation when you don’t press down any keys. Important keywords in this case: events, keycodes, functions.

At first, this sounded like a hard task, and it was a bit difficult actually. I am glad I live in a era where internet is, more or less, like owning a pair of socks: quite common. If I didn’t have the internet to look into when I stepped into trouble I would probably have a much harder time finishing this case. Thanks to all of the awesome people out there who are willing to share their knowledge with others! It means a lot, at least to me it does.

I started the case by finding out what the problem was. I had to find out what kind of code I needed to write, foremost what sort of events I had to use, then the functions and other code-bits came naturally along the way. I needed keyboard events added to my script, I found, and used, parts of my code from this specific tutorial and reading in “Learning ActionScript 3.0: A Beginner’s Guide” (Mainly chapter 3 and 4).  Check out Flash Game Tuts, a neat and organized webpage aiming at the Flash Game programmers out there.

Here’s the result I’ve got this far, thanks to DeviantArt for supporting .SWF files.

As usually when there’s code involved in my ramblings, I have to paste them out for everyone to see! Well, I don’t have to, but I want to contribute something back to the “community”, hopefully someone will learn something from the code I’ve used, as I did from the tutorial I found.

Here’s a Pastebin link to the code, formatted for ActionScript, and here’s the same code pasted directly into WordPress (I recommend using the Pastebin).

package
{ // start package

	import flash.display.MovieClip;
	import flash.events.*; 

	public class Main extends MovieClip
	{ // start public class Main
		var speed:Number = 5; 

		var handChar:HandChar;
		// define MovieClip "handChar"

		var leftKeyDown:Boolean = false;
		var upKeyDown:Boolean = false;
		var rightKeyDown:Boolean = false;
		var downKeyDown:Boolean = false;
		// define keys left, right, up, down - for movement (left, right, up, may add down)

		var hKeyDown:Boolean = false;
		var jKeyDown:Boolean = false;
		var kKeyDown:Boolean = false;
		//define keys h, j, k - for attacks (rock, paper, scissor)

		var mainJumping:Boolean = false;
		var jumpSpeedLimit:int = 15;
		var jumpSpeed:Number = jumpSpeedLimit;
		// define jump

		public function Main()
		{ // start function Main
			addEventListener(Event.ENTER_FRAME, moveHand);
			addEventListener(Event.ENTER_FRAME, attackHand);
			addEventListener(Event.ENTER_FRAME, boundaries);
			stage.addEventListener(KeyboardEvent.KEY_DOWN, checkKeysDown);
			stage.addEventListener(KeyboardEvent.KEY_UP, checkKeysUp);
			handChar= new HandChar ();
			handChar.x = 200;
			handChar.y = 90;
			handChar.scaleX = 1;
			handChar.scaleX = 1;
			addChild(handChar);

		} // end function Main

		private function checkKeysDown (event:KeyboardEvent):void
		{ // start private function checkKeysDown
			if(event.keyCode == 37 || event.keyCode == 65)
			{
				leftKeyDown = true;
			}
			if(event.keyCode == 38 || event.keyCode == 87)
			{
				upKeyDown = true;
			}
			if(event.keyCode == 39 || event.keyCode == 68)
			{
				rightKeyDown = true;
			}
			if(event.keyCode == 40 || event.keyCode == 83)
			{
				downKeyDown = true;
			}
			if(event.keyCode == 72)
			{
				hKeyDown = true;
			}
			if(event.keyCode == 74)
			{
				jKeyDown = true;
			}
			if(event.keyCode == 75)
			{
				kKeyDown = true;
			}
		} // end private function checkKeysDown

		private function checkKeysUp (event:KeyboardEvent):void
		{ // start private function checkKeysUp
			if(event.keyCode == 37 || event.keyCode == 65)
			{
				leftKeyDown = false;
			}
			if(event.keyCode == 38 || event.keyCode == 87)
			{
				upKeyDown = false;
			}
			if(event.keyCode == 39 || event.keyCode == 68)
			{
				rightKeyDown = false;
			}
			if(event.keyCode == 40 || event.keyCode == 83)
			{
				downKeyDown = false;
			}
			if(event.keyCode == 72)
			{
				hKeyDown = false;
			}
			if(event.keyCode == 74)
			{
				jKeyDown = false;
			}
			if(event.keyCode == 75)
			{
				kKeyDown = false;
			}
		} // end private function checkKeysUp

		public function moveHand (e:Event) : void
		{ // start public function moveHand
			if(leftKeyDown)
			{
				if(upKeyDown || mainJumping)
				{
					handChar.x -=speed;
					handChar.scaleX = -1;
					handChar.gotoAndPlay(5);
					mainJump();
					return;
				}
				handChar.x -= speed;
				handChar.scaleX = -1;
				handChar.gotoAndPlay(1);
				return;
			} 

			if(rightKeyDown)
			{
				if(upKeyDown || mainJumping)
				{
					handChar.x +=speed;
					handChar.scaleX = 1;
					handChar.gotoAndPlay(5);
					mainJump();
					return;
				}
				handChar.x += speed;
				handChar.scaleX = 1;
				handChar.gotoAndPlay(1);
				return;
			}

			if(upKeyDown || mainJumping)
			{
				handChar.gotoAndPlay(5);
				mainJump();
				return;
			}

			handChar.gotoAndPlay(3);
		} // end public function Movehand

		public function attackHand (e:Event) : void
		{ /*// start public function attackHand
			if(hKeyDown)
			{
				handChar.gotoAndStop(rock);
				return;
			}

			if(jKeyDown)
			{
				handChar.gotoAndStop(paper);
				return;
			}

			if(kKeyDown)
			{
				handChar.gotoAndStop(scissor);
				return;
			} */
		} // end public function attackHand 

		function boundaries (e:Event) : void
		 { // start function boundaries

			 if(handChar.x > stage.stageWidth - handChar.width/2)
			 {
				 handChar.x = stage.stageWidth - handChar.width/2;
			 }
			 if(handChar.x < 15)
			 {
				 handChar.x = 15;
			 }
         } // end function boundaries

		function mainJump():void
		{ // start function mainJump
			if(!mainJumping)
			{
				mainJumping = true;
				jumpSpeed = jumpSpeedLimit*-1;
				handChar.y += jumpSpeed;
			}
			else
			{
			if(jumpSpeed  -jumpSpeedLimit/5)
				{
					jumpSpeed *= -1;
				}
			}
			if(jumpSpeed > 0 && jumpSpeed = stage.stageHeight - handChar.height)
				{
				mainJumping = false;
				handChar.y = stage.stageHeight - handChar.height;
				}
			}
		} // end function mainJump
		} // end public class Main
} // end package

Update: I’ve added boundaries (the function called “boundaries”) and attack inputs (the function called “attackHand”). Going to add animations for the attacks once they’re drawn.

Wallpapers!

4walled has them. I also found ImageFlash, a similar site, but without all the “explicit” content and desktop screenshots.

Click on the images for the full resolution. 1900×1200 pixels.

Let the programming start!

This week we’ve been introduced to ActionScript 3.0, the programming language used inside Flash.

Case 3: In this case you have to move your character by using ActionScript, you also have to make sure that the character is kept “within the screen” (an invisible border that you assign in the script).

Having small amounts of experience within the whole programming setting is something that I’ve felt, in a negative way, the last days. I have a bit of experience from Assembly, and a bit of bash/C++ programming, but it’s not really comparable to ActionScript.

I have completed this case, more or less to a satisfying extent, although I have to admit that I’ve cross-referenced most parts of my code within the  “Learning AcrionScript 3.0: A Beginner’s Guide” book.

I’m going to read about packages, functions, statements (if, while, then, etc), classes, loops, and events. I also have to add another sequence to my walk-animation, as well as tidying up the sprite I’ve made out of all the animations.

Here’s the code (pastebin) I’ve written to solve this case. Here’s the zip archive of the ActionScript file, the flash file, and a Flash movie with the two files combined.

And here’s the code pasted directly into this post, it appears quite messy as WordPress doesn’t really allow “clean” indents when you quote text. I recommend checking the Pastebin version as it formats the code with colors according to ActionScript.

1. package
2. {
3. import flash.display.MovieClip;
4. import flash.events.Event;
5. public class Main extends MovieClip
6. {
7. var speed:Number = 5;
8. var walk:Walk;
9. public function Main()
10. {
11. addEventListener(Event.ENTER_FRAME, Update);
12. walk= new Walk ();
13. walk.x = 200;
14. walk.y = 50;
15. walk.scaleX = 1;
16. walk.scaleX = 1;
17. addChild(walk);
18. trace(“Flash”);
19. }
20. public function Update (e:Event) : void
21. {
22. walk.x+=speed;
23. if(walk.x>400-walk.width/2)
24. {
25. speed= -speed;
26. walk.scaleX = -1;
27. trace(walk.x);
28. }
29. if(walk.x<0+walk.width/2)
30. {
31. speed= -speed;
32. walk.scaleX = 1;
33. trace(walk.x);
34. }
35. }
36. }
37. }

The groups in our course got two example files, one .as (ActionScript) file and one .fla (Flash) file. I studied the examples while reading along the code, to better understand what the code was all about. Thanks to Eirik (Antihelt) who chugged up some code to the web, which I was allowed to take part in myself, and later used parts of. I wrote most of the code down on my own using “Learning ActionScript 3.0: The Beginner’s Guide”, and added some code that I found out would “improve” the script, like dividing the walk.x so it turns inside the assigned screen-limit/border. I still need to learn more of the functions and so on to get a broader understanding of what I actually write, and why I do it.

Another batch o’ wallpapers.

All the wallpapers are 1920×1200 pixels, and found with 4walled.

Walk, idle, and jump animation.

The case for this week is basically to animate the character I made last week. I have to make one idle-animation, one walk-cycle, and a jump-animation.

Case 2: Animate your character with a walk-cycle (strafe-movement), jump-animation, and idle-animation, using Motion Tween, Classic Tween, or Inverse Kinematics. You can mix them all together if it makes the task easier for you to accomplish.

I’ve made the walk-cycle, more or less finished, just some “polishing” work to do since the Inverse Kinematics (Bone tool) doesn’t handle adjustments in the bones very well if you stretch it. I’ll probably upload the .SWF for viewability soon.

Did I mention that I dislike the bone-tool? I think I might scrap this animation and start all over, tweening or frame-by-frame.

Update: I decided to go with pixel-graphics (importing PNGs from Photoshop as symbols in Flash, using different pixel-images to create the animation), I’m having a very hard time getting the animations right with vector graphic in Flash, I don’t know what it is I am doing wrong. I don’t feel comfortable drawing in Flash, that’s one problem I have, my other problem is Flash CS4, the application, at least the bone tool, it just somehow seems to be very “beta” and not functioning properly when you want it to. That really gets me.

Though pixel-animations requires a bit more effort when it comes to drawing, but it’s not really too bad, I like to draw, and real retro games contained (on average) two different images for the walk-cycle, one image for the jump-animation and perhaps two images for the idle-animation.

Here’s the “walk-animation” for the main-character, at least what I’ve got this far, pixel-style.
Here’s the “idle-animation” for the main-character.
Here’s the “jump-animation” for the main-character.

And that concludes case 2!

The PC for my Flash assignment is pretty much finished!

Here’s the main character (player-character) for my going-to-be sidescrolling platformer game in Adobe Flash CS4.

Click the image for a larger version.

The hand is made in Flash CS4, containing somewhere among 200~ vector points. It’s made in 6 different layers, one layer for the base of the hand, one layer for the thumb, one for the index finger, and so on.  The different poses are done with the newly introduced bone-tool (new function in Flash CS4), although it is quite quirky right now, I foresee it’ll do a lot of animating very easy compared to piecing an animation together frame for frame in the “traditional” way. I’ve learned the properiate tools on my own, as well as finding out how the bone tool is working, some discussions with fellow classmates have been done, brainstorming with likeminded people is neat. I’ve used a few of the “Learning Flash CS4″ tutorials on AdobeTV as well.

Here’s the Flash file containing the character, with bones. (hand.fla)

I’m still deciding on how I should “design” the hand for the best possible animation, I’m tinkering with adding every joint/limb of the fingers to their own layer. < Rigged the character with layers for each joint some days ago, to put it blunt – It didn’t work out very well as you can only attach one bone to one symbol, unless you’re inside the symbol itself, and that makes layers a bit obsolete. > Instead of just having one layer for the whole finger like the character is right now, it makes the graphic skew slightly when I pull the bones to “quirky” positions. I think I’ll animate the character using the new Bone Tool functions, it makes things easier, but it’s all new so it has some issues..

Or I might go a more traditional way of doing things and make it frame for frame with a little bit of motion tweening where it can be used to “speed up” the process. As a hand is pretty organic, I think the bone-tool (despite the name, bone tool) is way too mechanic and unorganic.

If you want to read more about my first case (assignment) in the course I am taking (Animation and Interaction), take a look at this post.

I finally found another scrape for 4chan images.

Finding wallpapers is easy again! Check out 4walled.

1900×1200 pixels. Click the image for a larger version.

1900×1200 pixels. Click the image for a larger version.

First assignment in Adobe Flash.

On tuesday I got my first assignment in the Animation and Interaction course I am taking. By the end of this semester (December), I have to get through a pretty steep learning curve when it comes to Flash, I’ve never used the program itself nor taken much interest in animating vector-graphic. The assignment is pretty simple, or so it may seem – to create a typical sidescrolling platform game in Flash (with “help” from ActionScript 3.0, the language all the code is written in) – divided into 10 cases from week to week with more or less different things to learn in every case.

Case 1: Design a character in Flash, with vector-graphics and in 2d (side-view). Create a game-design, include the background story and environment for your main-character.

I’ve pretty much got the game-design figured out:

Concept 1:

• Humanoid main-character, some mixture between Indiana Jones and Super Mario (ish).
  • Attacks with a sword/stick.
• Background for the main-character: He’s lost in a threatening, ancient and old world, all alone without the key to find his way out, help him get back home to the world he lives in.
• Jungle/Ancient sort of environment with vines, palms, banana-trees, grass, sand, rocks, statues.
• One base platform at the ground-level where the character can walk around freely, no objects or enemies. Platforms and different objects that the MC has to get past laid out on his way to the end of the level.
• Enemies (key-keepers, let’s call them that for simplicity) that dies when jumped on or when being hit with weapon/punch/kick so they drop key fragments. Main-character dies if he walks into one of the enemies without killing it first.
  • Attacks/Kills the player by walking on him, if the player doesn’t kill it.
• Goal of the game: Main-character has to collect all the different key fragments to forge/assemble the mainkey so he can unlock the door, and complete the level.

Quick sketch for the game-design behind concept 1. Click the image for a larger version.

Concept 2:

• Ball/Abstract main-character, has to be able to spin/run quickly as the mission for the character is based on speed. (Include some bonuses like faster speed)
• Background for the main-character: The ball/abstract figure wants to show the world how good it is at collecting score-points and beating the annoying mass of horizontal lines wanting to kill it.
• Two vertical lines on each side of the level, constraining the player from jumping out of the level.
• Placed/Random horizontal lines that scrolls either upward or downward (haven’t decided) on the level.
• Navigate the main-character (a ball, or some type of abstract character) through holes in the horizontal lines, scrolling down in a set speed in regard to the score.
• As the game continues and the score goes up – enemies or objects will be placed throughout the horizontal lines to make it a bit more challenging for the player. The scrolling speed of the horizontal lines will also speed up.
• Goal of the game: Get the highest score and don’t let your main-character get squeezed by the scrolling floor/ceiling.

Quick sketch for the game-design behind concept 2. Click the image for a larger version.

Concept 3:

• Main-character (MC) is a hand.
  • Three arms (thumb, ring-finger, and pinky)
  • Two legs (index and middle-finger)
  • Has some sort of notebook with different expressions on it, flips the book when it’s sad/excited/tired/happy/afraid etc. (if that’s too hard I’ll go for the poster, or just the hand itself)
• Background story for the MC: The hand has by mysterious magical whatchabings been separated from its’ owner. The player has to guide the hand through an abstract and strange world in order to reunite the hand with the rightful owner. (I’ll read stories for your kids, I’m good, I tell you!)
• Typical platformer with different platforms here and there, in different angles and sizes. I’ll have to plan something out, but for now I just follow the criterias – I need to show some sort of jump-function, preferably with an animation to support the jumping and landing. (I can already picture the hand preparing for a massive summersault into the air, dropkicking one of the pesky scissor-enemies out of the stage!)
• Enemies
  • Rock (Not figured out a function for this enemy yet, but it’ll either jump and squash the player character (PC), or block the way to some extent) – PC has to avoid it, can’t be killed, it’ll just be a annoying rock, sorry.
  • Paper (This thingy will basically, as within the Rock-Paper-Scissor “game”, wrap around the hand and entangle it in a mess of paper!) – PC has to either attack it or avoid it.
  • Scissor (This one will.. Oh, you guessed right Mr.! It’ll cut the hand like any professional emo would.. Which makes me think of replacing the scissor with a razorblade – whaddy’a think?) – PC has to either attack it (I want to animate a slapping hand, bitchslap-style) or avoid it. Attacking it awards more points for über highscores!
• Alternative Gamestyle:
  • Rock – Player has to press a key to “morph” (the hand will pose as the “paper”) into a Paper.
  • Paper – Player has to press a key to “morph” (the hand will pose as the “scissor”) into a Scissor.
  • Scissor – Player has to press a key to “morph” (the hand will pose as the “rock”) into a Rock.
  • If the player fails to morph into the right pose for the enemy, he/she will lose one life.
• Goal of the game: PC has to guide the MC home and reunite it with its’ owner. Highest score keeps the first place on the scoreboard (kudos for that one, obviously!). I might put in some sort of counter that will check the score, when the score is on or above the set variable the level can be completed.

Quick sketch for the character design behind concept 3. Click on the image for a larger version.

I kinda changed my mind on which concept I like the best, I like concept 3 now!

That’s what I’ve done this far, it might not be that much, but oh well! I’m struggling with the design part, I don’t like the paint-tools (and general feel of vector-graphics) in Flash. If you have some tips or nifty how-to’s for creating a pixelated character in Flash I’d very much like to see a comment! :3

Another batch of wallpapers!

Gravity by vulcania, downloadable here.

Purple Haze by prateekpk.

The Sleeping Harbor by JVi.

School assignment – design a hero and two enemies.

This is going to be a worklog on my first assignment in Visual Design. Assignment: Design one “hero” and two enemies. Fully detailed view for the characters. Sketch left/right side and backside view.

Hero, front-view (sketch 1)

If you didn’t see it, I’ve picked up some inspiration from the Prince of Persia video game series, I love the art and design in the games. Quick sketch (taken 2 hours or so, including erasing the whole character, starting a new one, gathering references and so on) with rough colors and details done in Corel Painter 11 with Wacom Intuos 4 medium pen tablet.

Hero, front view (sketch 2)

Another concept for the same assignment. After hearing “Oh! Is that inspired by Prince of Persia?!” by several classmates and some design thoughts, I decided I wanted to change the look of my hero quite drastically. I feel better about this concept, it has more personality and in my opinion it “flows” better and stands out as something you would see in a hero character.

Hero (front-view), color

Decided to work further on this concept. Added some colors.

Hero – Final

Here’s the concept, more or less finalized.. I might change some things here and there, but I feel it’s roughly finished.

Enemy (front-view), 1

First enemy, concept character, decided to pick some inspiration from Medusa.

Enemy (front-view), basic colors

Local/Basic colors added to the enemy, now for the next step – adding details with different values and colors.

Enemy 2 (front view), Basic Colors

Sketch for another enemy, a tree! This creature is inspired (or rather tired) from a MMO-game called Aion.

Feel free to give critiques, I’d love to get input on what I can do differently to (hopefully) improve the characters over time. I obviously have to work a lot on coloring and adding details, and I need to learn how to draw properly. Right now I am not sure exactly what types of details I want to add, perhaps some ornamental armor on the hero (partly done in concept 2 of the hero) and chains/some sort of “evil” stuff going on for the enemies, but if you have something cool – go ahead and add a comment.

Two sketch-posts in one day?! Madness.

I decided I wanted to be really productive today. So here’s another daily, or, several actually. I did some quick poses, 30 seconds on each pose, from Posemaniacs.com.