Art

Moodboard

Moodboard

Moodboard

This Moodboard contains various images that I will use as inspiration for the concept art of the game I have decided to create. The game I have decided to make is based on an archaeologist that travels to different places in search of hidden relics (artifacts). The images shows different obstacles that the archaeologist will encounter on his journey, it also shows different settings from pyramids and hieroglyphics to ancient Greek ruins, it shows a cartoon drawn archaeologist and also different artifacts that the archaeologist is searching for, all of these images are what I will use as inspiration for the design in my game.

Concept Art

Original Ideas of Archie the Archaeologist

Original Ideas of Archie the Archaeologist

This is an image of my original designs of my character, Archie the Archaeologist; I designed 3 different versions of the character. The reason I created 3 different designs was because I wanted to see which character looked the best and one that fitted in with the artistic style of the game. I annotated each version, writing about the different ages, clothing and colour used for the character.

Archie the Archaeologist's face

Archie the Archaeologist’s face

I also created a different design of the character’s face, the reason behind this was because I wanted the character to look not too old and not too young, I also wanted to create a sort of smugness to his personality, the way his facial expressions and grin are designed allow the smugness of the character to be expressed.  After long consideration and asking my peers which design looked the best I went with the smug looking archaeologist, and I then designed the movement of the character and scanned it into the computer and used Adobe Illustrator to trace over the image, I used the pen tool to do this and the other images that I have designed.  I then put colour on to the character, I used traditional colours for an archaeologist/explorer, I used Adobe Photoshop to put colour on to my character.

Character Movement

Character Movement

Feudal Japan background

Feudal Japan background

Feudal Japan Background with colour

Feudal Japan Background with colour

I originally intended to make 6 different levels for my game but due to time constraints the game will be released as a demo version which includes 3 levels. I have drawn the concept art of the backgrounds for all 6 levels, the first setting and level is ‘Feudal Japan.’ I searched Google to find different things which relate to Feudal Japan and I found an image of the traditional buildings so that is what I drew for my background. The buildings are in the background of my drawing and the bottom of  the buildings are being covered by cherry blossom trees (they are found mainly in Japan).  After tracing the image on to the computer using Illustrator, I had a look at the different colours of the Japanese buildings and the cherry blossom trees. Using Photoshop to put the colour into my image I was able to put different textures onto the image, the reason I did this was because it made the background look realistic. I was able to make the trees have a wooded texture to it by finding an image of a wooden texture and put the image over the colour and then lowering the opacity of the texture, I also made  the cherry blossom leaves look like leaves by changing the filter of the colour; I used the texturizer option and used grain as the filter. The hills that are in between the trees use the sandstone filter, this was to to create the visual effect of grass.  I then had to create the floor that my character would walk across, I decided to have the floor as cliffs as there is a point in the level when the character has to avoid falling down the cliff by using a moving platform.

Tree Stumps, Spikes and Moving Platform Concept Art

Tree Stumps, Spikes and Moving Platform Concept Art

In this level there will be different sized blocks, a moving platform, spikes and Musashi’s Samurai Sword (Artifact). The reason I used tree stumps for the blocks was because it went with the trees in my setting and I also used a branch as the moving platform because of the blocks being tree trunks. The spikes were based on Kunai, which are Japanese tools. I used the same texture for the tree stumps as I did for the trees in the background, this was to make the tree stump look realistic and the colour used for the Kunai spikes aren’t traditional colours but I felt that it made the spikes stand out and compliment the background design.

Tree Stump

Tree Stump

Kunai Spikes

Kunai Spikes

Musashi's Samurai Sword

Greek Shipwreck Concept Art

Greek Shipwreck Concept Art

Greek Shipwreck Background with colour

Greek Shipwreck Background with colour

