Monday, August 27, 2007

Project 2 Mega-Holiday-Update

I realised I hadn't updated the ol' blog in a while, So I thought I better post some updates. I felt it would be easier to show my development by breaking them up into separate 'versions' and explaining each individually, rather than just one big wall of text.
So Here goes..

0.1 (Click for .swf)

My first attempt at the code for the environment, When either the left or right arrow key is pressed, the background objects scroll and the ground animation plays, giving the illusion of movement.

0.2

I altered the code so now the environment only starts to move when the character nears the edge of the screen. I feel this is a much better result, as now it actually feels like you are moving the character around a space, rather than a scrolling background.

0.3

Added a 'midground' and foreground layer of objects, each layer moves at a different speed, to enhance the parallaxing effect.

0.4

Added a short background clip of some blocks flying around, its very jumpy because I only rendered out a few frames to test it out. Not really very happy with it to be honest, its quite 'busy' looking and distracts from the foreground, and I don't think the scale is quite right either.

0.5

Ditched the background idea after quite a lot of time messing around with particle systems and stuff in max, I liked the concept of lots a blocks whizzing around in the background, but I just couldn't get it to look good in the game, Might have another go at it later though.

I also felt objects in the environment looked quite flat and ruined the realism, My problem was, that if i rendered out the blocks from an angle to show their depth, and then motion tweened this image across the screen, when it got the the other side, and thus was being viewed from the opposite angle, It looked wrong and completely ruined the effect. Originally I wanted to render out each frame of motion for each block as it moved past, but after some quick experiments I realised this would require well over 1000 frames, and increase the file size of the final .swf exponentially.

So in the end I had to stick with my initial idea of just motion tweening a single image across the screen, but through clever use of rounded shapes (such as cylinders and cones) and angling the rectangular shapes carefully, I feel its quite hard to notice the perspective issues. So I'm happy with it.

I rendered out each shape three times from different lengths, rather than just resizing one image as i previously did as this also turned out perspectively incorrect.

0.6

I had another go at this background, this time using just a simple gradient, fairly happy with the outcome, might add some more detail later though. I also slowed down the speed at which the ground scrolled as it was a little too fast for the character, However this brought up a new problem, when the character stopped moving the jump between the current frame of the Moving ground clip, and the single frame of the static ground image became a lot more noticeable. I fixed this by re writing the code so instead of the ground having 3 separate movie clip states (Backwards, static, forwards) it just had one state (Forward), which played when the character nears the edge, and stops when he moves away, and plays in reverse when he nears the other edge. Simple and it works even better! there is now no jump at all. But.... the clip only seems to play through once in reverse. I couldn't find a proper 'play in reverse' command, i had to use 'Previous frame', which only works until it gets to frame 1. Will try and fix this later if i can work out how.

A few background gradient examples, Although I liked the darker ones better, they made a faint white outline appear around the character so i just when for a simple light gray one.

0.7

I was happy with how the environment was coming together visually, but wasn't really any fun to explore. You just pressed either left or right and that was it. So I added another small monkey character who leads you to a goal at one end - A treasure chest. When you reach the chest, a clip of it opening plays and the environment stops scrolling, signalling you have reached 'The end' of the map.

I still felt this was pretty linear and pointless, so i came up with the idea of having to duck some flying blocks along the way. I animated a duck sequence (Down key) and a 'getting hit and falling over then climbing back up' sequence, and tried to get some collision detection working, but didn't have any luck. Will keep at it though.

Phew. That does it for now. Ive also been working on my second file, an isometric map, will post some updates on that later.

Monday, August 13, 2007

Project 2 Update

Over the last couple of days Ive done a few tests at trying to create the aesthetic i am after for the environment, I will begin getting into the code once Ive got the look right. I started by simply taking my basic environment from my previous test and rendering out a wireframe version to get the 'Tron' look I was after. I felt this test was pretty unsuccessful as the end result looked quite messy and the character just didn't fit it, Also the environment was fairly static looking.



I went back to the drawing board and put together another basic wireframe environment, this time with a white background and more opaque to clean it up a little. I wanted to have a go at parallaxing so I animated and rendered a few frames of the ground plane, as well as static frames for each of the cubes. I imported these into flash and using the motion tween, animated the blocks at various speeds to give the illusion they are moving with the background. I felt this test was far more successful, However as the blocks are only a single frame each, they look very flat, I'm not really sure how I can fix this, but i will keep at it.



I also felt my blog was getting a bit messy and it was hard to follow my progress. So Ive started uploading my experiments to youtube, although the quality isn't great they are a bit easier to watch this way, I also uploading a few of my earlier tests and reposted them below.

Here's the previous experiment I did, just testing my character in between a background and foreground layer in flash.



And heres the final 3d walkcycle, compared to my original 2d version.

Friday, August 10, 2007

Project 3 Proposal update

I made a quick walk cycle example of how I want sketch boy to look. I rendered out a sequence from 3ds Max, and then drew over each frame in photoshop to create a nice sketchy rotoscoped look.

Sketch boy example

Tuesday, August 7, 2007

Project 3 Proposal

After spending the past two weeks working on project 2, and creating a rich 3d aesthetic, I wanted to go in a different direction for project 3. I really liked the simple black and white outline look of the game we looked at earlier, Flyguy.

Using Flyguy as a precedent, I came up with my own character 'Sketch boy' by rotoscoping an image of an artist mannequin. I wanted to create a really low-tech hand drawn kind of feel to the game, as though somebody is drawing it as you play.

As far as gameplay is concerned, I think scrolling would work best, but I could see it working in other forms, such as isometric or even top down. The player, controlling sketch boy has to complete various puzzles to make it through the game. The puzzles are in the form of completing the landscape through filling in gaps in the landscape by drawing. Sketch boy only has a limited amount of ink to for each level so the player has to use it sparingly or they Will be left stranded. There will be switch's scattered through out the map, that will toggle parts of the landscape on/off. Which need to be tripped to complete the map.

A mock up of the sketchy style I want to use.

Project 2 Update

I have just finished rigging and animating the 3D version of my characters walk cycle, I used images of the original 2D cycle as a guide for the animating, but adjusted a few things such as the shoulder movement to make it look a little more natural. I rendered the animation out as a sequence of TGA images and then loaded them into flash where I placed them on the time line, each as separate Key frames.

I also quickly put together a basic environment of simple cubes to test in flash, I separated this into two separate layers, the foreground cubes, and background cubes and floor, and rendered these out separately. I then loaded these into flash and exported out a quick test. I am fairly happy with the result, but there a few things I would like to improve, such as the faint outline around the character, and perhaps a shadow for the character.

Here's a link to the test .swf

I have also been giving quite a bit of thought as to what I want the environment to look like, I didn't really want to take a normal landscape such as a city or jungle and simply model it in 3D, as for one, I don't think my 3D skills are quite up to it, but more importantly i don't think it would be terribly interesting. So I decided to go for quite a cartoony/artificial look.I found this image while searching for inspiration and felt the wireframe style of the hand was prefect, its just the sort of artificial/computerish look I wanted. I found a few more examples that also use this style, and I think are very effective.

Coincidentally this image also depicts a 2d Character being transformed into 3d