How to Animate on FlipaClip Tutorial for Beginners (FREE!)

Summary

In this tutorial, you'll learn how to create animations using just your phone with the Flipaclip app. The instructor walks you through downloading and setting up the app, creating a new project, and using various tools and features like layers, onion skin, and the lasso tool. You’ll animate a bouncing ball and learn about key animation principles like squash and stretch. The tutorial also covers adding audio and syncing mouth movements for character animation. By the end, you’ll know how to animate and export your creations for YouTube.

Takeaways

• 📱 You can animate using just your phone, with apps like Flipaclip, Rough Animator, and Procreate.
• 📥 Flipaclip is free and accessible, making it a good choice for beginners.
• 📲 To start, download Flipaclip from your app store, install it, and open the app.
• 🔧 Familiarize yourself with Flipaclip's default tutorial to understand its tools.
• 🎨 Create a new project, name it, choose a background, and set your canvas size and frame rate.
• 🖌️ Use the tools on the left for drawing, with the animation timeline at the bottom and layers on the bottom right.
• 👆 Zoom in and out using two fingers, and use the undo and redo buttons as needed.
• ✏️ Select drawing tools, adjust their size, and choose colors from default palettes or create your own.
• 🔄 Use the lasso tool to select, transform, rotate, and move parts of your drawing.
• 🗂️ Utilize layers to organize your sketches, inks, and colors, and adjust their opacity and visibility.
• 🏀 Practice animating with a simple bouncing ball exercise, using squash and stretch principles.
• 🎬 Export your animation by making a movie and sharing it on YouTube or other platforms.
• 🔊 Add and edit audio for lip sync animations, using a phenome chart as a guide.
• 🗣️ Create and animate mouth shapes for lip sync by copying and pasting frames to match the audio.
• 🎥 Review and play your animation to ensure smooth transitions and correct lip syncing.

Q & A

What app is recommended for animating on phones in this tutorial?

The tutorial recommends using the Flipaclip app for animating on phones.

Can the Flipaclip app be used on both Android and iPhone devices?

Yes, the Flipaclip app can be used on both Android and iPhone devices.

What are some other animation apps mentioned in the tutorial?

Other animation apps mentioned in the tutorial include Rough Animator and Procreate.

How do you start a new project in Flipaclip?

To start a new project in Flipaclip, click on the plus button to create a new project, give it a name, choose a background, select a canvas size, and set the frames per second.

What canvas size is recommended for the highest resolution in this tutorial?

The tutorial recommends selecting YouTube 1080p for the highest resolution.

What is the recommended frames per second (FPS) setting for a smooth animation in Flipaclip?

The tutorial recommends setting the project to 12 frames per second (FPS) for a smooth animation.

How can you zoom in and out on the canvas in Flipaclip?

You can zoom in and out on the canvas in Flipaclip using two fingers to pinch or spread on the screen.

How do you add a new layer in Flipaclip?

To add a new layer in Flipaclip, click the layers panel on the bottom right, then click the plus button to add a new layer.

What tool is used to create a bouncing ball animation in the tutorial?

The tutorial uses the pen tool and the lasso tool to create a bouncing ball animation.

How do you export your animation from Flipaclip to YouTube?

To export your animation to YouTube, click the three dots on the top right, select 'make movie,' then 'make movie' again, and finally click the share button and select YouTube.

What principle of animation is demonstrated by the bouncing ball example?

The bouncing ball example demonstrates the principle of squash and stretch.

How do you add audio to your animation in Flipaclip?

To add audio to your animation in Flipaclip, click the music note on the bottom left, then click the plus button on the bottom right to either add downloaded audio or record your own audio using the microphone icon.

What feature allows you to see the previous frame while drawing the next one in Flipaclip?

The 'onion skin' feature allows you to see a ghost image of the previous frame while drawing the next one in Flipaclip.

What tool is used to transform and move parts of a drawing in Flipaclip?

The lasso tool is used to select, transform, and move parts of a drawing in Flipaclip.

How do you copy and paste frames in Flipaclip?

