Creating Unit Art - Revision history

Mentos987: Comment about how to make huge units

2026-07-18T23:19:58Z

Comment about how to make huge units

← Older revision		Revision as of 23:19, 18 July 2026
Line 15:		Line 15:
	*Compare the size of your unit to the size of similar existing core units.		*Compare the size of your unit to the size of similar existing core units.
	*<div style="float:right; padding:1ex; margin:1ex; border: thin dotted; font-size:80%;">http://forums.wesnoth.org/download/file.php?id=60404&type=.png</div>For oversize units, there are limitations with respect to the terrain system and asthetics. Sprites that are much bigger than the hex tend to end up getting partially obscured by terrain in inconvenient places and look bad. If you want everything to be always visible or believably covered then the black area in the picture is safe. You can usually exceed this to the left and right without much trouble, but going down is problematic with the great tree and stands out. The gold hex represents the hex the unit is actually in. Also, making units too large will hide those behind it, so even though the appearance will be correct in the entire black area, you will want to leave more than half of each of the hexes outside the gold one visible so as not to make other units vanish. [http://forums.wesnoth.org/viewtopic.php?f=23&t=38203&p=546367#p546331]		*<div style="float:right; padding:1ex; margin:1ex; border: thin dotted; font-size:80%;">http://forums.wesnoth.org/download/file.php?id=60404&type=.png</div>For oversize units, there are limitations with respect to the terrain system and asthetics. Sprites that are much bigger than the hex tend to end up getting partially obscured by terrain in inconvenient places and look bad. If you want everything to be always visible or believably covered then the black area in the picture is safe. You can usually exceed this to the left and right without much trouble, but going down is problematic with the great tree and stands out. The gold hex represents the hex the unit is actually in. Also, making units too large will hide those behind it, so even though the appearance will be correct in the entire black area, you will want to leave more than half of each of the hexes outside the gold one visible so as not to make other units vanish. [http://forums.wesnoth.org/viewtopic.php?f=23&t=38203&p=546367#p546331]
			*For huge units that intrude on the hexes underneath them (sw,s,se) you can use the unit layer to force the centre hex above any terrain foreground (layer=50).
	*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)		*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)
	*Unit must look in the lower right (again, the artist's lower right, not the unit's) direction		*Unit must look in the lower right (again, the artist's lower right, not the unit's) direction

Sub2pewds: Removing extraneous whitespace

2019-02-25T04:33:31Z

Removing extraneous whitespace

