McRamon

Guide to Spriting.

Recommended Posts

I will not cover technical part of sprite creation process, this is more of a compilation of art tips and tricks.
Only thing is I strongly recommend using any graphics program rather than dream maker itself for sprite creation,
its too limited in its tools, some things that can be done in a few clicks, will take hours in dream maker.

Now, lets makes some sprites, shall we?

First things first. When you are making a sprite, you need to remember basic art rules (even though not always following them):
1) Light/shadow. Parts of an object, that face light are bright, parts that don't are dark.
Lets talk about this rule and how do we use it in a game which has its light sources constantly move and without advanced shaders.
We have very limited workspace, and sometimes things are so small that you can not allow yourself to add any sort of shading. However, its better to do it most of the time.
For example look at this.

duckinhand.png

Its an in-hand rubber ducky sprite. Its literally 10 pixels total. And it has shading.
For a source of light, you cant rely on a real source of light in game, sicne they are not static, and it doesn't really matter that much, just pick any side and imagine light coming from there. Good choice is above the object, and slightly to the left or right of it.
Also, if you are spriting something that has analogue in game already (like a new mech, or a new weapon), its better to look at other sprites and take the light source position previous spriters took. For example, mechs have  light coming at them from top, with both sides symmetrically highlighted.

2) Volume. Add volume if possible (sometimes its not, again, due to how limited our workspace is). You can add volume to the sprite by making the camera angle not directly from side, but rather a bit from the top.

3) Cold/warm colors. That is less important rule, but it really help you sometimes make a great sprite, especially if you are making something big.
Pick one: cold shadow/warm light or warm shadow/cold light. It depends on surroundings (for example on earth during day, sun drops warm yellow light on objects, and shadow is cold due to blue sky). Most of the light sources on station are warm, so I suggest most of the time to pick first one.

Other rules, like composition, proportions and such are basically... irrelevant. 
Here is an example of a big metal cube sprite step by step I made following the rules.

metal-cubes.png


In the last frame I added details, which vary from sprite to sprite depending on what exactly you are spriting. I added some symbols on front side to make the cube look like it is maybe magical, or people worship it like a god.
This type of details is a good tool to add meaning to your sprite. Then, i added shadow at the bottom. Most of the time you don't want shadows underneath your objects. Especially if they can be moved, ESPECIALLY if you can pick them up.
However, a shadow may be used on big static objects, like this one - a giant metal cube, certainly not moving anywhere and just gloriously sitting in one place dropping shadow like a boss.


Now lets talk about spriting using an actual example.
I have made a sprite of a drink. I imagined that I got an order: some anonymous maintainer decided to add to the game a new drink. Lets say they made some nuclear reactor, which while working, produces some liquid nuclear waste. If you combine it with vodka, some radioactive drink is made, which irradiates people who consume it. Maintainer needed a sprite for the drink and they called for us to make one.
This part about having specific object we are making sprite for is needed to show process of sprite creation (at least, how i do it).
Here is the process:

glass.png


1) I took a basic shape of a glass with some toxic green liquid inside. Good start.
2) Gradient. Excellent tool for a drink, definitely using this. Lower - darker, lets say we have some sort of precipitate at the bottom.
3) Dark bottom. Notice, how we are looking at drink not directly from side, but a bit from the top. That dark line is the bottom of the glass, standing on a table.
4) Highlight on the glass. Here I did what i told before - i looked up at all the other drink sprites and used the same angle of light source.
5) Details! I decided to put in a straw for a drink to look less boring. You can add whatever you want, it is just an example. Also I used red color for a straw because of contrast. You can see how it looks much better than some other  colors. Also notice, how i made straw's opacity lower at the bottom, good way to represent depth and the precipitate of the drink.

We also have a great tool - animation. Animation is something that brings life to your sprite, really makes people believe in it. With animation, you can highlight certain parts of a mob or object, which on a static sprite just blend in, without any chance for people to distinguish it. Sometimes animation is necessary to represent certain properties of an object or mob, like sparkles in a soda drink, fire of a campfire and so on. In our example we have radioactive drink. And what represents radioactivity? Thats right, menacing green glow! Just a few frames, and here is your drink, cheers!

glass.gif

Animation has some weird pixel on one of the frames, but dont worry, its just weird result of image scaling


Different tips and tricks:

1) Use references. It is as good for spriting as it is for regular art. 
2) Look at existing sprites. Use them as a guidelines. Sometimes you can even take few existing sprites and combine their parts to create something new.
3) Don't be lazy. Good sprite, even if its something small, takes time to create. Always make different basic variations, pick one you like most and work with it.
4) Practice. If you don't have anything to work on, take something you like (for example a monster from your favorite videogame or a coat you like) and try to create a sprite of it. Who knows, maybe people will even use it at some point.
5) Practice, practice, practice.
6) Practice.
7) When you make sprite, place it in environment. Make a screenshot in game or manually create a room using sprites from dream maker, and place your sprite in the world. If its a repetitive sprite (like floor tile), place a few copies next to each other. This is basically a testmerge, but for sprites. Look for mistakes and fix them.
😎 Did I mention practice?


P.S. Its kinda hard to make a big text in language i am not native in, so please point out at any grammar mistakes i made.

  • Like 1
  • Thanks 1

Share this post


Link to post
Share on other sites

*slams fist

I DEMAND that this drink be made a reality! Possibly also that cube, maybe as a decoration.

Share this post


Link to post
Share on other sites

Also I wonder if it'd be allowed to name some art programs that'd be good for spriting on the forum. Or would that break the no advertising rule?

Share this post


Link to post
Share on other sites
2 minutes ago, Darkmight9 said:

Also I wonder if it'd be allowed to name some art programs that'd be good for spriting on the forum. Or would that break the no advertising rule?

i dont think it would, but i can not unfortunately suggest any program. I am using photoshop, but its a bit too complicated if you havent used any

Share this post


Link to post
Share on other sites

Well Krita is a good free program to use. Make a 32x32 canvas and use the pixel art brushes and that will have you basically set. Even has animation support though it takes some digging to find it.

Share this post


Link to post
Share on other sites

For pixel-art/spriting, GraphicsGale is a really good free program to use. Made a bunch of pixel art animations for a game back in college (and also used it to update the abductor wiki a long time ago). Really useful program.

Share this post


Link to post
Share on other sites

This is a really good guide my dude! Happy you took the time to write it! 🙂
I also use GraphicsGale, and Photoshop for my sprites. Photoshop makes it really easy with a handy grid and layers, but Gale has those too, and It's free!

Share this post


Link to post
Share on other sites