Gamasutra: The Art & Business of Making Gamesspacer
arrowPress Releases
July 30, 2014
PR Newswire
View All
View All     Submit Event





If you enjoy reading this site, you might also want to check out these UBM Tech sites:


 
2D Game Art for Programmers - Apache-style helicopter
by Chris Hildenbrand on 09/17/12 01:45:00 pm   Expert Blogs   Featured Blogs

The following blog post, unless otherwise noted, was written by a member of Gamasutra’s community.
The thoughts and opinions expressed are those of the writer and not Gamasutra or its parent company.

 

It's been a while and I have not kept up with my Gamasutra blog at all (hanging my head in shame) but there are still a lot of people still come from here to my blog over at blogger.


Here's something close to my heart. Ever since doing the art for HeliAttack 2 and 3 back in 2003 and 2005 I fell in love with helicopters. They just make great game assets. 

Back then it was all pixeled and took what seemed like forever to create. In the game there were a few helicopters with limited variations. 

Creating a similar object in vectors allows for easier manipulation and variations. It also makes animations a lot easier and more flexible. 




This tutorial looks a little bit more complex than the previous posts - but I tried to break it down into easy steps and simple shapes. I hope it worked. 


Note:
As with all the tutorials prior I use squares and circles and deform them rather then 'hand-draw' the shapes. With the body of the Apache-style helicopter it might be easier to 'just draw' the shape with the straight lines tool rather than place squares and modify them later - but it takes a little more skill to get the shape right that way.  





Note:
Now you have a basic and recognizable helicopter. It's a good point to save and continue with a new file to give you a base shape to go back to when creating variations.


The next step is adding details (guns, missiles, rocket launchers, etc.) and then add depth to the helicopter by adding some highlights and shadows.


I use basic shapes in light and dark colours - in this case white and black - with transparency to shade the object. This allows for easy changes to the base colour (e.g. an army green or a bright red for an enemy object) without having to redo the shading. 

Note:
If you want softer shadows and lights use a more yellowish tone for the highlight and a dark brown or dark purple for the shadows. 



 
Here's a version scaled down  
to something resembling an 
iphone (lo-res) ingame size: 


I hope the complexity of helicopter didn't scare you off and you enjoyed the tutorial. In the end it's just another bunch of simple shapes combined to form something bigger. 

Addition:
I continued to work on the helicopter to make a tutorial on modification of the shapes to create a new asset quickly.
[http://www.gamasutra.com/blogs/ChrisHildenbrand/20120919/177927/2D_Game_Art_for_Programmers__Apachestyle_helicopter_modifications.php



As promised another free bit of art to make up for the long time between posts. Enjoy!

Get the source art (svg file) of this tutorial for FREE
Download the inkscape SVG file in ZIP archive from my blog


Related Jobs

Firaxis Games
Firaxis Games — Sparks, Baltimore, Maryland, United States
[07.30.14]

Senior Visual Effects Artist
Turbine Inc.
Turbine Inc. — Needham, Massachusetts, United States
[07.30.14]

Software Engineer, Mobile
Big Fish Games
Big Fish Games — Seattle, Washington, United States
[07.30.14]

Director of Product Management
Turtle Rock Studios, Inc.
Turtle Rock Studios, Inc. — Lake Forest, California, United States
[07.30.14]

Technical Artist - Turtle Rock Studios






Comments


Curtiss Murphy
profile image
Nice work! Thanks for the simple tips.

Adam Bishop
profile image
I've got nothing to add here, I just want to say that these tutorials are amazing and I really appreciate them.

Francisco Javier Espejo Gargallo
profile image
@Chris. I'm a QA Manager but in my free time I'm doing games with my wife. I've been learning inkscape with your tutorials, ands that's the result:

http://www.youtube.com/watch?v=2-mNS23bdTo

:) Thanks a lot men!

Chris Hildenbrand
profile image
Nice job! I am glad the tutorials helped you.

Kris Steele
profile image
What graphic program are you using here?

Chris Hildenbrand
profile image
I am using Inkscape for these tutorials. http://inkscape.org/ It's a free tool that is not quite an illustrator competitor but a good basic set of tools for creating 2D vector art.

Jonathan Jennings
profile image
as a programmer my artistic skills are lacking in the worst way so i appreciate when any artist can help me strengthen that much weaker side of my development ability. it is frustrating to want to make a game but to know that no matter how hard i work on the core mechanics the average user will not touch my game due to how visually poor it looks.

but THANK YOU FOR THE TUTORIAL!!!!!!

Chris Hildenbrand
profile image
You are most welcome!


none
 
Comment: