Game Thesis

I have added a few more characters and another scene to the main demo. Please note that there are still many bugs but you can now go into the temple (middle village door) and the ‘cantina’ (end village door) and talk to a few of the characters.  In this post I want to talk about some of the influences behind the artwork and the techniques I used to produce the assets.

I am a great admirer of the late Ralph McQuarrie, whose concept art left a strong stamp on the original star wars trilogy. The places, vehicles, characters and compositions in his work are very striking.

(Source: http://www.screened.com/news/legendary-star-wars-concept-artist-ralph-mcquarrie-passes-away-at-82/3519/)

I also love the character design of Jamie Hewlett, perhaps best known for his work designing the concept band Gorillaz.

(Source: http://pitchfork.com/features/interviews/7588-damon-albarn-and-jamie-hewlett/)

The style I am most trying to emulate is that of Luke Pearson, the artist behind ‘The End Game’. I am using a similar style with black outlines for the characters and detailed backgrounds, although mine hardly compare to Luke’s incredible level backgrounds in particular.

(Source: http://lukepearson.com/2011/08/the-end.html)

As for the technique of drawing, originally for the concept artwork I used a vector drawing method which was quite time consuming. Also, the original size of the game was quite big - I reduced this substantially. I first got the idea because I was zooming out on the canvas in order to track bugs in the browser console, but decided it looked better this way. Of course the decrease in size will help the game’s performance and also means that it would display better on mobile phones (although mobile phone functionality/optimisation is going to be too time consuming for this project!)

Since I do all my drawing on paper first, I thought that the best solution for rapid creation of assets would be to draw them, and use the drawn outlines, adding colour digitally. The rough drawings were sketched, then traced with black pen on baking paper, then scanned. the background was removed and then painted in digitally. I am fairly happy with the result and the speed at which I am able to create the assets.

In the next blog posts, I will be talking about testing and further framework updates that have happened since the last technology blog post.

The new demo shows the current game framework in action, though not without its quirks! Once all the components are created, it will just be a matter of adding the all of the scenes, characters and dialogue. The code is also available on GitHub, and I am keeping a list of issues including ongoing bugs and future features.

Some of the major components of the game so far are as follows:

Walk To: Control of the character’s movement. In point-and-click games, traditionally the player’s movement is controlled by selecting the appropriate action (eg Walk To) and then clicking to where they want to go. 

• This Crafty MoveTo component was used as a reference. 
• I am using a Viewport which is integrated into the ‘Walk To’ component so that the background scrolls smoothly. 
• The component also decides whether to flip the player horizontally depending on which direction they are heading. 
• The Player’s movement is restricted to a MaxX and a MaxY value for every scene. This will influence the way the artwork for the backgrounds is created.
• I still need to add a walking sprite so that the character doesn’t appear to float over the scene!

Doors: Doors have now become a component so that each door can be initialised in the appropriate scene with a width, height, x, y and a pointer to the next scene.

Dialogue: This component reads a JSON file, which is organised into objects representing scenes and characters (including the player which will be a constant in any conversation).

• From the JSON file it figures out where to start (a starting point can also be determined manually) and how to split the objects into dialogue and the ‘next’.
• Part of conversations in many point and click games are user choices. The dialogue component determines how to split the choices so that each becomes a clickable list item in the UI (using jQuery selectors to do this).
• I still need to remove the choices once they have been selected or ‘used’.
• I also want to use this file or perhaps a separate JSON file to store descriptions of the items in the game (for instance if a player ‘Looks at’ an item).
• Still need to refine the ‘exit’ of dialog choices mode, eg with the ESC key or once they have come to the end of a conversation.

Keyboard shortcuts: These are for all the main actions (Walk to, Talk to etc) which just gives users more input options, especially if they are unfamiliar or frustrated with this old-school style of game play.

The next step for the framework is the Item system and Inventory. Once these are done, the main skeleton of the game will be complete! Other major functional considerations include animations for cutscenes. I want to utilise HTML5, CSS3 and Javascript as much as possible for any of the cutscenes.

Next I will be taking a break from the technological side of things to work on some artwork so that I have assets to complete the first level. Back to the drawing board!

I have been working on creating a rough outline for the story. My starting point was crystallising much of the research I have been conducting about asylum seekers and refugees into a set of common misconceptions about them which help to shape the goal of the game.

• Asylum seekers are not ‘queue jumpers’: many only get the choice between losing their life or leaving their home via illegal channels. Following the protocols to become an official refugee is often not an option.
• Asylum seekers do not ‘have it easy’ when they arrive at a host destination: some are professionals unable to work, most will have to go through years of applications and appeals the be allowed to reside at a host destination.
• Asylum seekers are not ‘criminals’ or ‘terrorists’: some are sick, others have been through unimaginable trauma, it is not appropriate to treat them as criminals by default.

I also read through a lot of personal accounts of asylum seekers and refugees, from sources such as the Refugee Council of Australia and also the SBS’s fantastic documentary series (and accompanying simulation game) ‘Go Back to Where You Came From’, which had some astonishing statistics such as that only ‘1% of the world’s refugees are resettled through official channels by the UN’ (from episode 2).

However, instead of using actual refugee stories as originally intended, I am abstracting some of the many themes I gathered from these stories to make a story that is not specific to any real culture, race or nationality. This gives me more freedom as I am not pointing fingers at any one government or system. Some of these themes are as follows: having to leave one’s home due to religious, political or ethnic persecution, leaving family behind, going on a dangerous and illegal journey, resettlement in an unfamiliar and potentially hostile environment.

Here is a rough outline:

Cutscene: Introducing the family and the loss of your parents for religious and ethnic reasons

Stage 1: Homeworld.
In this level you are to find a way off your homeworld as your tribe has become a target of the new government of the planet. You can’t leave your village. You apply at a government office for refugee status but they inform you that it will take months to process. You find a smuggler who is able to transport you off the planet illegally. You have to leave your sister behind.
Cutscene: The ship leaving the planet.

Stage 2: Spaceport
You are stuck in a spaceport as you don’t have the appropriate documentation for the guard to let you out. You manage to find someone who is able to supply you with documentation and another person from your homeworld who is able to give you the address of a resettlement facility where you can get accommodation. You leave the spaceport.
Cutscene: introduction to your new planet

Stage 3: Settlement
You have been resettled into a multi-level apartment block with many other asylum seekers and refugees, some from your homeworld. You need to find someone who has contacts on your homeworld can assist your sister to join you on the planet. You get an impression that residents of the planet have mixed feelings about asylum seekers and refugees. Eventually you are able to send for your sister.
Cutscene: Conclusion - brother and sister reunited

Now that I have an outline for the story, I am working on fleshing this out to include more detail for puzzles. From there I am using this to create a functional requirements document for the implementation. This may be the topic for my next post!

I have posted a very basic demo to my website which can be found here. The main objectives of this demo were to:

1. get familiar with the way Crafty works and 
2. make some progress towards a proof of concept

I feel I have done this even though it is very ‘smoke and mirrors’ at this stage. I used scanned rough sketches for the scene and objects to emphasise the fact that it’s a demo - I am concurrently working on some more detailed concept artwork, and even so I suspect the artwork will change and evolve a lot as the game progresses.

At the moment what you can do with the demo is: see that the main character animates (blinking), and pick up the item on the bar which then gets added to the inventory visually, displaying on the menu at the bottom. At the moment it also adds a reference to the item in an Inventory array. To see this you can type Inventory.inv into the console.

There are still a lot of things I want to do with the demo, but not too much before scoping out the functionality needed in detail. I really want to use HTML5 Canvas for this project as much as possible, but some elements are in the DOM because they worked better there, other things will have to stay in the DOM (such as text).

My to-do list for this demo is as follows:

• Have a better system for changing text on the menu bar (dynamic rather than static)
• Refactor item functionality into a component (class)
• Add some basic dialogue interactions

Other important things to note: naming will have to be smarter when many more items are involved and in general. Objects will also have to be named in such as way so as not to conflict with any existing Crafty objects. Also, when it comes to sprites I will have to make sure I am not duplicating whole images unnecessarily (eg the characters’ eyes could be the sprite rather than the whole thing) as this will have an impact on performance (loading times etc).

So that’s the demo. I will keep you posted as to when you can see some more functionality added. In the meantime, the next post will be about concept art, I hope to have a couple of characters and a scene drawn roughly to give you an idea of what it’s going to look like!

I have already been in touch with some wonderful organisations like Welcome to Australia who have provided me with some great links to refugee stories. There are also some wonderful and moving stories on video such as Tan Le’s TEDx talk.  I would like to weave in as many different stories as possible (or as time permits) into the game narrative. 

I want to take the narrative outwards from a global level to a galactic level. I think this will provide a lot of opportunity for interesting visuals, places and characters. There will be different races of beings with different languages and cultures, but the message will be that they are all from the same galaxy and should be treated equally regardless of their differences. The main character will progress through the game by talking to other characters, gaining and exchanging items, and hearing their stories along the way. 

The main character will be a galactic traveller who is in danger on their own homeworld, whether by conflict or environmental disaster. I think the main character should have (or at least appear to have) a choice about how they leave their homeworld. They might try to leave using the usual channels, but by necessity have to buy passage off the planet using less than legal channels. Perhaps the main character is leaving family behind that also need to be rescued. These are all common narrative threads and common obstacles that I have observed in the stories of refugees and asylum seekers.

I have drawn a rough sketch of the main character. I will post this next. The following blog post will be more about technology and a rough demo. Stay tuned!

I know what you are thinking - it takes dozens of people many months of hard work to design and implement a game. I’m going to talk about a few of the ideas I have in mind for making this process easier for myself.

I have some experience with implementing games using Flash, however for this project I want to explore new technologies like HTML5’s canvas and also use this as an excuse to become more competent in Javascript. However, I am a designer first and a novice programmer at best so I will enlist the help of a Javascript game engine such as Crafty, which is open source. It uses a component based system, and for someone like me that’s very familiar with JQuery, this could be the go. There are lots of other useful resources for HTML5 game development as I am discovering such as this simple polygon tool which could be used for mapping out a scene.

As for the game style, I want to avoid characteristics that might involve a massive learning curve for me (such as anything physics-based), and am leaning towards a point-and-click adventure game like one of my favourite games of all time Day of the Tentacle, a style which is also alive and well today as evidenced by popularity of this kickstarter project. This style of game lends itself well to exploring and engaging in a story. The player will have a range of actions available (eg talk to, pick up, look at, walk to) to interact with scenes, other characters and items. Therefore one of the main functional requirements will be an inventory system. I am hoping to use Crafty to get a simple demo of an inventory system up in the next week or two.

Meanwhile, I am working on the content and the story, which with this simpler style of gameplay will be essential to convey the message of the game. Stay tuned, as story and content will be the subject of my next post!

I am undertaking a thesis this semester. It will incorporate theories of gamification and game design, and use HTML5 technologies to create a game that challenges attitudes about refugees and asylum seekers that is also fun to play. Overly ambitious? Very likely.

I want to talk about where I got inspired to do this as a thesis topic. First, some incredible TED talks by Gabe Zichermann and Jane McGonigal. Secondly, the discovery of some fantastic game projects that blur the line between ‘serious’ (a term often used to describe games made for training or educational purposes) and fun!

One of my favourites is The End Game, commissioned by BBC4 to teach kids about philosophies and attitudes towards death. Not only does it achieve this in a subtle and thought-provoking way, but the visuals and gameplay are incredible. At gamesforchange.org I discovered many other games, including some about refugees and asylum seekers, which is the subject matter I am aiming to cover in my game.

Another game that sparked my interest is on a smaller scope is ‘A Closed World’, which deals with issues of sexuality and gender. In their research statement, the developers from GAMBIT describe the goal of the research as exploring the challenges involved in creating a game with such compelling and ‘uncommon’ content. 

This is also one of the aims or my project, as I imagine that the subject matter I have chosen will present many challenges for the game design. However, time permitting, I would also like to examine user responses to the game, not just the design and gameplay but their reactions to the subject matter and any potential shift in attitudes that could occur.

I have also set myself the very optimistic goal of accomplishing all of this in one semester. Stay tuned (stay following?) to see if I can accomplish this, my biggest piece of academic writing, and my first foray into HTML5 game development, in under 6 months!