Wednesday, 5 September 2012

Google Pulls Support for Unofficial Weather API

Well, it had to happen, it was never officially supported, and now it has. As Slashdot has reported, the Google Weather API is no more.

But... there are some alternatives, notably the Yahoo weather API - more details here:

http://dansinteractive.blogspot.co.uk/2011/03/finding-weather-with-yql-and-yahoo-api.html

And, if you don't get on with that, you might take a look at this alternative:

http://www.wunderground.com/weather/api/

Happy weather forecasting :-)

Saturday, 14 July 2012

Game Designers

You've heard of Alfred Hitchcock, Steven Spielberg, Ridley Scott, James Cameron? Sure. All film directors. Visionaries in the medium of film. Artists and creative geniuses every one of them. But what about the medium of the computer game? Who were and are the names in games?

Perhaps like me you also "wasted" many holidays, evenings and weekends, as a youth, playing computer games. The first game I remember was "Jet Set Willy". A friend had loaned their Sinclair Spectrum to my older brother (I must have been about 8 at the time) and after what seemed an age of waiting for it to load there before my eyes was the first computer game I ever saw working in my own home. Since then I have played many games on many systems. Over the years home I have lived in hosted various home computer and game platforms - ZX81, Spectrum 48k, Oric, Spectrum +2a, NES, Game Gear, Atari ST, Atari Lynx, Master System, Mega Drive, PS1, XBOX, XBOX 360 and the Wii. Not to mention more iterations of PCs than I can remember, and of course my old iPAQ PDA, and now my Android smart phone. I played games on them all, more games than I can possibly remember, and behind each game were clever, creative designers pouring their ingenuity into their creations like the Scotts and Camerons of the gaming world.

Having recently become acquainted (and in some cases re-acquainted) with the knowledge of some influential names in the game industry, I decided to do some homework to learn more about other important names that influenced my youth. In other words, who were the Hitchcocks and Spielbergs, the game designers, behind my favourite games, and what do they have in common that I can learn from?

Matthew Smith

While possibly not strictly a game designer by the current definition, Matthew Smith probably represented the nearest equivalent in 1983. Strictly Matthew was a programmer, but as often seems to be the case (the OS user interface and the WWW being prime examples) early uses of computer technology, including in games, were driven by programmers. Mathew is best known for his work on Manic Miner and Jet Set Willy, for the Sinclair ZX Spectrum. Both represented early examples of the platform game genre.

Matthew's games demonstrated that playability was of high importance along with an understanding of the capabilities of the destination platform and how theses can be harnessed in creative and innovative ways. One example of Matthew applying this is the use of in-game sound in Manic Miner, it was the first Spectrum game to include in-game sound by making clever use of alternating CPU attention between game and sound.

Paul Woakes

Paul Woakes gets the first developer and concept credit for probably the game I played the longest - Mercenary. I played it on the ZX Spectrum, but it was available for several platforms. Produced in 1985 Mercenary was the first full 3D game, and first open world game, I ever played. Conceptually and technically it pushed some boundaries (particularly on the Speccy), delivering a unique gaming experience that made it stand out from the flat linear game play that was more common at the time.

Looking purely at game play (and not at 1980s technology limited graphics) Mercenary implements several of the approaches we still see today in open world games, including interactions with NPCs that push the story along and direct the player. I see Paul as a pioneer of 3D open world games.

Robin and Rand Miller

One of the best games I never completed was MYST, designed by Robin and Rand Miller and released in 1993. From a technical point of view it made innovative use of what was in effect a system of hyperlinks, and overcame limitations in the real-time 3D capabilities of the time by making innovative use of pre-rendered static images and animated sequences. The visual design was fantastic and combined with the slowly unfolding story and interlinking puzzles results in an immersive believable 3D world. Although there is no threat of violence ever in the game, the haunting loneliness, ambience and surreal landscapes always had me "looking over my shoulder".

For me this game really stands out as an example of designers Robin and Rand Miller being able to think of absolutely everything while demonstrating a high level of creativity and originality - a complex story that must be revealed in parts, complex puzzles, visual style, architecture, game play, game mechanics, use of available technology... - and how it all must come together to make a seamless whole.

Common Attributes

There are some schools of thought that suggest it is possible to "bottle excellence". That if we knew the ingredients of excellence we could teach anyone to achieve it. What attributes then do these four game designers demonstrate that I can learn from?
  • Creativity - leading to originality
  • Understanding of the available technology - in order to innovate with it and to push its boundaries
  • A holistic view of the whole creation - seeing both the whole and the details and how they fit together
  • Never giving up - because nothing ever gets finished if you do
Thanks guys :-)


Tuesday, 10 April 2012

Getting creation event coordinates for Game Maker

I am currently getting into using Game Maker for games development, and am beginning to use 'timelines' to initiate the creation of 'enemy' object instances.

Two of the parameters needed in the object instance creation event are the X and Y coordinates for the object's creation. This is very easy to input, but only if you know the intended pixel coordinates off the top of your head, which is less easy to simply guess at, and for some games may need something more precise than a guess.