To copy a frame in Flipaclip, hold down your finger on the frame, select the copy button, then go to the desired frame and hold down your finger again to paste it.

Outlines

00:00

📱 Introduction to Mobile Animation

This tutorial covers animating using phones, specifically an Android phone, but it also works for iPhones. The app 'Flipaclip' will be used, which is free and accessible to everyone. Other recommended apps include 'Rough Animator' and 'Procreate.' The tutorial starts by downloading Flipaclip from the app store and setting it up. Users are advised to follow the in-app tutorial to get familiar with the tools. The first step is creating a new project, naming it, choosing a background, and setting the canvas size to YouTube 1080p. The frames per second (fps) is set to 12 for a smooth animation while minimizing the number of frames to draw.

05:01

🔧 Setting Up Your Workspace

The video explains how to open Flipaclip and navigate the interface. Tools are on the left, the animation timeline is at the bottom, layers are on the bottom right, and the play button is on the right. To zoom and rotate the canvas, use two fingers. The pen tool is selected by default, and users can undo or redo actions. The tutorial covers selecting different drawing tools like the pencil, paintbrush, and highlighter, adjusting brush size, and choosing colors. The eraser tool and its options are explained, along with the paint bucket tool for filling shapes.

10:02

✂️ Using Advanced Tools and Layers

The tutorial introduces the lasso tool for selecting and transforming parts of the drawing, such as scaling and rotating. The concept of layers is explained, comparing them to stacks of paper. Users can add, delete, lock, copy, and adjust the opacity of layers. Naming layers is encouraged for organization. An example of using layers is shown by adding a color layer beneath an ink layer. The tutorial then demonstrates creating a basic animation of a bouncing ball, utilizing the onion skin feature to see previous frames and copying frames to create smooth motion. The importance of squash and stretch in animation is highlighted.

15:04

🏀 Animating a Bouncing Ball

The video shows how to animate a bouncing ball, a fundamental exercise in animation. Starting with a ball at the top of the canvas, the tutorial uses the onion skin feature to draw successive frames of the ball moving downward, applying squash and stretch principles for a realistic effect. The tutorial explains how to copy and paste frames to reverse the ball's motion for the bounce back up. Adding in-between frames is demonstrated to smooth out the animation. The video emphasizes that more drawings lead to smoother animations but also increase the work required. The completed animation is then played back.

🎬 Exporting and Lip Syncing

After finishing the animation, the tutorial shows how to export the project for YouTube by selecting 'Make Movie' and sharing it directly to YouTube. The video then shifts focus to lip-syncing, adding audio to the animation. Users can record their own audio or add a pre-recorded clip, trim the audio, and sync it with the animation. The tutorial explains creating hold frames for consistent character positions and introduces a phenome chart for drawing mouth shapes corresponding to different sounds. Copying and pasting mouth shapes for different frames is demonstrated to achieve accurate lip-syncing. The finished lip-sync animation is played back to show the results.

👍 Final Tips and Farewell

The video concludes by encouraging viewers to like and subscribe for more tutorials. The importance of sharing the video and leaving comments with questions or project updates is emphasized. The tutorial wraps up with a thank you message and well wishes, inviting viewers to check out future content and continue practicing animation on their phones.

Keywords

💡Flip a Clip

Flip a Clip is an animation app used for creating animations on mobile phones. It is highlighted in the video as the primary tool for learning animation due to its accessibility and free availability. The tutorial walks through downloading, setting up, and using Flip a Clip to create a simple animation.

💡Animation

Animation refers to the process of creating motion and shape change illusion by means of the rapid display of a sequence of static images that minimally differ from each other. In the video, animation is created using Flip a Clip, demonstrating the fundamental steps such as setting up a project, drawing, and using tools to animate a bouncing ball and a character lip-sync.

💡Layers

Layers in animation are used to separate different elements of the artwork, similar to sheets of transparent paper stacked on top of each other. The video explains how to add, rename, and organize layers, demonstrating their use in keeping sketches, ink, and color separate, and adjusting their opacity for better workflow management.

💡Frames per second (fps)

