If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!

As a programming novice, it was only a matter of time before I ran into a brick wall making this game. Luckily, someone saved me at the last second. Jody Hall of The Flash Connection, a certified expert in Flash CS3 (and a talented mazoonist!) liked my artwork so much that he offered to lend a helping hand in the creation of the game.

Now thanks to Jody, the guts of the game are developing much faster (and far more professionally) than I ever thought possible, with custom classes to increase efficiency and usability, for me and for the player!

Artwork’s coming along nicely, too. Hopefully more updates soon

I thought it’d be interesting to show the progression of a scene that I’ve been drawing for the game recently. So here it is!

A simple line drawing - inspired by my own kitchen. Make sure the perspective’s spot on.

Add a basic light source and reflection - to give some depth.

Add atmospheric lighting and detail to reflective surfaces - tweak the opacity of the lines and surfaces according to how much light they will be exposed to.

Add detail to cupboards and add in a foreground element - I wanted something to fill that bottom corner.

…but what about that big empty space on the left-hand side?

Populate the space with objects - I extended the wall and added scratches, damage, stairs and wallpaper.

Almost done!

The more I think about the tone and atmosphere of this game, the more I realize just how important it is to have a visual style that separates your game world from everyone else’s. A lot of elements go into creating a unique interactive experience, such as narrative and gameplay, but it’s the visual style that predominantly sets the tone and atmosphere of a game. Music plays a huge part, too and I plan on having a fairly robust set of tunes that reinforce the themes presented in the game.

A distinctive use of colour is definitely at the forefront of my mind as I draw up backgrounds and characters. I want the colours to mean something to the player, but in a thought-provoking way. It’s amazing how colours can be used to provoke or guide people through an experience. A few games come to mind when I think of colour specifically:

Killer7 by Capcom (GCN/PS2)

Not to forget Patapon, LocoRoco, Fallout 3 etc. etc.

Just in case you thought I was dead, here’s a little update on the game. Since my last post I’ve written some dialogue between the player and the first character you encounter in the game. I’ve got it exactly how I want it. I’ve also drew two new characters, complete with animated mouths for a bit of chatting! More soon.

So, I’ve completed about half a scene of the game so far and I thought it’d be interesting to show just how much coding that takes:

Mouse.hide();
stage.displayState = StageDisplayState.FULL_SCREEN;
stage.scaleMode = “noScale”;

import flash.ui.Mouse;
import fl.transitions.*;
import fl.transitions.easing.*;

var fade_in:Object = new Object();
fade_in.type = Fade;
fade_in.direction = Transition.IN;
fade_in.duration = .5;
var fade_out:Object = new Object();
fade_out.type = Fade;
fade_out.direction = Transition.OUT;
fade_out.duration = .5;
var forest_background:background_forest = new background_forest();

var default_cursor:cursor_default = new cursor_default();
default_cursor.visible = false;
var over_cursor:cursor_over = new cursor_over();
over_cursor.visible = false;
var owl_shadow:scene_object_owl = new scene_object_owl();
var owl:character_owl = new character_owl();

addChild(owl_shadow);
owl_shadow.name = “owl_shadow”;
owl_shadow.x = 115;
owl_shadow.y = 233;
owl_shadow.addEventListener(MouseEvent.CLICK, owl_shadow_clicked);

function cursor()
{
addChild(default_cursor);
stage.addEventListener(MouseEvent.MOUSE_MOVE, cursor_move_handler);
stage.addEventListener(Event.MOUSE_LEAVE, cursor_leave_handler);
}

function cursor_move_handler(evt:MouseEvent):void
{
default_cursor.x = evt.stageX + 1;
default_cursor.y = evt.stageY + 1;
default_cursor.visible = true;
}

function cursor_leave_handler(evt:Event):void
{
default_cursor.visible = false;
}

cursor();

function cursorOver()
{
addChild(over_cursor);
stage.addEventListener(MouseEvent.MOUSE_MOVE, over_move_handler);
stage.addEventListener(Event.MOUSE_LEAVE, over_leave_handler);
}

function over_move_handler(evt:MouseEvent):void
{
over_cursor.x = evt.stageX + 1;
over_cursor.y = evt.stageY + 1;
over_cursor.visible = true;
}

function over_leave_handler(evt:Event):void
{
over_cursor.visible = false;
}

owl_shadow.addEventListener(MouseEvent.MOUSE_OVER, over_over_handler);

function over_over_handler (evt:Event):void
{
cursorOver();
removeChild(default_cursor);
}

owl_shadow.addEventListener(MouseEvent.MOUSE_OUT, over_out_handler);

function over_out_handler (evt:Event):void
{
cursor();
removeChild(over_cursor);
}

function owl_shadow_clicked(e:MouseEvent):void
{
TransitionManager.start(owl_shadow, fade_out);
addChildAt(owl, 1);
owl.x = 500;
owl.y = 450;
TransitionManager.start(owl, fade_in);
}

stop();

Now I’m by no means a programmer - I understand what each line of code does here and it’s all working nicely, but I lack the fundamental programming knowledge to talk about it, so I’ll just list what that big chunk of code does:

• Removes the default cursor and replaces it with my own, as well as changes it when the player mouses over a “hotspot”.
• Makes the game full-screen on your monitor.
• Makes the first scene appear at the start of the game.
• Adds a clickable object to the scene and determines where it is.
• When object is clicked, a character fades into the middle of the screen.

If you’re good at programming, feel free to point out my n00bish methods