← Older revision		Revision as of 04:33, 25 February 2019
Line 1:		Line 1:
	Here's the information needed to start doing units art for Wesnoth. Please update the wiki with links to examples and other tips and tricks realted to unit art. This page started from [http://www.wesnoth.org/forum/viewtopic.php?p=104809#104809 this forum thread].		Here's the information needed to start doing units art for Wesnoth. Please update the wiki with links to examples and other tips and tricks realted to unit art. This page started from [http://www.wesnoth.org/forum/viewtopic.php?p=104809#104809 this forum thread].


	== The Medium ==		== The Medium ==

	The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[Glossary\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.		The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[Glossary\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.


	== Basic unit image specifications ==		== Basic unit image specifications ==
Line 32:		Line 30:
	*directional attacks (generally are desired for any attack that's a straight motion, rather than a slash. I.e. spears and thundersticks)		*directional attacks (generally are desired for any attack that's a straight motion, rather than a slash. I.e. spears and thundersticks)
	*defense (usually 2 frames long not including the base frame, separate animations may be drawn for ranged and melee defense animations)		*defense (usually 2 frames long not including the base frame, separate animations may be drawn for ranged and melee defense animations)


	== Additional Notes ==		== Additional Notes ==

Zookeeper: Fixed color depth instruction from 24-bit to 32-bit

2015-07-19T13:01:51Z

Fixed color depth instruction from 24-bit to 32-bit

← Older revision		Revision as of 13:01, 19 July 2015
Line 11:		Line 11:
	Wesnoth can only use two kinds of graphic files: PNGs, or JPEGs. JPEGs aren't suitable for unit images, because they can't store transparency data (and are lossy). Because of this, we always use PNGs for unit images.		Wesnoth can only use two kinds of graphic files: PNGs, or JPEGs. JPEGs aren't suitable for unit images, because they can't store transparency data (and are lossy). Because of this, we always use PNGs for unit images.
	*Final format: transparent PNG		*Final format: transparent PNG
	** Color depth should be 24-bit (8 bits per ~~RGB~~ channel). This may be listed as "PNG-24" or "8-bit RGBA".		** Color depth should be 32-bit (8 bits per RGBA channel). This may be listed for example as "PNG-32" or "8-bit RGBA".
	** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.		** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.
	* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).		* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).

Tr0ll: /* Basic unit image specifications */ add Alaranta's diagram showing overlap recommendations for oversized images

2013-01-18T04:20:17Z

Basic unit image specifications: add Alaranta's diagram showing overlap recommendations for oversized images

← Older revision		Revision as of 04:20, 18 January 2013
Line 14:		Line 14:
	** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.		** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.
	* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).		* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).
	*All but exceptionally large units should be contained in the hex if possible - the white in the template shown ~~here~~: http://forums.wesnoth.org/download/file.php?id=4334&type=.png		*All but exceptionally large units should be contained in the hex if possible - the white in the template shown at right: http://forums.wesnoth.org/download/file.php?id=4334&type=.png
	*Compare the size of your unit to the size of similar existing core units		*Compare the size of your unit to the size of similar existing core units.
			*<div style="float:right; padding:1ex; margin:1ex; border: thin dotted; font-size:80%;">http://forums.wesnoth.org/download/file.php?id=60404&type=.png</div>For oversize units, there are limitations with respect to the terrain system and asthetics. Sprites that are much bigger than the hex tend to end up getting partially obscured by terrain in inconvenient places and look bad. If you want everything to be always visible or believably covered then the black area in the picture is safe. You can usually exceed this to the left and right without much trouble, but going down is problematic with the great tree and stands out. The gold hex represents the hex the unit is actually in. Also, making units too large will hide those behind it, so even though the appearance will be correct in the entire black area, you will want to leave more than half of each of the hexes outside the gold one visible so as not to make other units vanish. [http://forums.wesnoth.org/viewtopic.php?f=23&t=38203&p=546367#p546331]
	*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)		*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)
	*Unit must look in the lower right (again, the artist's lower right, not the unit's) direction		*Unit must look in the lower right (again, the artist's lower right, not the unit's) direction

Tr0ll: /* Basic unit image specifications */ insert referenced image inline

2013-01-18T03:50:32Z

Basic unit image specifications: insert referenced image inline

← Older revision		Revision as of 03:50, 18 January 2013
Line 14:		Line 14:
	** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.		** Be aware that "Indexed color", "color map", or "PNG-8" is a different format. Although it might work in a buggy way, we strongly recommend you not use these.
	* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).		* Canvas size is 72 x 72 pixels (it can actually be slightly wider, and can fit in the area of a hex and its immediately surrounding tiles, but try not to do this if at all possible, because it has performance and graphical glitch issues).
	*All but exceptionally large units should be contained in the hex if possible (the white in the ~~attached~~ template)		*All but exceptionally large units should be contained in the hex if possible - the white in the template shown here: http://forums.wesnoth.org/download/file.php?id=4334&type=.png
	*Compare the size of your unit to the size of similar existing core units		*Compare the size of your unit to the size of similar existing core units
	*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)		*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)