Frames per second (fps) indicates the number of individual frames or images that are displayed per second in an animation. The tutorial recommends starting with 12 fps for smoother animation while balancing the amount of work required. The choice of fps affects the animation's smoothness and the workload.

💡Onion skin

Onion skin is a feature in animation software that shows a ghosted image of previous frames to help animators see the progression of motion. This tutorial uses onion skin to aid in creating consistent motion for the bouncing ball animation, demonstrating how it helps in drawing the next frame in the sequence.

💡Squash and stretch

Squash and stretch is an animation principle that gives the illusion of weight and volume to characters as they move. The tutorial demonstrates this principle using a bouncing ball, showing how to squash it when it hits the ground and stretch it as it moves fast, emphasizing the realistic movement.

💡Lasso tool

The lasso tool is used to select parts of the drawing to transform, such as moving, scaling, or rotating the selected area. The tutorial shows how to use the lasso tool in Flip a Clip to adjust parts of the animation, such as the ball’s position and shape during the animation process.

💡Lip sync

Lip sync in animation involves matching the mouth movements of a character with spoken audio to create the illusion of speech. The video demonstrates how to add audio to an animation and create different mouth shapes to sync with the audio, enhancing the realism of character animation.

💡Brush size and hardness

Brush size and hardness are settings in drawing tools that determine the width and edge sharpness of the brush strokes. The tutorial explains how to adjust these settings in Flip a Clip to achieve different drawing effects, such as creating fine details or broader strokes, and adjusting the eraser for soft or hard edges.

💡Export

Exporting is the process of saving the final animation in a specific format to share or upload it, such as to YouTube. The tutorial guides through the steps of exporting the completed animation from Flip a Clip, including adjusting settings and selecting the format for the final video output.

Highlights

Learn how to animate using just your phone with Flipaclip.

The tutorial uses an Android phone, but it works for iPhones too.

Flipaclip is free and accessible, making it the chosen app for this tutorial.

Other recommended apps include Rough Animator and Procreate.

Step-by-step instructions for downloading and installing Flipaclip.

Importance of checking out Flipaclip's default tutorial to get familiar with the tools.

Create a new project, choose a background, and set canvas size to YouTube 1080p for high resolution.

Explanation of frames per second (fps) and recommendation to start with 12 fps.

Overview of Flipaclip's interface: tools on the left, timeline on the bottom, layers on the bottom right, and play button on the right.

Detailed guide on using the pen tool, including size and color options.

Explanation of the eraser tool and its options, including size, hardness, and transparency.

Introduction to the paint bucket fill tool and how to use it.

How to use the lasso tool for selecting and transforming parts of your drawing.

Importance and functionality of layers in animation, including adding, deleting, and renaming layers.

Animating a bouncing ball as a basic exercise, including squash and stretch principles.

Instructions for copying and pasting frames to create smoother animations.

Guide to exporting your animation for YouTube.

Adding and editing audio for lip-sync animation, including recording your own audio.

Creating and using hold frames for lip-sync animations.

Using a phenome chart to draw accurate mouth shapes for lip-sync.

Final lip-sync animation demo with audio.

Encouragement to like, subscribe, and share the video if the tutorial was helpful.

Transcripts

in today's tutorial we will learn how to

animate using nothing but

our phones

[Music]

and the example i'll be using is an

android phone but this will work for

iphones as well

so the app i'm going to be using for

animating on our phones is called flip a

clip

there's also other apps that i would

recommend like rough animator which is

about five dollars and is also a very

good app and also procreate but in this

tutorial flip a clip is free and pretty

much accessible to everyone so that's

the one we're going to use

so we're going to open up our app store

and we're going to type in flip a clip

to download it

then click the install button so now

that you've got flip a clip downloaded

let's open it and i'll just turn my

screen horizontal so we can see what

we're working on

it'll ask some questions when you're

first installing i don't want to give

away how old i am

34 but um and then when it first starts

up there's a little tutorial

i recommend checking out its default

tutorial just so you get familiar with

how to use all the tools but we'll also

go over the tools in this video

