Skip to content

Spriting with GIMP

MyNameIsTrez edited this page Nov 23, 2022 · 24 revisions

Introduction

This is GIMP.

gimp

GIMP is completely free and one of the few programs that can be used to create sprites for CCCP, but it's often a daunting program to learn for newcomers.

The upside is that you need less than 1% of what GIMP's capable of in order to sprite like a pro for CCCP, and this tutorial has an image for every step, but if you get stuck please do tell me where on Discord (#MyNameIsTrez1585) so I can prevent future people from getting stuck. :)

Why GIMP

The reason why you should use GIMP instead of Paint/Paint3D/Paint.net/etc. is because those other programs don't support indexed color mode.

If your image isn't in indexed color mode, it'll look corrupted in-game.

But why does the game use indexed color mode

Pixels in most images are stored using one byte (256 values) for the red channel, one for the green channel, one for the blue channel, and one for the alpha channel, totaling 4 bytes (16 million colors).

CCCP's indexed images however only use 1 byte per pixel. This means its images take up 4 times less storage space! It also means that only the 256 colors of the game's palette can be used in sprites.

This is quite limiting because the palette wasn't made very well and misses a lot of normal colors, but it also creates the CC look that we all love, and it means that mods won't ever clash too much in style.

The magenta color in the palette's top-left corner is what you use in order to indicate which pixels you want to be transparent.

The reason image

Getting started

First off, download GIMP.

Let's say we want to draw this sprite.

checkbox001 - Copy

Right-click this empty spritesheet and select Save image as...

Note: DO NOT use the Copy image option since it doesn't retain the image's palette, breaking the image.

empty-spritesheet

Drop the downloaded image on top of GIMP to open it.

image

Zoom into the color palette area in the top-left of the image by holding the Ctrl key down and scrolling up and down with your mousewheel.

image

If you don't see a GIMP window called Toolbox yet, click the Windows button at the top of GIMP and click New Toolbox.

image

When hovering over any tool its shortcut will be displayed; it says it's O for the color picker.

Select the Color Picker Tool.

image

Click any color in your image. It will show up as the top colored rectangle, red in my case.

image

Click the arrow in the top-right of this image to swap your color with your stored one, and then click a different color in your image.

image

Clone this wiki locally