Video Game Design and Development

Encouragement, advice, and support for aspiring game designers.

  • Schools
    • Online Schools
    • Game Design School Rankings
    • Game Design Majors
    • Graphic Design Schools
    • Canada Game Design Schools
    • Art Schools in The USA
  • Development
    • Game Programming Languages
    • Game Development Software
    • Texture Packager
    • Roblox Coding 101
    • Gaming in C ++
    • Video Game Engines Guide
    • How to Build a Game Engine
    • Unreal Game Engine
    • Unity vs Unreal
    • Unity vs Godot
    • Java
    • Cross Platform Games
  • Careers
    • Become a Game Designer
    • Education Requirements
    • Geme Design Document
    • Video Game Ideas
    • 3D Modeler
    • Game Artist
  • Animation
    • Animation School Rankings
    • 2D Animation Software
    • New York Animation
    • California Animation
    • Animation in Canada
You are here: Home / Animation / Simple Tools to Make Animation Sprites

Simple Tools to Make Animation Sprites

Sprites Animation

Table of Contents:

    • What is Sprite Animation in Multimedia?
  • Animating A Sprite
  • How Do You Animate A Sprite?
    • The Heart of Every Sprite Sheet
    • Slicing Sprite Sheets
  • Coding Sprite Sheet Animations
    • Which Command Will Show Animation for Sprite?
    • How Many Frames Do You Need for Sprite Animation?
  • Sprite Animation Tools
    • Piskel the Free online sprite editor
    • Sprite Sheet Animator
    • Aseprite – Animated sprite editor & pixel art tool
    • BobSprite – Free Online Sprite Editor

What is Sprite Animation in Multimedia?

Sprite images are 2D bitmap graphics found in several games and other media. If you have ever played 2D games like Final Fantasy VI, Chrono Trigger, and the more recent title, Octopath Traveler, you are already familiar with sprites in games.

Creating and animating sprites allows game artists and developers to control characters and objects independent of the larger scene.

Sprites can be stationary or animated, depending on their function in the larger scene or project. Video game consoles like the Commodore 64, Nintendo Famicom, and Atari systems are iconic for their game design innovation using only 2D sprite animation.

With a colorful history like that, how do you get in on the creative action?

Animating A Sprite

Sprite Animation

Let’s look at some of the basics when it comes to sprite animation.

How Do You Animate A Sprite?

Animation sprites, while some of the more simple forms of virtual art, you most likely won’t be able to pick it up on our first try.

First, we recommend that you get ahold of some sprite sheets or create your own sprite. Have an original character you’ve been meaning to animate? Now’s the time!

A sprite sheet is an outline of all of the actions you want a character to perform. If your character is running, you need to animate sprites performing each move in a single frame.

The sheet itself displays everything, and the sprite maker must choose what action to render.

The Heart of Every Sprite Sheet

Cycles and frames are the two main things that make up every sprite sheet. What you see of a sprite sheet is a bunch of frames, all aligned and ready to be animated. When someone finally puts some animation magic into their creations, those frames become cycles.

Cycles of frames are what make the sprite animation what it is.

In The Legend of Zelda: A Link to the Past, images of Link holding his sword in different positions are frames, while the action of him swinging the sword is the cycle of all of those frames put together.

Now that we know a little more about what sprite sheets are, let’s see how we transition frames in sprite animations.

Slicing Sprite Sheets

If you want to cut your sprite sheet down considerably to separate the images, it’s pretty simple to do. This is perfect for creating small gifs. There are plenty of methods and tools to slice your image, either by tile size or the number of columns and rows.

An excellent resource is the online sprite sheet cutter at EZGif.com. It also allows you to split and decompile your sprite sheets.

Coding Sprite Sheet Animations

Coding Sprite Sheet Animations

Which Command Will Show Animation for Sprite?

The ‘Next’ command. Simply type in the command ‘next’ with whatever you want to show. For example, ‘next move,’ or ‘next look.’

How Many Frames Do You Need for Sprite Animation?

It depends on who is creating the frames. If you are a rookie sprite animator, you might want to stick to a lower amount of sprites. It would be best if you accounted for frames for every action a character does. So a character could have ten walking frames, five jumping frames, and ten running frames. 24-40 frames are pretty standard.

You don’t want to overburden yourself with a ton of frames, so don’t let your animation get too busy. It also depends on how many megabytes and resolution you are working with.

sprite tools post

Sprite Animation Tools

Here are some fantastic tools to use to animate sprites, create your own cycles, and improve your frames.

Piskel the Free online sprite editor

This is a great sprite editor that you can use to create and animate sprites right in your browser of choice. You can create your very own gallery and export it to your file format of choice. Piskel gives you total control, even giving you the liberty to use your creations in commercial projects.

Sprite Sheet Animator

Sprite Sheet Animator is perfect for any sprite maker who wants to get right into a project. It includes different dimensions of the sprite you can format and build upon.

You can quickly animate sprites once you have filled out the proper measurements and artwork from either the web or your computer. You can even make an animated gif, all in one place.

Aseprite – Animated sprite editor & pixel art tool

This fantastic little sprite editor allows you to create, animate, and edit sprites right in one place. The retro style and sheer amount of options make it ideal for any aspiring sprite animator.

You have color palette control, animation modes, looping playback, different brush sets, and nearly every export option available.

It costs $20. You can try it out with the trial version, but be warned: you can’t save any projects in the free version.

BobSprite – Free Online Sprite Editor

Like Piskel, BobSprite is a fantastic, simple sprite animator that allows you to create from your browser. All you need is an updated version of Google Chrome or Mozilla Firefox. Click any screenshot on the BobSprite page to launch the application and start drawing!

ShareTweet

Written by Bryan Wirtz - Updated on February 27, 2023

Popular Posts

Synfig Studio
Synfig Studio: Free and Open-Source
animator internships guide
How to Find a Promising Internship in Animation
top colorado animation colleges
Explore Colorado Animation College Programs

About Bryan Wirtz

A graduate of Penn State University and a Philadelphia native, Bryan has been a gamer since day one. Using his vast experience of gaming, game culture, and all things tech, Bryan aims to deliver the most up-to-date and captivating game design content to readers.

Leave a Reply

Your email address will not be published. Required fields are marked *

Categories

  • Animation
  • Career
  • Engines
  • Experts
  • Gaming
  • Graphic Design
  • Learn
  • Technology
  • Video Game Design Education

GameDesigning.org is reader supported. When you purchase through links on our site, we may earn an affiliate commission. Learn More.

Recent Posts

  • How to Create Video Game Atmosphere
  • How to Make an Artist Portfolio Website
  • Hideo Kojima: Influential and Innovative Video Game Director and Writer

Site Info

  • About Us
  • Cite this Website
  • California Consumer Privacy Act
  • Editorial Guidelines


DMCA.com Protection Status

Connect

  • Contact Us
  • Facebook
  • Twitter
  • Pinterest

Copyright © 2023 · Privacy Policy · Terms · Earnings Disclaimer