so i'm going to click dismiss for now so

to start a new project we're going to

click on the plus button to create a new

project

give a name to your project we'll call

this one first

animation click done and then we can

choose a background for our animation

so it comes pre-installed with all these

backgrounds already loaded onto it

or you can use the paint bucket to

select a color use the

image gallery or you can take a photo

with your camera button here

but we'll just leave it blank for now

and then for the canvas size

you can select all these different

default options

i'm going to select youtube 1080p

because that'll give us the highest

resolution for our project

then click the check mark to say ok and

for frames per second

you can think of this as how slow or how

fast your animation is

so for this project we're going to do 12

frames per second

i recommend starting this way because

it'll give you a nice smooth animation

but you also won't have to draw as many

frames

if you're okay with drawing a lot of

frames 24 frames per second is pretty

standard as well

and will give you a nice smooth

animation so we'll set our project to 12

frames per second

press the check mark and we're all ready

to go so select create project

and we have our project created so for

some phones you'll be able to rotate

your canvas using your two fingers and

rotating

some phones will not be able to support

this but we'll turn it on for this

example

just so you can see what that looks like

and when you first open up flip a clip

all your tools are on the left side your

animation timeline is on the bottom

your layers is on the bottom right and

your play button for your animation is

on the right

then you have your tools for your canvas

on the top right

to move around your canvas and flip a

clip you can use two fingers to zoom

in and out and you can also rotate it if

you enabled that

option before so zooming in can be

really useful for drawing like fine

details for example

and to zoom back out you can select this

four arrows on the top right here

and that'll reset your view back to a

hundred percent so the pen

is selected by default when you first

start out and if you select with your

finger and just start drawing

it'll start drawing for you if you want

to undo just click the backwards button

here

and to redo select the forward button if

you select any of the tools after it's

been clicked

on already you'll get your options for

your tools

so this top option if we click it we can

select

pencil paint brush or highlighter and

then the next option is the size of your

brush

so if you press and hold you can see a

little size option and then if you drag

up you can get a bigger brush and if you

select that circle

and drag down you can get a smaller

brush

and then the square below that is how

you select your color

so you'll see that it has all these

default color palettes

next to it i like selecting the sketches

palette personally

and then you'll see these colors appear

on the right so you can select

different colors on your palettes or you

can create your own palette by clicking

this add palette button at the bottom of

it

or you can select what color you want on

the outside ring

and then selecting how dark or how light

it is in the middle

my next tool is my eraser so i can

select that

and then select it again for the options

and again you have

the size as your first option and then

you have the hardness of eraser as the

next option

so it'll have either a really soft

outline so you can get

really soft edges or if you drag it all

the way to the bottom

you'll have really hard edges for really

solid erasing

and then the next option is the

transparency amount so if i didn't want

to erase it completely i could set this

to say 50

and then erase it and it'll only erase

our drawing 50 percent of the way

there's also the paint bucket fill tool

so if i create a shape

and then use my paint bucket tool and

press in the middle it'll fill it in

and again you can click on it again and

then press the color button to select

what color you'd like it to fill in with

the next tool i want to go over is the

lasso tool so the lasso tool is very

useful

so what you can use it for is selecting

a part of your drawing

and then you'll see this transformation

box around it so we can select our

corners to scale our drawing

or we can select the sides to scale it

only on one side

or we can select the circle to rotate

our drawing and we can also move this

anchor point in the middle here

so that it rotates along a certain point

of the drawing

so this is good for say moving arms

around or moving the head around on the

point where the pivot would be which

would be the neck

and you can also select flip horizontal

on the side here or flip vertical

or delete it entirely with the trash can

when you're done transforming your

drawing

just select off of it and the lasso tool

will disappear

so the next thing i want to go over is

layers for your animation

so your layers panel is on the bottom

right here right where this stack of

paper is

and that's kind of what you can think of

layers as is stacks of paper

so if i select it my sketch layer is on

the bottom here and then my ink layer is

on the top

if i want to add a layer i can just

click this plus button on the bottom

here

and it'll add a layer to delete a layer

