Step By Step Process

 Main Character

·       Step 1 - Creating the page layout and properties.

First, I open Photoshop then click ‘create new’. Click the mobile preset and I pick the ‘Android 1080p’. The height for the canvas is 1080 and the width is 1920. It is in pixels and have 72 resolutions. The color mode is RGB color and have white background. I didn’t change anything in the properties except that I put the canvas in landscape orientation and I untick the artboards.

·       Step 2 – Importing sketches from the planning stage

I drag the image from my file folder that I store all of my sketches in and into the Photoshop.

·       Step 3 – Digitalizing the main character and coloring them

 I use the tool the pencil to draw the outline of the main character. I usually use 5px for the size of the pencil. Pencil tool is use for drawing.

·       Step 4 – Coloring the character

I use the paint bucket tool to color my main character. In order to use the tool, first need to make sure that the lines are connected and if not connected then the whole canvas could be painted by the color that was chosen. I just click the area that I want to color then the area automatically colored by what color I choose.

The color hex for the dark grey fur is 2d2d2d the color hex for the emerald green is 50c878.

First, I pick which green is the best for the main character and image above is what the color of the eyes will be.

Then I pick which shade of grey is suitable and the above image is what I picked. The image below is the result of the colors.

Enemies

·       Stage 1 & 5

The above image is the sketch enemy dog while image below is the colored one. The color hex for the dog is e0cfaa.

·       Stage 2

The above image is the sketch enemy bear while image below is the colored one. The color hex for the dog is a16b42.

·       Stage 3

The above image is the sketch enemy child while image below is the colored one. The color hex for the skin is ffdbac, for the shirt is 000000, for the pants is a2cdff, for the shoes are 0077ff and lastly for the hair is 331f14.

·       Stage 4

The above image is the sketch enemy people while image below is the colored one.

Color hex:

For the skin is ffdbac, for the hair is ffeb77, for the shirt is 000000, for the pants is e4c890 and for the shoes is ffffff.

For the skin is ffdbac, for the hair is 000000, for the shirt is 77bfff, for the collar is 4f91ca, for the pants is ffebee and for the shoes is 0048ff.

For the skin is ffdbac, for the hair is 332015, for the shirt is aa511f, for the collar is 592f17, for the pants is d14b4b and for the shoes is 000000.

For the skin is ffdbac, for the hair is 5a3825, for the shirt is bfbfbf, for the pants is 000000 and for the shoes is 5cc3ff.

Game asset

This is one of the game assets in my game, this is from stage 1. I use the pencil tool to draw simple shapes on how the items in the game asset will look like. When I drew it too big, I use the marquee tool which will let me select the item in a shape of a rectangle when I want to move or reshape the item.

The above image is an example of marquee tool. It selects the item in the shape of a rectangle. The shape of the marquee tool can be from a very long rectangle to tall rectangle to even square, depends on the size that I need.

 

Or sometimes when there is not enough space to use the marquee tool, I use the lasso tool. It is the same as marquee tool but I can move them just like the pencil tool, I can make a free hand selection and the lines of the lasso tool need to be connected together in order to select the item.

The above image is an example on how I use the lasso tool. I move around the area or item that I want to move, copy, delete or resize.

 

*The process of creating the enemy, the main character and game asset is the same.

Last step is to export the image.