Envision, Create, Share

Welcome to HBGames, a leading amateur game development forum and Discord server. All are welcome, and amongst our ranks you will find experts in their field from all aspects of video game design and development.

All About: Sprite Sheets

Tindy

Sponsor

All About
Sprite Sheets


A Sprite Sheet (or Character Set) is a set of sprites (characters, monsters, or objects in a game) in different positions and directions. It is a basic necessity to game making, as it makes NPCs, heroes, monsters, and any moving objects, such as fountains, move. As an event, it also easily allows players to take, use, and otherwise manipulate items. The number of positions in a set is defined by what game maker you use, but it can be altered with scripts. Most professional games have sprite sheets that can have hundreds of positions; by contrast, an RPG Maker VX sprite sheet is set by default at 3x4. Many game makers, such as RPG Maker XP, come with many sets premade; in order to customize your games, however, you will need to learn to make your own character sets (or have someone else make them for you). This particular tutorial is geared towards RPG Maker XP, but much of its contents can be applied to other makers. Consult the RM ReadMe file or prefabricated character sets to see how your particular maker works.

In RMXP, a default sprite sheet is 4x4 frames large. There is no size limit, but each frame must be the same size. The top row is always for facing down; next is facing left, then right, and the last row is facing up. This allows a character to have 12 frames of animation total. The pre-fab character sprites for this maker can be found in C:/Program Files/Common Files/Enterbrain/RGSS/Standard/Graphics/Characters.
Fighter01.png


Item sprite sheets work along the same lines, however, as they are used strictly for items like doors(which will presumably stay in one place), each frame of animation goes down the columns instead of across the rows. Since it is a much less complicated movement pattern (no directions to worry about), you can fit 4 or more items in a sprite sheet, with 4 frames of animation.

door.png


Fountains and other autonomous items, however, fit the same way as character sprite sheets. The reason for this is that they will both autonomously move the same way. This is so you won't need to press a button or have a character do something to make them move. (To find out how to actually MAKE the buggers move, go to the All About: Events tutorial.)

fountain.png


When placing sprites within a sprite sheet, care must be taken to insure that the sprites are centered and in the same place in each frame (with variations included for walking animation – see below). If they are not centered, animation will be jittery, with the sprites going one way or the other unintentionally. THE PROGRAM WILL NOT AUTOCORRECT SPRITE MOVEMENT.

With walking/running sprites, make sure that their movement is fluid. Generally, for the 2nd and 4th steps the convention is to move the sprite down by one to two pixels, but the main body will hardly ever move to the left or right.

To find out the size of a single sprite’s frame, simply divide the height and width by 4. This is a useful tactic in finding out just how small is too small and how large is too large when custom spriting.

To make your own sprites, it’s best to either use a pre-made sprite template, or take a sprite sheet that you already like the size of and erase the sprites (this is where diving by 4 comes in handy). When using MSPaint, you’ll have to count out/color/copy+paste each frame, but with Gimp or Photoshop, you can just set your grid to the size required. (All of the pictures were made with MSPaint. Gimp is a bit easier to work with, but takes almost as long to color the frames in the background.)
 

Thank you for viewing

HBGames is a leading amateur video game development forum and Discord server open to all ability levels. Feel free to have a nosey around!

Discord

Join our growing and active Discord server to discuss all aspects of game making in a relaxed environment. Join Us

Content

  • Our Games
  • Games in Development
  • Emoji by Twemoji.
    Top