One way to find out these coordinates is to keep reverting back to the 'room' and hovering your mouse over the grid. As you do this some digits in the bottom left of the screen will tell you the nearest grid point X and Y to where your mouse is hovering. You could make a mental note, then revert back to the timeline and input the digits.

Personally, I find this annoying and fiddly.

So, to save me some annoyance, and speed up my development, I have produced a couple of game screen coordinate reference grids that help me. All you do is print them out and keep them handy.

My guess is that if they help me, they might help you, in which case you can download the game screen coordinate reference grids in PDF format here.

Please note these are released under a creative commons license.

Happy game developing.

Monday, 9 April 2012

Getting used to code free game development

Not too long ago I began a games design course to formalise and extend my knowledge and skill in this area of interactive media. The interactive media of my earlier career has evolved over the last decade into what I recognise are two distinct areas. While web design has been around for longer than that, it's earlier "1.0" incarnation was barely able to support what might be termed "interactive media", which back then was pretty much the sole domain of CD ROMs. With the development of Broadband, faster computers, and browser technology, what used to be delivered on CD or DVD is now easily obtained online - so that now interactive media = web design (to a great degree). The other direction of the interactive media industry then, still delivered on hard media, is Games. Since I know web design and Flash fluently, I decided to make the move in the direction of game.

The introductory part of the course, like many courses, assumes little or no knowledge. So we are using Yoyo's Game Maker as the initial authoring tool to learn basic development concepts. Powerful though Game Maker is, I do find the "code free" development slightly frustrating. I finally find myself at the other end of the ladder than I was 13 years ago. Back then I would have given anything to be able to build games, or any complex interactive media, without having to write a line of code. Since then I have got down to it and learned a great deal of ActionScript and such like over the years, and now find the coding aspect logical and sensible. Now I am forced to use a GUI to drag icons around to make "code" I find it frustrating, but am getting used to it.

Take this example for instance:


The visual equivalent took a bit more thought to drag together, than the ActionScript based syntax I am now used to. It's partly because of being unfamiliar with where to look for the draggable items, and partly because it would just be quicker to type.

I laugh to myself because now I finally understand what my coding whiz brother, and others like him, were thinking when I took delight in code free authoring environments all those years ago. They found them slow in comparison to coding by hand. And now... so do I.

Does this mean I have arrived?

Meanwhile, I am getting used to Game Maker, and I understand I am able to code by hand if I want to so I am happy to recommend this excellent product. Tally ho!

Friday, 3 February 2012

Normal Maps of Coins Part 2

In my last post I produced a normal map of the side of a British pound coin. It was an early attempt at following this normal map tutorial, and the results were passable. But on evaluating the results I also identified some fine tuning I could make to my own technique at the photograph stage to make the edges of the raised areas sharper. This was the result.



On this occasion I did increase the angle of the light, holding it higher above the coin to reduce the shadow length, and as you can see this results in much sharper edges. The benefits of a sharper normal map are instantly visible in the 3D render below.

Unlike the pound coins, which needed a grime effect adding to help define the grooves, the ten pence texture is a shiny metal, with details visible purely from the shape information held in the normal map. Every scratch, dent and line you see here is from the normal map, making it look much more real.

In this image the two pence coin uses the same photos the normal map was generated from, though put through a different process, to create dirty areas and reflective areas on the coin to mimic age and wear.


Full instructions in a future post (when I have more time).

Friday, 27 January 2012

Normal Maps from Photos

Normal mapping is a vital part of 3D modelling and rendering these days. In some cases it take hours off your modelling time, and in others hours off your rendering time (and sometimes both).

A while ago I came across this tutorial about making normal maps from photos. I finally got round to trying it.

Introducing the fruits of my labours - this example of mine is the side of a well worn pound coin.


You don't need Photoshop to do this, and to prove it I used the GIMP image manipulation program to make the normal map, and then applied and rendered in Carrara below.


You can see from this render that it works, but some of the edges need to be sharper.

A brief critique of this attempt shows the angle of the light source was too low when photographing the coin, making long shadows, and positioning the light source slightly higher would shorten the shadows and give sharper less buttery results, but having tested it using the 3D preview mode in the GIMP Normal Map Filter, it isn't half bad, and much quicker than trying to build a high res mesh, or digitally painting a height map for conversion to a normal map using tools like the Nvidia Normal Map Filter.

For some objects you really should give this a try.

Of course, even this early attempt is usable if supported by other channels such as shine and highlight (specular) using a grayscale map based on the same photos as the normal map. I also used the same grayscale map to mix two shades of coin colour to show a diffrence where dirt gets ingrained and where it gets rubbed off and used the same map again to give two levels of reflection because dirt is not as reflective as metal. Combining all these with the normal map brings a whole different level of realism.


I'll explain how I used the same photos as the normal map to make the grayscale specular map that I also used for reflection and grime in a future post.

Tuesday, 18 October 2011

Game Development - High Score Leader Boards in Flash

