It’s been a while, but here we are again!

Today I will tell you how to cheat draw simple sprites. At least, the way I do it. I don’t know what exactly I’ll do for the Locus Magici sprites yet, but it won’t be the same. Might do a post on that later, but these following sprites are meant to be done quickly.

So in short, I’ll tell you how I made this:

Cecile

What I used
I mostly used Paint Tool SAI, but also used Photoshop for colour adjustments and aligning the sprites. Since they both open .psd files, it’s a nice combination. 

Step 1 – Concept and sketch

First of all, I make a rough concept of the character, which usually becomes a pose later on. For Cecile I made a different pose first, so her concept looked like this.

The reason why it’s good to do this, is because:
1) You can test it on a background to see how it looks in the VN!
2) You can define the general personality well with this concept.
3) You can decide on the lighting and the general colours (which is great if you work with a team who needs to OK it).
4) You can still make big adjustments easily, should you need them. 

Besides, you will need to make a good sketch for the sprites anyway. Just remember to keep the sketch and rough colouring on two separate layers or it will be a pain to ink over later.

Step 2 – Inking

Inking means it’s time to get all the fun details added in. Create a new layer above and below the sketch layer. Turn down the opacity of the sketch layer and fill the bottom layer with a nice colour. Ink on the top layer.

I used a dark brown colour for the lines, to make them a bit more natural, but you could also use black, lock the transparency of the layer and colour over it with your desired colour once you’re done.

For these sprites I was experimenting with the lines a little, since the last time I drew lines I noticed how sharp they were. To get a bit of a softer look I used these settings (SAI):
– Brush tool at size 8.0 ~ 10.0
– min size 0%
– density 100%
– colour blending ~30, opacity mix ~20, persistence ~80

You should really experiment with these settings (and the advanced settings) to get the look you want. I will be doing that as well, since I’m not yet satisfied with how the lines look; I want something between the sharpness of the pen tool and the smudginess of the brush tool, and thinner lines might work better.

Step 3 – Flat colouring

I am very, very lazy with this. You know those people who make one layer for each colour? I’m not one of them. All my flat colours are on one layer, because it saves me time and keeps things simpler.

Using the magic wand is the key in this process if you want to get it done quickly. Simply select your line-art layer, pick the magic wand tool and click on the areas you want to be a certain colour. Now, because I am even more lazy, I made a hotkey for the bucket tool.

Go back to your colour layer and smash your hotkey or use the bucket tool to fill the selected area with your current colour. Check if you missed any spots (you will, trust me) by using convenient background colours and filling these spots up with the pen tool.

Also, if you want to add details on the flat colours (such as lines on the uniform) creating a layer on top of it and colouring on that should do the trick. Just call it ‘details’ and voilà.

Step 4 – Shading

Again, we’ll be using one layer, but this time it has a little trick to it. You see, we’re going to set this layer to ‘multiply’. It’s an option you can find somewhere close above the layers window in both SAI and PS.

Now, take the brush tool, increase the size, pick a nice colour. I used Salmon-ish pink for this to give it a warm feel, but blue and other colours work fine too. Whatever you do, don’t use some kind of grey colour; it makes your sprite look dull and dead.

Then shade that baby while keeping the direction of the light source in mind. You can use the water tool to soften the shading on the skin and get a nice hard-soft shading balance.

You can also lock the transparency of the shading layer and then use the airbrush or brush tool to make slight variations in the shading colours. For example, I wanted some parts of the shirt to be more blue-ish, so I went over it with a colder pink.

Step 5 – Lighting

This is much like the shading step, except with a different layer mode. You will set the layer to ‘overlay’ this time and then use a nice fitting colour (for example pale yellow or light blue, experiment!) to add light.

I also like adding just a little bit of light on the opposite side (where the shading is) because it gives the drawing more depth.

For Cecile I even made an additional layer to light her hair better (I wanted the light to be more blue), and just lowered the opacity of that layer to prevent it from becoming too bright.

Step 6 – Poses and finishing touches
I prefer sketching all poses at once and colouring them all at once for the sake of consistency. You can make a rough sketch on top of the first pose and then check if proportions are all right by dragging it to the side (which is why I prefer using a bigger canvas than I would need).

In the end you can save each finished sprite, make one big psd file with all the finished sprites in it and then align these in Photoshop to make sure they’re on the same spot. You can also then do colour adjustments, by messing with the levels (image -> adjustments -> levels, or ctrl+L). I like adjusting the individual levels manually. Same goes for contrast and what not, just have fun trying things out.

—

And that’s all! To keep it short, I might have skipped over a few things here and there. Cecile is one of the public domain sprites I made for this project by the way, so go ahead and use the two of them if you want.

~Anna