Firstly, get your image, i am using this globe



Open Image Ready:



Open the file in Imageready, by either dragging and dropping it into the app, or by opening it. The file should open with multiple animation frames and layers(this doesn't happen in PS, it just opens the first frame).



Next, select all the frames using shift + clicking the last frame while the first one is currently selected.



After that, go file>export>animation frames as files.

Export them to a set folder, then open all of them into Photoshop.

Now, using the filename, in order, copy paste each one into the userbar psd, don't touch them till you have copied them all, in this case 18 images. so you should have 18, perfectly aligned layers.

next, select all the Earth layers (group them if you want for ease) and free transform the layers. What you can do is select all the layers, but keep only one visible, all will transform, but you will have a clear view of just one so you can transform easily



Next, make your userbar how you like it. What i did was add some stars in the bg, using the noise filter trick. And then i added the moon and sun and a nebula in the background. (Obviously it's no to scale, the sun is much bigger, but it's a userbar, work around it)

now all that's left is taking it over to Imageready, and using the same or a different timing that was used in the original gif. And that's it. I used a different timing since it was too saft, i slowed it down by .02 of a second to make it a bit mroe realistic.



Remember, the size of a ub, depends on not only the number of frames, but what's being animated. If you have a large picture, say the whole bg moving, it's a huge pic. If you have a small picture moving with a constant bg, it will be saved with a lower size since less colors are needed to be remembered.

Also, remember not to use a lot of transitional images, like gradient that take too long to change, that spoils the look since the gif can only remember 256 pics and it's hard with so many shades

Wow good tutorial, Blayde!

Very nice tutorial blayde, thanks for sharing!

Thx for the comments, did it this morning since i remembered Tawniteamo had a bit of difficulty with the spinning psp bar

Before we begin, get your image. I am using this one:



1. Open Photoshop and make a new userbar (or open a template if you have one) and add scanlines, border and whatever you want to add in it, except the gif file (animated image that you want to add in the UB).

2. Afterwards, click on Edit in ImageReady
image

3. Now you're in ImageReady. Open animation file and you should see this
image

4. You see that the animation consists of 50 layers and 50 frames. Select all 50 layers using SHIFT + clicking the last layer while the first one is currently selected
image

5. Now drag all layers to the userbar opened template
image

6. You can resize your animation (if needed), but it is important that all 50 layers are selected
image

7. Go to Window > Animation to bring up the animation window and click on the small icon with black arrow in the right upper corner and select Make Frames From Layers
image

8. Unfortunately, it creates frames to all existing layers, so remove the redundant frames
image

9. Now you have all frames in the correct order (set the frame time delay like the one that was used in the original gif) and press play to see the animation
image

10. If you want to modify it after creating animation frames (add scanlines, border etc.), you should select both all layers and all frames
image

Here's the result:



Enjoy!

Very nice tutorial blayde, thanks for sharing!

Codename if you stare at the original GIF of that PSP for long enough it looks like it's slightly changing shape

so what do u think

For my taste its just missing the 1px border around and the
glowing elipse effect! everything else looks cool!

keep up the good work!

would like to see the improved version.

..::gromit::..

Improved ver

very nice tut

thnks

Nice, i'll try later. This post got 1.9 MB (including forumstuff)

I'm using Photoshop CS3, where can i get ImageReady?

LeDutchMan, From what I have researched, imageready is not included in the CS3 package, It has been integrated into photoshop. If you go to 'Window - Animation' you get a basic version there that covers most of the features in Imageready. the latest version of Imageready comes in the CS2 package I believe.

--Moosh

Vitality i cant select all layers >.<

In order to select all layers, click on the first one and while holding SHIFT, click on the last layer. Now all layers should be selected.

I know how that works But it doesn't work !
(PS 7.0)

I cant dint ImageReady