"Life is too short to make bad art."

Thursday, March 5, 2015

Complete Game - the beginning


After a bit of celebrating the 2 million mark (I hope you got the presents alright - according to the stats it was a success), some work finishing projects that would have stopped proper focus on this series of tutorials and a little bit of time to think about the right approach and order - it's finally time to get started.

Let's begin by defining the goals:


  • make all the art to complete a game (which is stating the obvious...)
  • make it a feasible scope (we are not going for a MMO RPG with sheer endless amounts of art assets)
  • make it easy to follow (there is no point going for fancy sketches and illustrations that require some ridiculous talent - it might look nice but is not helpful for the readers of this blog)
  • incorporate different and new tips & tricks in the process (I wand to use elements from previous tutorials but also explain some new ideas that have not yet been covered)
  • keep it within Inkscape / gimp (and I am tempted to give krita a try for this project) so i all done with open source tools
  • create the art for different platforms (Android, iOS and PC)
  • enjoy doing it (it's a lot easier for me to explain things in my tutorials that I enjoy creating (unlike realistic zombies, blood, gore, first person shooters and a lot of other topics I rather leave to people with an interest and talent for doing those)

So... let's start throwing around some ideas. One thing I learned from forgetting all those 'great ideas' I had in the oddest moments (e.g. while diving the Great Barrier reef and seeing some weirder than weird critters and colour combinations that are totally unreal) is to have a notebook and a pen and preferably my mobile phone (camera) with me at all times. Write things down that would be cool for your game - from the old guy with the funny walk and the cane he's carrying but not using to the colours scheme you see while doing grocery shopping on a kid's chewing gum packaging (that you wouldn't want to buy just for reference sake).
I don't bother too much with archiving these things but rather throw them all into a 'reference' sub-folder in the project.

Another great way to get inspired is by playing games that you enjoy and instead of keeping an eye on the game's objective look for the things that stand out, look cool, feel great and try and work out how they created them. 
With visuals it usually helps when you search in Google images for screens of those games / effects later to see them in still image. Save those right away, pin the, pocket them, bookmark them. It's usually lot easier to find them on your hard drive than search the internet for that 'image that got away'.

A lot of these 'idea sparks' will not make it into the game but might lead to something else that turns into a cool feature.

For this project the initial spark was a cog I did for a user interface. The basic cog is easy enough to create (yet a few tips and tricks on how to speed the creation up would make a nice tutorial).



While working on some variations of cogs in different sizes and varying levels of detail the canvas got a bit of a 'steampunk' appearance to me. Those elements would make a nice background for a platform game. It would probably look great if the background would be filled with animated cogs.

I rearranged the cogs a little and put them in a separate layer. On top of it I created some boxes to represent the platforms to give me a quick idea of what it might look like. 



This defined two aspects - the look and feel: I am going for a steampunk atmosphere (using metal, brass and cast iron) and it's going to be some sort of platform game.   

Next up is the character. 

Note: For me the design of the main character defines the whole look and feel more than any other element. You want it to be unique, recognizable and in most cases likeable, able to perform all tasks set by the game design (e.g. walk, run, jump, swing a sword, fire a gun, shoot a hook, etc.) and .


What kind of character would look cool on a background like this. I think most of us have seen enough steampunk illustrations to instantly jump to an image of the gentleman with top hat and a mechanical limb, a big furnace strapped to his back or a crazy contraption of a weapon in hand. As much as I would like to do one of those, he poses two problems: the level of detail would make it hard to fit into just one tutorial and his proportions would create problems with the level design (he would have to be tall - with the hat even adding more height). Usually game characters for platform games are on the square side for obvious reasons. In the old days you had a limited amount of square 'sprites' in (what now appears to be ridiculously small sizes of 8x8 or 16x16 pixels) and you just get more level on the screen when you don't have huge vertical space between platforms.
Note: I do realize that there is a multitude of very successful games that pull it of perfectly.

The main character needs to be something a little more stout. He needs limbs to make animations interesting (and a bit more work). A flying teapot might be fun but not good tutorial material. He also needs to have big eyes - to show some facial expressions during the animations.
I recently added a robot to the BlockBuddies and I did enjoy creating him. There is also a cute robot in the game 'The Adventures of Shuggy' I did the artwork for a few years back. He's featured on a poster in my living room as I do have a soft spot for him. 




Robots connect fine with the steampunk theme, which makes them a good choice for the main game character. The can be simplified enough to explain the creation process and yet do all the animations and game mechanics needed for a platform game.

In the next post I will get started on a character design with some sketches and creation in Inkscape.  


5 comments:

  1. Chris, nice introduction to the series. I cannot wait for the next post! Sometimes I would really give up my programming skills in favour of graphic skills! But every time you help me with your amazing tutorials! Thanks a lot for that!

    ReplyDelete
  2. Good intro!
    Thanks, will wait for next post.

    ReplyDelete
  3. if everybody donated 50 cents, you would be a millionaire *gasp*

    ReplyDelete
  4. "- create the art for different platforms (Android, iOS and PC)"
    Why art need to be platform dependent? Images are just images? Or am I wrong?
    Look forward to see all the rest!

    ReplyDelete
    Replies
    1. You are right - sort of... The reason behind using Inkscape or other vector tools is the scaling. You can create the art and adjust it afterwards to match the game resolutions. Pixelart on the other hand is set in size. You can scale things up but you end up with either nasty antialiasing and blurring or go with the retro pixel style and scale without 'smoothing' and get the blocky retro look.
      I did a lot of pixel art games in the past and the screens where designed for a specific device and resolution and a lot of the time you had to touch up and recreate some of the art to make it work on another device and still look good.

      In this tutorial we will go with the big screen size of the retina iPad or the OUYA screen size. That way the art (when exported to pixels) is big enough to be scale down for other devices - rather than have to scale them up (which leaves us with nasty results most of the time).

      Delete