Scrolling background

[Jbot]

Hello!
What is the best way to make a perfect scrolling background if the frame is 320X240?
Should I use an 640X240 or even 960x240 and then let 2 copies follow each along a path. I tried this already, but it is quite difficult to get the timing and positioning right. It would be great if someone could upload an .anme file with a good background scroll. I just cannot get my head around it.

Thanks in advance
John

[Bones3D]

Hello!
What is the best way to make a perfect scrolling background if the frame is 320X240?
Should I use an 640X240 or even 960x240 and then let 2 copies follow each along a path. I tried this already, but it is quite difficult to get the timing and positioning right. It would be great if someone could upload an .anme file with a good background scroll. I just cannot get my head around it.

Thanks in advance
John

This might make for a good feature request or script. It could prove extremely useful for creating retro-style cartoons, just as Hanna-Barbera intended.

[Jbot]

Yes, I love a good car chase and the motion blur might become handy, but I have not made a scrolling background since DPaint on the Amiga.

[slowtiger]

A scrolling background should be as wide as possible, and in one file since that is the easiest way to handle. (The animated camera in Moho is the feature I really like, I use it even for rendered output from Mirage because its so much easier to control ...)

If you want to use a repeating background ("endless"), the recommendation is that there are at least two or three screen widths between the repeating parts at beginning and end. My way to achieve a seemless movement is this:
- create the movement for one length of the background
- take care that every keyframe is set to "linear"
- copy the whole layer
- select all keyframes in that layer and move them in time that the first key of this layer matches the last key of the first layer
- set the visibilities of the layers as needed
- repeat as necessary.

Why so complicated? Because I want to control the match of the keys by eye. This workflow of course comes directly from After Effects where it is the best possible way to do this. In case I made a mistake with the movement, or want to adjust it, I always could go back to the first layer and delete every following one.

If you are really confident about not making any mistakes, you could do the whole thing in one single layer:
- create the movement for one length of the background
- take care that every keyframe is set to "linear"
- make the frame before the last keyframe a key, the delete the last key
- select all keys, copy them, and paste them behind the last key

If you made no mistake, your background should scroll as smoothly as possible.

[Mikdog]

To do this, I save myself all the finicky trouble of looping keyframes by creating a BG in PHOTOSHOP, copy and paste it next to the original picture, clean the joint up so it looks like a natural link, copy and paste the new image again which now tessellates properly, copy and paste it a couple more times, and I have one LOOOOONG scrolling background. Import it into AS/MOHO, set the keyframe movement to LINEAR, and watch it scroll.

SCROLL, BABY, SCROLL!

[slowtiger]

Ah, the sweet innocence of youth .... we oldtimers still remember the times when all backgrounds had to go into After FX for compositing, so they had to be PICT files, and a PICT file can only be a mere 1000 px wide - but as long as memory allows. So we had to compose the pan vertically and later turn the scene again 90°. Ah, those were the times ...

Seriously: repeating the whole background again and again in PS works only in video resolution. If you work in HD, you soon end up with files being 15.000 px wide and more. So far, I hadn't tested big files like that in AS, but a backgroud file of about 50 MB will definitely slow down rendering time etc.

[PixelDust]

Maybe translating the background across the screen and then using a cycle would work.

[Rasheed]

Maybe translating the background across the screen and then using a cycle would work.

That is exactly what I did in this animation on YouTube:


click on image to watch 30 s animation

I made a background in Artrage 2 and imported that into Moho. The image layer was copied twice and one of the copies was flipped horizontally. Next, I translated the image layers so, that they formed a wide image. Those 3 image layers were put into a group layer and translated from left to right in a loop.

The (err, mediocre) animation of the turning wheel and bouncing ball is just simple points animation and layer transformations (rotation, scaling, translation). So nothing fancy, just the show the effect of animation on a moving background.

Most (if not all) people will not notice that the background is looping, because the focus is on the animation, as it should be.

[v_aviles]

Here is another one. It is not really a "scrolling background", but could be useful. I am using it in my first animation project:

http://www.elprofe.com/Animation/MovingBkg.mov

I just made some thick lines (line width: 15),




and entered the following values on the animated Noise Settings (Vectors tab):



The layer opacity is 70.

[jahnocli]

Hey...simple idea which works really well! You might combine it with closer, more defined shapes which flash past too, to give more of a sense of speed. In this way, you don't need a long panning background at all!

[bupaje]

@v_aviles - cool and simple solution.

[bupaje]

After I posted I thought of one other way - may not be a good way, just another possibility.

How about using particles? You can shoot different particles of trees, fences, stars etc past the viewer. This example is slow but you can speed up the particle velocity and add some blur as well.

http://stormvisions.com/moho/backgroundmoves.mov
http://stormvisions.com/moho/backgroundmoves.anme