Line 23:		Line 23:
	*Outlines should be used, made with a darker, but similar color to what they're surrounding, this makes the unit feel bigger then the amount of pixels you'd use for the same with a black outline. Note that pure black (RGB #000000) should ''never'' be used to outline a sprite.		*Outlines should be used, made with a darker, but similar color to what they're surrounding, this makes the unit feel bigger then the amount of pixels you'd use for the same with a black outline. Note that pure black (RGB #000000) should ''never'' be used to outline a sprite.
	*Use consistent names for your files, beginning with the unit name, so that they are kept together when browsing the files. Try to imitate the naming scheme used for mainline units.		*Use consistent names for your files, beginning with the unit name, so that they are kept together when browsing the files. Try to imitate the naming scheme used for mainline units.


	== Unit animation specifications ==		== Unit animation specifications ==

Tr0ll: switch bolding to level1 section headers in order to modularize future editing and auto-insert table of contents

2013-01-18T03:34:16Z

switch bolding to level1 section headers in order to modularize future editing and auto-insert table of contents

← Older revision		Revision as of 03:34, 18 January 2013
Line 2:		Line 2:


			== The Medium ==

	~~'''~~ The Medium ~~'''~~

	The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[Glossary\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.		The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[Glossary\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.


			== Basic unit image specifications ==
	~~'''~~ Basic unit image specifications ~~'''~~

	Wesnoth can only use two kinds of graphic files: PNGs, or JPEGs. JPEGs aren't suitable for unit images, because they can't store transparency data (and are lossy). Because of this, we always use PNGs for unit images.		Wesnoth can only use two kinds of graphic files: PNGs, or JPEGs. JPEGs aren't suitable for unit images, because they can't store transparency data (and are lossy). Because of this, we always use PNGs for unit images.
Line 28:		Line 25:


			== Unit animation specifications ==
	~~'''~~ Unit animation specifications ~~'''~~

	You can have as many frames for animations as you like, and in fact, for any given cue, you can have more than one animation, which will be randomly chosen by the game. Images and animations must be done for:		You can have as many frames for animations as you like, and in fact, for any given cue, you can have more than one animation, which will be randomly chosen by the game. Images and animations must be done for:
Line 38:		Line 34:


			== Additional Notes ==
	~~'''~~ Additional Notes ~~'''~~

	*Test early with different backgrounds. Go to your game terrain files, pick, say, 3 terrains, preferably with different colors, and have a look what they look like against the background, because that way if you have used alpha channels, it may look better in game than as the average standard sprite.		*Test early with different backgrounds. Go to your game terrain files, pick, say, 3 terrains, preferably with different colors, and have a look what they look like against the background, because that way if you have used alpha channels, it may look better in game than as the average standard sprite.

Deusite: updated links for glossary merger

2012-12-22T01:54:34Z

updated links for glossary merger

← Older revision		Revision as of 01:54, 22 December 2012
Line 6:		Line 6:
	''' The Medium '''		''' The Medium '''

	The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[~~WesnothAcronyms~~\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.		The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[Glossary\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.

Artisticdude: Changed spellings of "colour" to "color", clarified some information

2012-05-31T13:25:04Z

Changed spellings of "colour" to "color", clarified some information

← Older revision		Revision as of 13:25, 31 May 2012
Line 20:		Line 20:
	*Compare the size of your unit to the size of similar existing core units		*Compare the size of your unit to the size of similar existing core units
	*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)		*Light comes from the artist's (''not'' the unit's!) upper right (for shading and highlights)
	*Unit must look in the lower right direction		*Unit must look in the lower right (again, the artist's lower right, not the unit's) direction
	*Units are centered horizontally		*Units are centered horizontally
	*Unit's feet are positioned around 55 pixel from the top, lower for taller units if necessary		*Unit's feet are positioned around 55 pixel down from the top edge of the canvas, lower for taller units if necessary
	*Shadows at 60 opacity, dark blue color (see [[Creating_Shadows_Under_Units\|Creating Shadows Under Units]]).		*Shadows at 60 opacity, using a specific dark blue color (see [[Creating_Shadows_Under_Units\|Creating Shadows Under Units]]).
	*Outlines should be used, made with a darker, but similar ~~colour~~ to what they're surrounding, this makes the unit feel bigger then the amount of pixels you'd use for the same with a black outline. Note that pure black (RGB #000000) should ''never'' be used to outline a sprite.		*Outlines should be used, made with a darker, but similar color to what they're surrounding, this makes the unit feel bigger then the amount of pixels you'd use for the same with a black outline. Note that pure black (RGB #000000) should ''never'' be used to outline a sprite.
	*Use consistent names for your files, beginning with the unit name, so that they are kept together when browsing the files. Try to imitate the naming scheme used for mainline units.		*Use consistent names for your files, beginning with the unit name, so that they are kept together when browsing the files. Try to imitate the naming scheme used for mainline units.

Line 41:		Line 41:
	''' Additional Notes '''		''' Additional Notes '''

	*Test early with different backgrounds. Go to your game terrain files, pick, say, 3 terrains, preferably with different ~~colours~~, and have a look what they look like against the background, because that way if you have used alpha channels, it may look better in game than as the average standard sprite.		*Test early with different backgrounds. Go to your game terrain files, pick, say, 3 terrains, preferably with different colors, and have a look what they look like against the background, because that way if you have used alpha channels, it may look better in game than as the average standard sprite.

	*Test your unit early in the game. Replacing an existing unit graphic with yours is the fastest way (be sure to make a copy of the originals so you don't lose them.)		*Test your unit early in the game. Replacing an existing unit graphic with yours is the fastest way (be sure to make a copy of the originals so you don't lose them.)

Artisticdude at 20:15, 1 February 2012

2012-02-01T20:15:52Z

← Older revision		Revision as of 20:15, 1 February 2012
Line 6:		Line 6:
	''' The Medium '''		''' The Medium '''

	The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as ~~vector~~ art) to create unit art is fine if you are creating unit art for [[WesnothAcronyms\|UMC]] add-ons (although it is still strongly recommended that you ~~try and~~ use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.		The medium used to create unit art is known as 'pixel art'. If you do not understand what pixel art is, or if you have only a general understanding of what it is, I suggest reading [http://www.pixeljoint.com/forum/forum_posts.asp?TID=11299 The Pixel Art Tutorial] by Cure. It is a tutorial comprised of a series of sequential forum posts on the www.pixeljoint.com forum and gives an in-depth overview of pixel art, explaining in detail what pixel art is and what it is not. Using other mediums (such as brush art) to create unit art is fine if you are creating unit art for [[WesnothAcronyms\|UMC]] add-ons (although it is still strongly recommended that you use pixel art for the sake of consistency with mainline units), but only units drawn in pure pixel art will be accepted into mainline.

Artisticdude: Clarified some points

2012-01-08T15:15:05Z

Clarified some points

← Older revision		Revision as of 15:15, 8 January 2012
Line 33:		Line 33:
	You can have as many frames for animations as you like, and in fact, for any given cue, you can have more than one animation, which will be randomly chosen by the game. Images and animations must be done for:		You can have as many frames for animations as you like, and in fact, for any given cue, you can have more than one animation, which will be randomly chosen by the game. Images and animations must be done for:
	*base frame (1 frame)		*base frame (1 frame)
	*attack for each type (at least 3 frames, about 6 frames is optimal depending on the type of attack and the weapon(s) involved)		*attack for each type (at least 4 frames, about 6 frames is optimal depending on the type of attack and the weapon(s) involved)
	*directional attacks (generally are desired for any attack that's a straight motion, rather than a slash. I.e. spears and thundersticks)		*directional attacks (generally are desired for any attack that's a straight motion, rather than a slash. I.e. spears and thundersticks)
	*defense (usually 2 frames long not including the base frame, ~~can~~ be ~~split into~~ ranged and melee defense animations)		*defense (usually 2 frames long not including the base frame, separate animations may be drawn for ranged and melee defense animations)
	*magical attacks should have 'special effects'