Difference between revisions of "Choosing your palette"

From The Battle for Wesnoth Wiki
(Created page with "== Introduction == When choosing colours for your sprite art it is usually best to use already existing (mainline or UMC) palettes. But what can you do when you want to create...")
 
(Highlights)
(8 intermediate revisions by 2 users not shown)
Line 7: Line 7:
 
Some of the newer mainline sprites use a lot of shades you (at first) wouldn't expect. Before creating your own images it is good to look at and analyse them.
 
Some of the newer mainline sprites use a lot of shades you (at first) wouldn't expect. Before creating your own images it is good to look at and analyse them.
 
Good examples are the Firedragon(green and purple shadows) and Elvish Outrider(yellow highlights on metall)
 
Good examples are the Firedragon(green and purple shadows) and Elvish Outrider(yellow highlights on metall)
https://forums.wesnoth.org/download/file.php?id=75019.png
 
https://forums.wesnoth.org/download/file.php?id=75020.png
 
Those colours, sparingly used, can create contrast in the picture without breaking the whole image.
 
  
== Same colours for different surfaces ==
+
http://units.wesnoth.org/1.12/pics/core$images$units$monsters$fire-dragon.png
The first lesson to learn is, the same colours can be used for various different surfaces.
 
  
https://forums.wesnoth.org/download/file.php?id=75016.png
+
http://units.wesnoth.org/1.12/pics/core$images$units$elves-wood$outrider$outrider.png
Not only does this fairy use the same colours for her dress and wings as the outrider uses for his metall armor, but some hues are also shared between dress,hair,skin and staff.
 
  
I'd generally advise '''against'''  using the same shades in the same image on different surfaces as it can make later edits more difficult, but sharing the palette between different units can be useful to indicate unity (eg. units from the same faction).
+
Those colours, sparingly used, can create contrast in the picture without breaking the whole image.
  
 
== Choosing number of colours ==
 
== Choosing number of colours ==
Line 23: Line 18:
 
The shades you need are:
 
The shades you need are:
  
1. White: for shiny surfaces (mostly metall, but can be used for hair and skin aswell; Don't use it on non-white cloth)
+
1. White: for shiny or bright surfaces
  
2. Highlighting colour (optional; it is a bright colour and can be used to give a material a special shine; it can be a different colour than the material e.g. yellow highlight on the outrider)
+
2. Highlighting colour (optional)
  
 
3. Base-colour of the material in normal light
 
3. Base-colour of the material in normal light
Line 31: Line 26:
 
4. Blackish outline (Don't use black; The outline can be the same colour for the whole unit)
 
4. Blackish outline (Don't use black; The outline can be the same colour for the whole unit)
  
5.-8. Darker shades of the base-colour; Some can be replaced with other colours without changing the aperance of the sprite.
+
5.-8. About 2-4 Darker shades of the base-colour (can be replaced with other colours; more of that later)
 +
 
 +
== Shading depending on material ==
 +
Metal is usually shiny and therefore should be white where light hits best. It reflects its surroundings, so many different colours could be used. Metal surfaces usually use more shades than other materials
 +
 
 +
Skin and leather aren't (very) reflective. Oily skin is very shiny (-> high contrast), while dry or dirty skin has a lower difference between shades.
 +
 
 +
Textile isn't shiny or reflective at all. As result white can only be used for bright fabric. It also creates folds on its own, so light shades and shadows often alternate.
 +
 
 +
https://forums.wesnoth.org/download/file.php?id=75043.png
 +
 
 +
 
 +
== Reusing shades ==
 +
I'd generally advise '''against'''  using the same shades in the same image on different surfaces as it can make later edits more difficult and look confusing, but sharing the palette between different units can be useful to indicate unity (eg. units from the same faction).
 +
 
 +
Nevertheless here are three units, who use only 12 shades of brown, to show you how to reduce colour count
 +
 
 +
https://forums.wesnoth.org/download/file.php?id=75046.png
 +
 
 +
These units create different materials and colours by using variating shading method (see above) and quantity of a colour.
 +
 
 +
The fist one has a lot of orange in his trousers to distinguish it from his skintone. His weapon uses browntones with a hint of purple and green to create the illusion of a natural wooden branch and beige for dry leaves. The golden ornaments are mostly yellow with white as higlights and orange/brown in the shadows.
 +
 
 +
Nr.2 has a darker but shiny skin, so the contrast is higher (white highlights to brown skin)
 +
 
 +
The last one has a lighter skin with mostly beige shades. On his shoulders are bronze plates with a lot more orange than the gold ornaments of Nr.1. His skirt and breastplate have nearly the same shades as the skin, but a lot more white (skirt) and brown (armor) to distinguish.
 +
 
 +
Most of the time the shape of an object can be decisive for the apperance of the material.
 +
 
 +
== Shadows ==
 +
Darker shades can be replaced with different colours to create a higher contrast or to give the material an undertone.
 +
 
 +
The default shadow for wesnoth is purple. It works best on orange or brown shades, but can be used for almost every colour with good results.
 +
 
 +
Non-reflective surfaces (e.g. normal clothes) should have just darker shades of the base colour, grey, or the default purple in the shadows. Metall and other reflective materials can use a larger variety.
 +
 
 +
 
 +
Complementary colours (e.g dark green shadow for orange materials) let the surface shine a little brighter.
 +
 
 +
To create the illusion of reflection green (grass,forest) and blue (sky) shades on metall work best.
 +
 
 +
Other colours can be used to characterize a faction/unit (e.g. blue shadows for units with a water theme, red for a fire theme...)
 +
 
 +
 
 +
Additionaly the number of shades you replace can have a large effect:
 +
 
 +
Replace only one shade for a hardly noticeable undertone. It's an easy effect with little efford.
 +
 
 +
Replace multiple shades with different colours to create properties for the material (e.g rusty surface, magical aura, unique (magical) metalls like mythril). It has to be carefully crafted, otherwise it will look very strange.
 +
 
 +
Replacing multiple shades with the same colour will change the colour of the material. It is only good when desired.
  
== Replacing the shades ==
 
But what colours look good? Let's take a look at these armors.
 
  
https://forums.wesnoth.org/download/file.php?id=75015.png
+
As general rules:
  
The first one uses the colours of the loyalists and therefore would blend in best with other loyalists.
+
1.Replacing brighter shades will most of the time be more noticeable than replacing dark ones.
  
Nr. 2 and 3 just use grey; one a little brighter shades than the other
+
2.Replacement-shades should have (roughly) the same brightness as the original shade.
  
The interesting ones are in the lower row.
+
3.Replacement-shades will be less noticeable if they have a low saturation or a similar saturation as the original shade. Can be desired or not.
The first uses a mixture of different colours (from dark to bright:green,brown,blue), that interact with each other. As result the aromor still looks greyish, but now has a bit of a green undertone.
 
  
The second just replaced grey with brown and therefore completely changed colour.
+
== Highlights ==
  
The third also uses brown and a blue/green tone (like the first one), but here the brown is the darkest colour and therefore the blueish looks more noticeable
+
Highlights are bright shades with a different colour than the material. They will mostly be used for metalls, but can also give textile a shining ability (-> silk).
  
In the last one I used gold, but replaced used some red shades instead of orange.
+
If you don't want to change the whole colour of the material, they should only be used very sparely (single pixels). Only use them as replacement for the brightest shades, otherwise use shadows (see above).
  
The replacement colour should have a similar brightness as the original colour.
+
Theoretically you could use any colour (with high brightness) to highlight, but bright green and yellow works best most of the time.
 +
Similar to shadows, a hue with higher saturation will be more invading than a grey colour.

Revision as of 16:28, 22 April 2017

Introduction

When choosing colours for your sprite art it is usually best to use already existing (mainline or UMC) palettes. But what can you do when you want to create your own, individual units?

I'll try to give you a short lesson -and hopefully some insights- into colour theory.

Analysing existing art

Some of the newer mainline sprites use a lot of shades you (at first) wouldn't expect. Before creating your own images it is good to look at and analyse them. Good examples are the Firedragon(green and purple shadows) and Elvish Outrider(yellow highlights on metall)

http://units.wesnoth.org/1.12/pics/core$images$units$monsters$fire-dragon.png

http://units.wesnoth.org/1.12/pics/core$images$units$elves-wood$outrider$outrider.png

Those colours, sparingly used, can create contrast in the picture without breaking the whole image.

Choosing number of colours

Any material (which doesn't lie completely in shadows) should have at least 4 shades. Bigger surfaces should have up to 6, while the most dominant can have around 8 shades, but try to keep the number low. The shades you need are:

1. White: for shiny or bright surfaces

2. Highlighting colour (optional)

3. Base-colour of the material in normal light

4. Blackish outline (Don't use black; The outline can be the same colour for the whole unit)

5.-8. About 2-4 Darker shades of the base-colour (can be replaced with other colours; more of that later)

Shading depending on material

Metal is usually shiny and therefore should be white where light hits best. It reflects its surroundings, so many different colours could be used. Metal surfaces usually use more shades than other materials

Skin and leather aren't (very) reflective. Oily skin is very shiny (-> high contrast), while dry or dirty skin has a lower difference between shades.

Textile isn't shiny or reflective at all. As result white can only be used for bright fabric. It also creates folds on its own, so light shades and shadows often alternate.

file.php?id=75043.png


Reusing shades

I'd generally advise against using the same shades in the same image on different surfaces as it can make later edits more difficult and look confusing, but sharing the palette between different units can be useful to indicate unity (eg. units from the same faction).

Nevertheless here are three units, who use only 12 shades of brown, to show you how to reduce colour count

file.php?id=75046.png

These units create different materials and colours by using variating shading method (see above) and quantity of a colour.

The fist one has a lot of orange in his trousers to distinguish it from his skintone. His weapon uses browntones with a hint of purple and green to create the illusion of a natural wooden branch and beige for dry leaves. The golden ornaments are mostly yellow with white as higlights and orange/brown in the shadows.

Nr.2 has a darker but shiny skin, so the contrast is higher (white highlights to brown skin)

The last one has a lighter skin with mostly beige shades. On his shoulders are bronze plates with a lot more orange than the gold ornaments of Nr.1. His skirt and breastplate have nearly the same shades as the skin, but a lot more white (skirt) and brown (armor) to distinguish.

Most of the time the shape of an object can be decisive for the apperance of the material.

Shadows

Darker shades can be replaced with different colours to create a higher contrast or to give the material an undertone.

The default shadow for wesnoth is purple. It works best on orange or brown shades, but can be used for almost every colour with good results.

Non-reflective surfaces (e.g. normal clothes) should have just darker shades of the base colour, grey, or the default purple in the shadows. Metall and other reflective materials can use a larger variety.


Complementary colours (e.g dark green shadow for orange materials) let the surface shine a little brighter.

To create the illusion of reflection green (grass,forest) and blue (sky) shades on metall work best.

Other colours can be used to characterize a faction/unit (e.g. blue shadows for units with a water theme, red for a fire theme...)


Additionaly the number of shades you replace can have a large effect:

Replace only one shade for a hardly noticeable undertone. It's an easy effect with little efford.

Replace multiple shades with different colours to create properties for the material (e.g rusty surface, magical aura, unique (magical) metalls like mythril). It has to be carefully crafted, otherwise it will look very strange.

Replacing multiple shades with the same colour will change the colour of the material. It is only good when desired.


As general rules:

1.Replacing brighter shades will most of the time be more noticeable than replacing dark ones.

2.Replacement-shades should have (roughly) the same brightness as the original shade.

3.Replacement-shades will be less noticeable if they have a low saturation or a similar saturation as the original shade. Can be desired or not.

Highlights

Highlights are bright shades with a different colour than the material. They will mostly be used for metalls, but can also give textile a shining ability (-> silk).

If you don't want to change the whole colour of the material, they should only be used very sparely (single pixels). Only use them as replacement for the brightest shades, otherwise use shadows (see above).

Theoretically you could use any colour (with high brightness) to highlight, but bright green and yellow works best most of the time. Similar to shadows, a hue with higher saturation will be more invading than a grey colour.