i can swipe

to the left and i'll get options to

either lock the layer

copy the layer or delete the layer if i

want to change the opacity for a layer

like i did with my sketch layer here

i can press and hold and i'll get the

same opacity

slider so i can drag up to make it more

opaque

or drag it down to make it more

transparent

so i have it at 50 right now and if i

want to make it invisible

i can tap it instead of holding it and

you'll see a little eyeball with a cross

through it showing that it's invisible

but it's still there and to rename a

layer i can tap on the name

and rename it it's important to name

your layers just so you have everything

nice and organized

always a good habit to get into so for a

quick example of how layers work i can

add a layer

call it color so if i color in this

layer

you can see the color is appearing

behind the ink layer

but if i take that layer and drag it on

top you'll see my color is now in front

of my ink layer

so this is typically how i like to

arrange my layers i like to have the

sketch on the bottom at about fifty

percent

my color layer in the middle and then my

ink layer on top

so now that we know how to draw and flip

a clip let's animate something

so the example we're going to use when

we animate is a bouncing ball

it's a really great exercise when you're

first learning to animate and it's kind

of a cool thing to show off once you're

done

so to start off draw a small ball at the

top of your canvas

or if you're having trouble drawing a

ball you can use this ruler tool

at the top here and these are the shapes

that you can draw with the ruler

so we'll select circle bring in the

sides to make the circle smaller

and then drag it in place using the

square in the middle and then whatever

tool you have selected in your drawing

tools

you can trace around the circle like so

and you'll get a perfect circle

then just click the ruler icon to get

rid of the ruler so to add a new frame

in your animation simply click the plus

button down in your animation timeline

at the bottom

and this will add a new frame you'll see

a ghost of the image before

this is called onion skin and it allows

us to see where we need to draw the next

position

in our animation to turn the onion skin

on and off

you can click the three dots on the top

right and select this toggle for onion

skin

and the way animation works is we're

basically drawing the same thing

just in a slightly different position so

for this next drawing

you can either draw the next circle or

you can go back to frame one by

selecting it like so

and then clicking this copy button on

the top and then go to frame two

and click the paste which is this little

clipboard icon

and it'll paste the same drawing but

we'll need to move it into position

so we'll select our lasso tool select

our drawing

and we'll move it just slightly down

so the way a bouncing ball works is

gravity slowly affects something right

so these first few drawings are going to

be really close to each other

this is called an ease in so we'll

select off of it

we'll go to our next frame by clicking

the plus button to add a new frame

we'll press paste again to paste that

same ball select it again

and this time we want to move it even

further down

so we'll do this a couple more times i'm

going to add another frame

paste it again lasso around and then

move it down

but this time we're going to do what's

called a stretch drawing

to stretch this ball we're going to

squeeze it in on the sides by selecting

the side transform

squeezing it in a bit and then for as

much as you want to squeeze it in

you want to create an equal amount of

stretch on the opposite side so we'll

stretch it out

a little bit that way and then the next

drawing is going to be

even more extreme this will be our last

stretch drawing

so squash and stretch is a very

important principle in animation

most everything moves with squash

stretch and it's a very important thing

to

practice and a bouncing ball is a very

basic example of it

so for our last drawing we'll have it

stretch all the way at the bottom like

so

and then when it finally impacts the

floor we'll have this ball

do a squash drawing so instead of

stretching out because it's moving so

fast

it's squishing down because it's

impacting the ground so we'll have it

squished down like so

so now that the ball is squashed on the

ground we want to have it bounce back up

in reverse order

so we can draw the frames again or we

can copy and reuse the frames we've

already drawn

so go back one frame hold down your

finger on that frame and you'll see a

bunch of options for it

you can insert blank frames by selecting

the plus buttons on the left or the

right

this is good for adding in betweens we

can delete the frame with the trash can

or we can copy it with the copy button

right here

so once we selected that we have that

frame copied then we go back to our last

frame

hold down our finger again and select

the paste button with the arrow pointing

to the right

and that'll paste that same drawing onto

the right side

then we want to go back one more frame

