An introduction to onion skinning in animation.
Onion skinning may sound like something you do in the kitchen with watery eyes, but it’s actually an animation technique that dates back to the early days of cinema. Get the lowdown on onion skin animation here — from its history to how it works.
What is onion skinning?
Onion skinning in animation is an editing technique used to see several frames of an animation simultaneously. This means the animator can tell whether the lines of each frame are correctly lined up — which is crucial to create an animation with smooth motion.
Historically, onion skinning in animation was made possible by the semi-transparent paper or ‘cels’ used by animators at Walt Disney Studios from the 1920s.
Why is it called onion skinning?
The name ‘onion skinning’ derives from comparisons between the editing technique and the humble root vegetable. Much like an onion is made up of multiple translucent layers of skin, animation frames are drawn on semi-transparent sheets known as cels.
This led animators at Disney in the 1920s to dub them ‘onion skins’ and the practice of layering these on top of one another, much like the layers of an onion itself, became known as ‘onion skinning’.
Cel animation is something else you can try at home. Learn more in our guide to cel animation.
Why is onion skinning used in animation?
Traditional animations consist of multiple individual sketches, with slight differences, presented in quick succession. For the person watching, the sketches appear as one continuous moving image. This is an optical illusion known as the ‘Persistence of Vision.’
To achieve this effect, each individual image must be replaced by the next one while your brain and eye still retain the previous image. Because the eye ‘sees’ this original image for a fraction of a second as the new image appears, it creates a feeling of motion or flow between the two images or frames1. When this process is repeated across multiple animation frames, it creates a moving image.
It’s this process and the concept of the Persistence of Vision, that makes animation through onion skinning such a useful tool to creatives.
If the angles and shape of the drawing on one frame differ too much from the following frame, the illusion of fluid movement between the two is lost. Onion skinning therefore enabled animators to be highly accurate when positioning the outlines of their characters and scenes. By placing the next frame on top of the previous one, they could see through the semi-transparent paper to know exactly where the lines should be drawn, to suggest natural movement.
With such a view, the artists can easily see and correct inaccuracies. Onion skin animation is therefore central to creating smooth, flowing animations.
How traditional onion skin animation works.
- The animator draws an outline of the first frame on a transparent sheet or cel, without adding any colour. This is frame one.
- The animator puts a second cel on top of the first and copies the outline illustration to suggest the character has moved slightly. This becomes frame two.
- They can now see the position of the character in frame one against their position in frame two, helping to create an accurate depiction of movement.
- They now repeat this process, adding an additional cel for every frame and slightly adjusting the character’s position from the previous frame.
- With all the cels or sheets stacked together, it’s easy for the animator to see any discrepancies where the position of the character is out slightly.
Fascinated by the world of animation?
Keep learning by reading our beginner's guide to animation.
Onion skinning in the digital era.
Onion skinning in the early days of Disney was a laborious process, carried out in a studio environment by professional artists.
A lot has changed since then.
Powerful creative software like Adobe Photoshop and Adobe Animate have helped digitise the onion skin animation process in recent decades.
Instead of working with individual sheets or cels, you can simply create your animation along the digital timeline. This has enabled both hobbyists and professionals at studios and creative agencies alike, to use the onion skinning technique efficiently and easily.
How to use onion skinning in Adobe animation.
If you’re familiar with Adobe Photoshop, you should be able to get up and running with onion skin animation quickly. Onion skin mode in Photoshop enables you to view the current frame at the same time as previous and forward frames in the animation timeline.
What’s more, there are various onion settings you can adjust to change the way the frames appear. These include:
- Onion Skin Count. Sets the number of previous and following frames you want to include.
- Frame Spacing. Sets the number of interloping frames you want to place between displayed frames.
- Max Opacity. Sets the opacity level for the two frames on either side of the current time.
- Min Opacity. Sets opacity levels for the final frame of both the before and after sets of onion-skin frames.
- Blend Mode. Controls how the overlapped area of the frames look.
Onion skinning animation: FAQs.
Are there different types of onion skinning?
Yes, there are different methods of onion skinning. You can either do it analogue with cel sheets and pen or digitally using software like Adobe Photoshop. But though the methods are different, the aim and outcome of both is similar. You can also use onion skinning to look forward, backwards and both.
How do I activate onion skin in Photoshop?
To activate Onion Skin Mode in Photoshop you need to be working in the Timeline panel on an animation. Then, simply select Enable Onion Skins. From there you can choose various Onion Skin Settings affecting frame spacing, opacity and more.
How do I activate onion skin in Animate?
To activate Onion Skin Mode in Animate you also need to be working in the Timeline panel on an animation. Then, click the Onion Skin button. From there you can choose various Onion Skin Settings including customising colours and opacity and outline and fill mode.