This tutorial exists because both you and
I have both seen these kinds of backgrounds
gone horribly wrong.
A cheap way to make a looping background is
just to throw in a featureless flat surface
and tween some symbols to fly across the stage
at varying speeds based on how far away they
are.
Farther away equals slower.
Copy and paste the tweens over time and you're
done.
If you're making a forward facing loop it's
the same thing.
Dump those symbols in there and tween them
to move and shrink.
Here's a trick: copy and paste all of those
tweened layers into a new symbol.
Convert some of the animations to frame by
frame.
Pull them out and move the frames hanging
off the end over to the front of the symbol.
This ensures a constant flow of junk onto
the screen.
All you have to do now is put that symbol
on the stage and extend it.
Right.
So that stuff's for cheaters, let's talk about
real looping backgrounds starting with the
bare minimum: the place where the characters
go.
Regardless of the program you're using to
make backgrounds, the art needs to be longer
than your video dimensions.
This amount extra works but you don't have
much room to make mistakes.
While you're drawing, make sure that the left
and right edges are about the same height,
and avoid drawing anything that hangs too
far over the edges.
When the background is done, cut and paste
your layers into a symbol.
Now select all of those layers, copy the art
and paste it into a new layer inside that
symbol.
Move that new layer to one side, leaving a
small overlap between it and the original
background.
Look at that sloppy seam.
Look at it!
Clean that up with an eraser or new art layers.
There.
Once that's done, it's ready.
Put the symbol into a scene.
Make sure the rough edge is off the screen
with just enough space so people won't see
the transition.
If you drew a long background, you have some
extra room for error here.
Put a tween on your background layer and move
it with the properties window so the second
part of the background comes up in about the
same spot as where it began.
So this bush should be about here.
And we're just guessing at this point, so
woo-hoo.
And now, if that rough edge of your art is
coming into the screen, you've got a problem.
Either you didn't make your design long enough,
or you just need to move the starting point
of your background back.
This way some.
There.
There you go.
Copy and paste your background, tween and
all, into a new layer.
Remove the tween from the top layer and switch
to the line view, and lock it so you don't
move it on accident.
So now you can see that last frame is off.
Go ahead and use the properties window to
adjust the last frame in the tween so it's
perfect.
You have to get it perfect.
The loop will jump if even a single pixel
is off.
So do it right!
Do it right.
Done.
Delete the reference line layer.
It's time to adjust the background's speed.
Bring in your animated character on a new
layer and put it where you want it to go.
Add or remove frames from the background to
make it match with the speed of the character.
There, the speed looks good.
Now for the magic.
Copy and paste the background layer with the
tween into a new symbol.
And now this is what you do: remove the last
frame of that tween.
Just the last one.
Go back to your scene and bring the symbol
you just made into a new layer.
You can switch it to line view to make sure
it's positioned exactly how you want it.
And now delete the original layer and extend
your symbol out for as long as you need the
loop.
Forever.
For infinity and beyond.
Repeat the process for every layer of depth
you want to add.
But here's a tip.
Usually that back layer moves so slow you
don't need to make it loopable.
Just tween it.
