User:AzlanOnPC/guide to spriting style: Difference between revisions

From BeeStation Wiki
Jump to navigation Jump to search
(Created page with "Alright, if you're here, it means you want to get started on contributing to Beestation with sprites! but, as you may have seen, our server aims for a relatively specific styl...")
 
No edit summary
Line 1: Line 1:
Alright, if you're here, it means you want to get started on contributing to Beestation with sprites! but, as you may have seen, our server aims for a relatively specific style, so if you want your new fancy thing to get it, it has to comply with it! this guide exists for that reason, teaching people how to follow our style, and more clean spriting overall:
'Alright, if you're here, it means you want to get started on contributing to Beestation with sprites! but, as you may have seen, our server aims for a relatively specific style, so if you want your new fancy thing to get it, it has to comply with it! this guide exists for that reason, teaching people how to follow our style, and more clean spriting overall:
 
 


1. COLORS: turning your color smoothie into something usable
1. COLORS: turning your color smoothie into something usable
main difference between a proper graphic and a 'codersprite' (placeholder sprite made by coders quickly, usually of bad quality) is the usage of colors and noise.
main difference between a proper graphic and a 'codersprite' (placeholder sprite made by coders quickly, usually of bad quality) is the usage of colors and noise.
[image]
[image]
Line 9: Line 12:


Darkest: used solely for being the darkest 'outline' of the parts wich use the 'dark' tone.
Darkest: used solely for being the darkest 'outline' of the parts wich use the 'dark' tone.
[image]
[image]
Dark: shadows and dark spots of the sprite use it, it is also used as the 'outline' of the lighter parts!
Dark: shadows and dark spots of the sprite use it, it is also used as the 'outline' of the lighter parts!
[image]
[image]
midtone: your base color! and the middle ground between dark and light. This color will compose the majority of the piece.
midtone: your base color! and the middle ground between dark and light. This color will compose the majority of the piece.
[image]
[image]
light: this color is used for accentuating light sources, making reflections, and overall making the sprite more flashy! be careful, if overused, you'll end up lowering the quality very heavily.
light: this color is used for accentuating light sources, making reflections, and overall making the sprite more flashy! be careful, if overused, you'll end up lowering the quality very heavily.
[image]
[image]


2. OUTLINES: This is not Hyper Light Drifter
2. OUTLINES: This is not Hyper Light Drifter
outlines, for those who dont know, are the pixels that separate your inner sprite from the background and rest of the sprite, and remarks the shape and color of the asset. More specifically, outlines are not a solid color: with our style, they have two colors: dark, and light, for preventing a "solid" outline, wich is a single color; stands out better, but makes the sprite look too... Cartoony.
outlines, for those who dont know, are the pixels that separate your inner sprite from the background and rest of the sprite, and remarks the shape and color of the asset. More specifically, outlines are not a solid color: with our style, they have two colors: dark, and light, for preventing a "solid" outline, wich is a single color; stands out better, but makes the sprite look too... Cartoony.
[image]
[image]
pictured: examples of correct outlining.
pictured: examples of correct outlining.


[image]
[image]
pictured: examples of incorrect outlining!
pictured: examples of incorrect outlining!


3. SHAPE: making your potatoes look good.
3. SHAPE: making your potatoes look good.


4. LIGHT SOURCES: you have one lamp, and 0 moths.
4. LIGHT SOURCES: you have one lamp, and 0 moths.


5. TERMINOLOGY: What do these magic words mean???
5. TERMINOLOGY: What do these magic words mean???


6. SINS OF SPRITING: how you fucked up, and what to do
6. SINS OF SPRITING: how you fucked up, and what to do

Revision as of 12:50, 3 November 2020

'Alright, if you're here, it means you want to get started on contributing to Beestation with sprites! but, as you may have seen, our server aims for a relatively specific style, so if you want your new fancy thing to get it, it has to comply with it! this guide exists for that reason, teaching people how to follow our style, and more clean spriting overall:


1. COLORS: turning your color smoothie into something usable

main difference between a proper graphic and a 'codersprite' (placeholder sprite made by coders quickly, usually of bad quality) is the usage of colors and noise. [image] for starters, we need to know what a 'color pallete' is, its pretty simple, really: a selection of colors used to color each sprite and keep it consistent, such as the four exact yellow colors used on a welder, also are used on the RCD, or RPED. [image] Most 'old' and 'coder' sprites have tons, and tons of tones per color, from 5 to a whooping 20, for stuff like metal sheets! this, on our case, is bad; we want to keep 4 tones per color, at most, 5 on edge cases such as reflective glass, or mobs:

Darkest: used solely for being the darkest 'outline' of the parts wich use the 'dark' tone.

[image]

Dark: shadows and dark spots of the sprite use it, it is also used as the 'outline' of the lighter parts!

[image]

midtone: your base color! and the middle ground between dark and light. This color will compose the majority of the piece.

[image]

light: this color is used for accentuating light sources, making reflections, and overall making the sprite more flashy! be careful, if overused, you'll end up lowering the quality very heavily.

[image]


2. OUTLINES: This is not Hyper Light Drifter

outlines, for those who dont know, are the pixels that separate your inner sprite from the background and rest of the sprite, and remarks the shape and color of the asset. More specifically, outlines are not a solid color: with our style, they have two colors: dark, and light, for preventing a "solid" outline, wich is a single color; stands out better, but makes the sprite look too... Cartoony.

[image]

pictured: examples of correct outlining.

[image]

pictured: examples of incorrect outlining!


3. SHAPE: making your potatoes look good.


4. LIGHT SOURCES: you have one lamp, and 0 moths.


5. TERMINOLOGY: What do these magic words mean???


6. SINS OF SPRITING: how you fucked up, and what to do