The next level I have created is a ‘Greek Shipwreck.’ I got inspiration to draw the background like I did from a computer game that I had been playing at the time, the game was called “Secrets of the sea: Flying Dutchman.” The reason that I decided to set the level underwater in Greece was because the artifact that the character has to find is ‘Poseidon’s Trident’ and Poseidon was the Greek God of the sea. I included holes in the shipwreck so fits in with my actual level design of which the character has to jump on things and avoid pits, so I used the holes in the floor as pits. As you can see there are a few changes in the final design, I have included 4 holes on the floor of the shipwreck, I have also mirrored the original design, this was to extend the level. When putting colour into the setting I used different shades of brown for different areas, I used a light brown for the floor, a darker brown for the walls and an even darker brown for the boarded up wood; to make the shipwreck look wooden I used a filter and the texture burlap. For the sand I used the sandstone filter.

Character design for the Shipwreck level

Character design for the Shipwreck level

Scuba Diving Helmet sketch

Scuba Diving Helmet sketch

Scuba Diving Helmet

Scuba Diving Helmet

As the setting is underwater I had to make changes to my character’s appearance, the changes I made was that I put a scuba diving helmet on to my character, I drew the scuba diving helmet on paper first and then traced it onto the computer using Adobe Illustrator and the pen tool. I then put it into Adobe Photoshop and put colour into it, I used a yellow/brown colour for the scuba diving helmet and a dark blue for the glass of the helmet.

Barrels

Barrels

Poseidon's Trident

Poseidon’s Trident

Barrel

Barrel

Poseidon's Trident

Poseidon’s Trident

In this level there will be different sized blocks, hovering platforms, poison arrows and Poseidon’s Trident (Artifact). The reason I used barrels for the blocks was because it went with the setting of the shipwreck and they are known for having barrels on board and I also used a plank of wood as the hovering platform was because it fitted in well with the shipwreck and it’s as if there is planks coming out of the shipwreck. I made the barrels have a wooded texture to it by finding an image of a wooden texture and put the image over the colour and then lowering the opacity of the texture and for Poseidon’s Trident I used a gradient yellow/gold, for the wooden planks I did exactly the same thing as the texture on the actual shipwreck only I made the colour darker. For the poison arrow I used a gradient of black and red to give off the effect that the arrow has both blood and poison on it.Poison Arrow

Ancient Rome

Ancient Rome

Ancient Rome in colour

Ancient Rome in colour

The final level I created is Ancient Rome, I got inspiration for this design from one of the Horrible Histories magazines. As you can see I did make some changes for my finished design, I reflected the image and added in some different parts so it looked like one big building with little buildings surrounding it. The broken stairs are infact pits. Again I used the pen tool in Adobe Illustrator to trace around the design and then I put it into Adobe Photoshop and chose the different colours for different parts of the image that I thought made the setting look real and believable. I then made the building have a plastered texture by searching for a plaster texture on google and adding the texture over the top of my colour and dropping the opacity, this allowed you to see the original colour but also the plaster texture. I then used another texture for the floor, which was sand, I did exactly the same, I searched for sand texture and added it over the top of the colour and dropping the opacity.

Pillar (block)Small PillarFlameFlameSpear spikes (Rome)Spikes (Rome)

Mars the God of War's Helmet

Mars the God of War’s Helmet

Mars The God of War's Helmet (shadows)In this level there will be different sized blocks, fire, a moving platform, hovering platforms, spikes and Mars the God of War’s helmet (Artifact). The reason I used pillars for the blocks was because it went with the buildings in my setting and I also used the top of the pillars as the moving platform and the hovering platforms because of the blocks being pillars. For the flames I used red and yellow as the two main colours but I also searched on google to find some flame texture and added that over the top of my colour and dropped the opacity, this created a realistic looking flame, I also created a spawner where the flame will be produced from. The spikes are small spears, this is because in Ancient Rome they used spears as weapons and it fitted in with the setting. For Mars the God of War’s helmet I used a gold gradient for the main helmet and then for the the hair on the helmet I used red and used a darker red with the brush tool.

Scroll

Scroll

Map

Map

Scroll in colour

Scroll in colour