One way of increasing the repeat appeal of a game, particularly for 1 player games, is to include a leader board of high scores. This gives the player an additional goal of beating their previous best score, allowing them to compete with themselves, and other players, even if the game has only 1 player mode.

As long as your game stores the player's score under the variable "score" this example should provide a good starting point for your own leader board or high score board.

In this example I am using ActionScript 2.0 in Flash.

The Code

The code for this is split into 3 parts. First we create a multidimensional array for keeping the scores and player signatures. Second, we store the score from the game, third we create the leader board that transfers data in and out of the array.

Part 1 - Create a Multidimensional Array

In my game the leader board only shows the top 10 scorers. For each one it displays the score and a 3 character signature from the player.

Before we can store data we need to create the place to store it. In this case I am using a multidimensional array. Multidimensional because I want to store 10 elements (1 for each of the top 10) with 2 data elements (score and signature) per player. Doing it this way allows me to sort them later based on score so I can display them from highest scorer to lowest scorer.

My approach was as follows:

/*NEW ARRAY*/
/*Make a new array object*/
var leaderboard_array:Array = new Array ();
/*'Push' data elements onto the array*/
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});
leaderboard_array.push ({initials:"---", score:"0"});

This code must run only once, run it again and you will add to the end of your array, eventually making it huge.

In effect we create an array of 10 elements, that each contain an array of 2 elements. An array within an array. Using the approach I have, where I have named each 'sub'-element "initials" and "score" means that later I can refer to these directly by name - which makes coding a bit easier to do and debug.

My new array includes pre-coded default values, this means something will display the first time and we don't get a blank leader board.

Part 2 - The Game

Your game is your own. The important thing is that you store the players "score" at the end of the game.

Because the my_array.sort(Array.NUMERIC)in Flash does not work correctly (see here), we cannot use strict datatyping  when we define our variables. So, when you first define the "score" variable, all you need to do is:

var score = 0;

Don't do:

var score:Number = 0;

Or the code won't work later, when we have to treat "score" as a string for sorting.

When the game is over, just make sure you store the player's score in the "score" variable, e.g.:

score = endgamescore;

Part 3 - The Leaderboard

At this point we have an array, and a "score". In this part of the program we need to do the following as essential elements.

a. Test whether the player's latest "score" is greater than the lowest score on the current leader board.
b. If it is, allow the player to input a 3 character signature and store it, along with the "score" in the array replacing the previous lowest score.
c. Sort the array by score so each one is listed in order of greatness.
d. Display the contents of the array in text box to show the leader board to the player.

There is more to it than that, especially since sorting numerically in Flash is not actually possible by direct means - I have gone into detail on that on another post - so much of the code is required to solve that problem.

The following code relies on the stage containing:

1. A text input box with the instance name "initials_txt"
2. A button with the instance name "button_btn"
3. A dynamic text box with the instance name "lb_txt"

The code is then as follows:

/* vars */
/* strict datatyping is off for score and sortscore in order to sort it due to restriction in Flash */
var sortscore = 0;
var initials:String = "";
/*set character limit on input text*/
_root.initials_txt.maxChars = 3;
/*PRE-POPULATE LEADERBOARD WITH CURRENT DATA FROM ARRAY*/
for (var i = 0; i < leaderboard_array.length; i++) {
    _root.lb_txt.text += leaderboard_array[i].initials + " " + leaderboard_array[i].score + "\n";
}
/*ADD NEW SCORE ON SUBMIT*/
_root.button_btn.onPress = function () {
    /* get player name value*/
    initials = _root.initials_txt.text;
    /*convert score to decimals ready for correct sorting*/
    sortscore = score / 10000;
    /*convert score values in array to decimals ready for correct sorting*/
    for (var i = 0; i < leaderboard_array.length; i++) {
        leaderboard_array[i].score = leaderboard_array[i].score / 10000;
    }

    /*sort current board by score - low to high*/
    leaderboard_array.sortOn ("score");
    /*if player score is higher than lowest score on board, replace it with player score and name*/
    if (sortscore > leaderboard_array[0].score) {
        _root.leaderboard_array[0].initials = initials;
        _root.leaderboard_array[0].score = sortscore;
    }
    /*sort again to position the new score and initials correctly in order compared to other scores in array*/
    leaderboard_array.sortOn ("score");
    /*convert all the 'decimaled' scores back again to real scores*/
    for (var i = 0; i < leaderboard_array.length; i++) {
        leaderboard_array[i].score = leaderboard_array[i].score * 10000;
    }
    /*reverse the order of the array to show scores from high to low*/
    leaderboard_array.reverse ();
    /*clear existing text from the leader board text box*/
    _root.lb_txt.text = "";
    /*print new array content to the leader board text box*/
    for (var i = 0; i < leaderboard_array.length; i++) {
        _root.lb_txt.text += leaderboard_array[i].initials + " " + leaderboard_array[i].score + "\n";
    }
};

That's the main thrust of it - read the comments in the code to see what each lump of code is doing. Of course there is scope to develop on this yourself, but I hope this helps. Happy leader board-ing.