Art Bible

General techniques:

b9717673-1803-41df-8d34-b11eb540b8d3All art created for The Way Home is made using the Procreate app and all of the standard brushes included. Most brushes used are at full opacity, but the size will change depending on what’s being drawn.

The Alpha Lock tool is key for shading, enabled by going into layers, tapping on the layer with the desired shape and tapping Alpha Lock. 

The Photoshop equivalent of Alpha Lock is Lock Transparent Pixels. 

Pixel count: 1920x1080px

Aspect ratio: 16:9

Characters:

General Style:

271a4987-521e-4411-becf-6c4272f4d252

Physical style features longer limbs and shorter torsos, with enlarged heads with smaller necks to give focus on expressions/facial features and larger feet to balance the character design. Length of limbs should follow biological proportions in relation to each other (i.e. fingertips reaching mid-thigh) however the length of the torso does not need to follow these proportions.

90905a28-ea53-461f-9460-cdf500f1180b

 

Faces do not adhere to biological proportions except that eyes are placed halfway down the face:

Eyes/Eyebrows: Large eyes with solid black pupils and irises, eyebrow shape will change depending on character but aren’t overly detailed – able to be represented by a single line. Eyebrow colour is a few shades darker than hair colour.

Noses: caricatured or smaller depending on the character.

Mouths: a simple line which is proportionally small in comparison to the rest of the features.

Female:

Face: Darker lines above and below eyes to represent eyelashes. Thinner eyebrows. Generally smaller noses. Design can feature drawn lips instead of just a line for the mouth.

Body: Hips wider than upper torso, softer angles on shoulders. More curves throughout body.

Male: 

Face: Larger, straighter noses, raised higher at the bridge. Thicker eyebrows. No line on the bottom of the eye.

Body: Wider shoulders, narrower hips. More angular joints and a generally squarer appearance.

Hope: 

292b892a-2b9d-46a4-a99a-4a752743750e

Face: Square face, pointed chin. Short, wide nose, upturned. Eyes are quite square in shape, well outlined to represent eyelashes. Eyebrows are arched but fine, still allow for plenty of expression. Mouth is small, turned down in the corners when sad or scared, a flat line when neutral and lopsided when happy/smiling.

Hair: Short, straight, dark-brown pixie cut with a long fringe parted on Hope’s left, player’s right.

Body: Boyish physique whilst still conforming to general character design. Wider hips, but skinny, gangly limbs and big feet to show the disproportionate growth of teenagers. Fairly flat-chested.

Clothes: Pale yellow t-shirt under denim dungaree shorts and black, 3/4 length leggings. Brown boots. Slouched purple beanie with a lighter purple bobble on it.

Expression: The expression design of Hope’s sprites will change appropriately to her triggers and composure points, but will also change based on the flow of the narrative throughout the game, as represented below. Her main expressions will include neutral, happy, sad and scared.

68c704a1-9bbd-4de3-96e1-cf000a956d61

Teddy:

b2294031-a1a5-488b-93c8-4936eaa76ced

Face: Round face. Large, tall nose with rounded end. Wide eyes, whites of eyes usually visible around the irises/pupils. Short, straight eyebrows. Mouth is small and looks tensed. Freckles across nose and cheeks.

Hair: An unkempt mess of blonde hair which sticks up at odd angles whilst other pieces fall across his face.

Body: Short, rectangular physique, quite a long torso for the design guidelines.

Clothes: Large, square-framed black glasses. White long-sleeved raglan top with red sleeves and collar. Denim jeans that are slightly too big for him and bunch at the ankles. Red trainers in Converse style.

Dad:

0b3373df-fb6b-491d-8795-cf7a55e5204e

Face: Long, rectangular face. Large, straight nose. Smaller, oval-shaped eyes with light lines underneath to indicate bags. Eyebrows are slightly arched and quite long and thick. Dark beard.

Hair: A somewhat dishevelled short, dark brown cut, pushed back with strands falling forwards. Streaks of grey appearing at the sides just above the ears.

Body: Tall, lanky, broad-shouldered and large-footed but with a narrow waist and slender limbs.

Clothes: A light blue long-sleeved shirt, top button undone and rolled at the sleeves, tucked into a pair of grey-blue slacks. Dark brown dress shoes.

Line work and shading:

Using the Procreate brushes, fill in block colours with Hard Airbrush and create clean, one-tone shading with Medium Airbrush. Line work is lightly added to the whole character using Dry Ink, then using Procreate’s Alpha Lock tool, colour over the line with the desired colour.

0d474895-9d58-46ed-9b20-5dbc1abc9c54

Environment:

General style:

5F128F18-050C-4F96-8A84-397EA0DB1075

Environmental design features clean cut lines and bold, stylised shapes. Outlining for the background is completely dropped to make the characters pop out of their surroundings. Some line work can be employed for accents, however, especially in regards to architecture which may look comparatively simple to the rest of the environmental components.

Trees:

For a visual description of the indigenous trees of the Cotswolds, click here. Trees are composed of shaped trunks representative of their species which splay out into branches that overlay a block shape of leaves behind in keeping with the tree type.

ff71e91c-bf29-46c1-a618-63fda52cb2e0

Beech: The trunks of the beech trees should be thick but straight and tall, with a slight curvature to the branches which splay out widely. The leaves are wider than they are tall, like a lumpy sideways oval.

Oak: Oak trees are large and wide, with a thick trunk and twisting branches that stretch out to the sides. The leaves are the shaped of a wide, skewed oval.

Ash: Ash trees are small, with thin, straight trunks and minimal branches short in length. The leaves are taller ovals, on the verge of being triangular as they taper towards the top.

Willow: The trunk of the willow tree is a twisting, knobbly trunk which is significantly wider at the base than the top. The branches border on hanging down with the weight of the leaves, which drip down in tendrils towards the ground.

Blocking and shading:

Using Procreate’s brushes, create block shapes with Medium Airbrush and add soft, graduated shading with Vine Charcoal.

2716e5cf-1a44-438e-9545-c191c23e11fc

General nature:

The rest of the naturally occurring environment is drawn in a similar style to the trees, using Medium Airbrush to create simple block shapes and then a soft shading with Vine Charcoal.

Water: Texturing for water is added with the Sable brush.

3734f15f-0dc3-49ec-999c-d87f9e2dff36

Architecture:

For information on the architecture found in the Cotswolds, click here.

Both residential and commercial buildings are composed of yellow limestone, which uses Stone Wall with the shading colour (see below) layered over block colour. Any structure using limestone (bridges, walls, etc.) will use this technique.

f7cbc41f-5d0d-40cd-997a-535a7a0310ef

Windows are square/rectangular and contain four to six window panes. Given a shiny texture with Soft Airbrush in a darker shade to the pane in a large size, then minimise that size and draw straight diagonal lines across to add shine. The same rule applies for all glass surfaces.

dcbea67a-0b1e-4535-aed8-d89780152ee2

Roofs are rectangles/trapeziums textured with the chosen tile shade using Heavy Metal.

a59450b6-af1b-4e11-94f7-e3dc6df455be

Flat wooden surfaces such as doors are textured with a darker shade than the block colour with one stroke of Concrete Block overlaid.

4c1d5b6d-3100-4ce9-a25f-14aa29019148

Extras such as lampposts use Medium Airbrush for both block colour and shading.

Sky:

The sky is created by blocking the three sky colours together for daytime, and then blending these together using the Watercolour brush and overlaying the colours again to create a textured by soft graduation from light to dark. The same technique will apply to evening colours.

a15119bf-6778-4292-9ae8-c1bbd5b3b20a

The sky will transition from early morning all the way to dusk throughout Hope’s journey, as represented by the map below.

89e18bd4-088b-4eee-9df4-596bb86aa4bb

0181595a-4626-4f4b-8ab4-11b21cbce96f

Colour Palette:

Two different colour palettes will be used between day and evening, with the evening colour palette the same base colours but darkened, slightly saturated and shifted towards the green hue to warm the colours up a little. The only completely different set of colours is the sky set, which will begin at the top colour and darken as the evening progresses.

c1e4e093-17fd-45c7-b986-07d3476af6a1

Parallax scrolling:

The Way Home features parallax scrolling in which the background moves past the camera slower than the foreground. The illusion of distance is achieved by block filling a new layer with white, then adjusting the opacity to 10%. In the case of block sections of ground, the different shades should be used anyway, with colours becoming darker the closer they get to the foreground.