For the main menu I wanted it to look like a treasure map on a scroll, I first drew out the scroll and treasure map on separate pieces of paper and then scanned them into the computer. I then traced over them using the pen tool on Adobe Illustrator, after doing this I designed the scroll on Adobe Photoshop, I used a parchment image that I got from Google images to use as the texture for the scroll and for the handles of the scroll I used the gradient tool to make it look wooden. I then added the map on to the scroll. After doing that I added the name of the game and then added “touch to begin” the font I used was SF Fedora, I made the font colour orange and added a shadow to make it stand out.

I have used the scroll for the menu, information pages for each of the levels, the credits and the touch controls.

Information Page (Japan)

Information Page (Japan)

Information Page (Greece)

Information Page (Greece)

Information Page (Rome)

Information Page (Rome)

Information Page (End of Game)

Information Page (End of Game)

To make the information pages, I again used the SF Fedora font to explain what the levels were about and what obstacles and relics the level had. I also added an image of a plane, I first designed it on paper and then traced over it using the pen tool on Adobe Illustrator and then I added the plane onto the image of the scroll.

To make the touch controls I used the brush tool to create the arrow buttons, the reason I used the brush tool was so it looked like it had been rolled up along with the scroll.

Right Button

Right Button

Left Button

Left Button

Jump Button

Jump Button

Credits 1For the credits I used the scroll again. The first thing that appeared on the scroll is the name of the game, an image of Archie (main character) and the 3 different relics, I created this image on Adobe Photoshop using all the different images that are within my game and putting them together.

Credits 3

 

 

The next thing that appears is the writing “Designed and Developed by Luke Kiely” again I used the SF Fedora font and the following thing that appears is the writing “Featuring Sam Russell as Archie” Credits 4

Credits 2

 

 

 

 

 

 

The final thing that appears on the credits is the writing “A BOA Games Production” and the BOA Games logo.

Optimising
Using Illustrator I traced over the different images in high resolution, and then in Photoshop it allowed me to changed the height and width of the images without a loss of quality in the image. To create the images I had to delete the background and save the file as a PNG, the size of the background for the greek shipwreck and Rome levels were width: 2048, height: 768, with the resolotuion 72 pixels per inch. The reason I had to save the images as PNG files was because it ensure that the image did not have a white background around the image, on GameSalad you could only have a square or rectangle actor to put the image in, so I had to create each image with that in mind.

Job List

Art

Art

Art

Art

Art

Art

Art

Art

This is an excel document for the art within my game. It includes Game Logo, Feudal Japan, Greek Shipwreck, Rome, Scenes with information about the different places and artifacts, Musashi’s Samurai Sword, Posiedon’s Trident,  Mars’ The God of War’s Helmet, Tree Trunks, Archie the Archaeologist, Poison Arrow, Poison Arrow Block, Spikes, Flame/Spawner, iPad Controls, Barrels, Pillars, Moving platforms (stick and pillar). I have included notes on how I made the art work.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Screen shot of filter (Greek Shipwreck)

Screen shot of filter (Greek Shipwreck)

The image to the right is my artwork for the Greek Shipwreck setting, it is a screen shot of how I put the texture on to the setting. When putting colour into the setting I used different shades of brown for different areas, I used a light brown for the floor, a darker brown for the walls and an even darker brown for the boarded up wood; to make the shipwreck look wooden I used a filter and the texture burlap. For the sand I used the sandstone filter.

 

Screen shot of adding colour and texture(Barrel)

Screen shot of adding colour and texture(Barrel)

The image to the left is my artwork for the Barrels which are used as blocks for the Greek Shipwreck level. I made the barrels have a wooded texture to it by finding an image of a wooden texture and put the image over the colour and then lowering the opacity of the texture.

 

 

 

Screen shot of pen tool (Flame)

Screen shot of pen tool (Flame)

The image to the right is how I used the pen tool to create the flame for the Rome level. As I have done with all of my artwork within my game, I have used the pen tool in Adobe Illustrator to trace over my original design of the flames, in Adobe Photoshop I used red and yellow as the two main colours but I also searched on Google to find some flame texture and added that over the top of my colour and dropped the opacity, this created a realistic looking flame.

Leave a comment