which is frame four in this case

hold down our finger copy that go to the

end of our animation hold down our

finger

and paste to the right and we just

repeat this process until we finish

copying and pasting our animation to the

right

and i won't copy and paste the first

drawing since that's the first drawing

in our loop

to test out our animation we can click

the play button on the right here

and you'll see we have our bouncing ball

if we wanted to add an in-between

between any of these frames to smooth it

out

say for example from the squash drawing

up to this stretch drawing

we can add a blank frame in between by

holding down our mouse button

and clicking the plus with the arrow

pointing to the right and that'll add a

blank frame

in between then we can put an in-between

by

pasting our ball again and then just

putting a little in between so we can

smooth it out a little bit

and now you'll see when we play our

animation it's been smoothed out for

that frame so that's how you can add

more in-betweens to kind of smooth out

your animation

remember that the more drawings you do

the smoother your animation is gonna be

but also the slower it's gonna be

so now that we're finished with our

animation let's export it for youtube

so to export your animation click the

three button up on the top right

select make movie and we're gonna leave

all these options the same but you can

change them and then to start exporting

it we're going to select make movie

and now our video has been created if

you want to upload it to youtube just

click the share button

and select youtube from the selection

here so now that we know how to do a

very basic animation

and flip a clip let's talk about how to

do a lip sync character

so we have our character already colored

in but we haven't done a mouth animation

yet

to add audio to your animation click the

music note on the bottom left of your

screen then to add audio

click the plus button on the bottom

right and with the album picture

you can add a downloaded piece of audio

or with the microphone

you can press the microphone and press

and hold to record your own audio

let's record something right now why

hello there

and you can play to preview your audio

why hello there

and then press the check mark to add the

audio to your animation

and then drag it in to where you want it

to be and we don't need the silence at

the beginning so

click the audio to select it and then

drag this bar

to get rid of the beginning silent part

and then click and drag and move your

audio back to the beginning

and you can also trim the silence at the

end here when you're done editing your

audio

press the down arrow on the top left of

your screen and you'll see the waveform

down at the bottom of your animation

timeline

and if you click and drag your timeline

you'll hear your audio do what's called

scrubbing so this is how you can see

what sounds you need to animate to for

example in

y you might start with an o shape like y

and go into a and then i

so let's do that but first off we need

to make this frame hold for as long as

we want so we need to copy this frame by

pressing and holding

clicking copy and then paste to the

right and keep doing that until you

covered your entire

animation this is how you create a hold

frame

if you wanted your character moving you

would want to animate your moving

character before doing any lip sync

lip sync is really something you should

do at the very end of your animation

so now that we have our hold frame all

created

let's create a new layer so click our

layers button press the plus to create a

new layer and we'll call this layer

mouth and for the first frame we'll do a

closed mouth shape with just a smile

and then we'll scrub through our audio

to see what frame number two sounds like

so we're going to make an o shape and we

can zoom

in to better draw our mouth so we can

see better what we're doing

and to give an example for which mouth

shapes would be best to draw

here is an example of a phenome chart if

you don't know what kind of mouth shape

to draw try doing the sound in a mirror

and see what shape your mouth makes

and then for frame number three

it's like an open a shape so i'll draw a

mouth where you can see the teeth and

the tongue

and then i'll use my paint bucket tool

to fill in the color of his mouth

and then for frame four

it's sort of an e shape why and if you

ever want to reuse any of these mouth

shapes don't forget to use the copy

button up at the top here and then paste

it where you want to reuse it

so we'll go through and we'll complete

this entire lip sync animation

a few moments later

so now we have our lip sync all finished

and if we play it why hello there why

hello there

we now have a talking character and

that's how you animate and flip a clip

i hope this was helpful to you if it was

please leave a like and subscribe to my

youtube channel for

future animation tutorials don't forget

to share this video with friends or

family who would also like to learn how

to animate on their phone

leave a comment down below to tell me

what you're working on or if you have

any questions at all

thanks for checking out this tutorial on

how to animate on your phone and hope

you have a good day

take care guys i'll see you next time

you