TinyPortal

Development => Support => Topic started by: mythbuster on February 23, 2007, 11:00:10 AM

Title: how to make rotating image
Post by: mythbuster on February 23, 2007, 11:00:10 AM
i am trying to make a image "rotate" around 360 degres but i cant figure out how.

i have photoshop cs2 and also imageready and macromedia flash 8. i can make a normal animated gif but i cant figure out how to make a rotating image .i have tried using alll the above programs but can not get a 2d image to rotate ( something like this - (https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fi63.photobucket.com%2Falbums%2Fh139%2Frogernesbit%2Fbf2020com100.gif&hash=20dc8603becec6e5650dfae8a764ce8f6232e5c2) )

can someone please explain to me how to do this please?
Title: Re: how to make rotating image
Post by: akulion on February 23, 2007, 11:06:17 AM
that should be simple enough....

it will be made the same way as you make the animated gif

only difference is this: you will play with the scale value of the graphic

so it begins like this
1) original graphic
P------L

2) intermediate graphic
  P--L

3) final graphic

L------P

so thats the basic concept if u get it
In the example above ive used ---- to represent character width basically, so dont get confused with that
ofcourse u may require more frames that above

hope that helps
Title: Re: how to make rotating image
Post by: mythbuster on February 23, 2007, 11:20:24 AM
thx for the reply ,but i'm not understanding what you mean .. sry, can u explain in more detail plz?
Title: Re: how to make rotating image
Post by: akulion on February 23, 2007, 11:35:28 AM
lol did u replace the image?

cos before u had a LP image up there :P

anyways the one u posted up now is more complicated (the battle feild one)

its using individual images to make the transition best to my knowledge, so each of the instances of those images would have to be made individually before being animated
Title: Re: how to make rotating image
Post by: mythbuster on February 23, 2007, 11:59:17 AM
i replaced the old LP image with the bf2 one because that one best shows what i want to learn to do. but ive tried every tool in p.s. cs2 and imageready but i cant figure out how to get an image to rotate like that bf2 gif.
Title: Re: how to make rotating image
Post by: alan s on February 23, 2007, 01:17:32 PM
Here , this might help you http://www.auctionessentials4u.com/ae/How%20To%20Make%20A%20rotating%20Image%20Ad.htm
Title: Re: how to make rotating image
Post by: mythbuster on February 23, 2007, 01:28:43 PM
i seen that page b4 but im not using digital photos or a 3d object. im using 2d images. ( logos - banner etc )
Title: Re: how to make rotating image
Post by: akulion on February 23, 2007, 02:10:28 PM
oh man u mean u need a tutorial on image ready?

i could explain it to u but it would mean ill have to write a whole tutorial

ill get u started on the basic concept - once u are comfortable with that u can try more advanced settings

open up image ready
next create a new image whatever dimension u want

Next u want to make sure that 2 panels are visible under the 'Window' menu:
- layers
- animation

the basic concept is very simple really.

For each new frame you add in the animation window - u must add a new frame in the layers window as well.

so lets say u have 3 frames in animation window (names just for example)
A1
A2
A3
(https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fimg224.imageshack.us%2Fimg224%2F285%2Fscreenshot1xa9.jpg&hash=3dce7fc886330b09e8a5064cfe647948bc8c4e2e)
u wull create 3 layers in layers window too (names just for example)
L1
L2
L3
(https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fimg224.imageshack.us%2Fimg224%2F6717%2Fscreenshot2to6.jpg&hash=0fa03c082967f6591c4b25189ab1bdaac1e8cbbf)
The relationship between the animation frames and layer frames is as follows:

A1 ----> L1 Visible rest invisible
A2 ----> L2 visible rest invisible
A3 ----> L3 visible rest invisible

So what basically happens is that as the animation plays, the layers display in sequence, thus making the graphic animated

A1 --> A2 ---> A3 (animation frames playing)
L1 --> L2 ---> L3 (layers switching between visible and invisible modes)

(https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fimg224.imageshack.us%2Fimg224%2F5236%2Fdotjo8.gif&hash=183a6fb01e0acb8fe212f51df23b2e5304566b33)

if u didnt understand any of the above - u may wana spend some time searching for animation tutorials in Adobe Image ready on the net and get used to basic functions and stuff first

Title: Re: how to make rotating image
Post by: mythbuster on February 23, 2007, 02:38:52 PM
omg..
again....i DO know how to animate .... i just need to know how to get an image to apear to "rotate"... i mean how do i edit the image to make the animation frames look like a rotation . how do i get the image to turn like that? i know how to animate sep. images. i DONT know how to make the image rotate. i tried messing w/ the size and scale but it just looks like it get smaller and then bigger. like its "pulsing"... but HOW do i make the image apear to "rotate" ?
Title: Re: how to make rotating image
Post by: Dazed on February 23, 2007, 02:45:21 PM
I haven't gone through the tutorials yet but you may try here... http://www.pixel2life.com/tutorials/adobe_image_ready/
They have some very good tutorials. Maybe you can find something there. ;)
Title: Re: how to make rotating image
Post by: akulion on February 23, 2007, 02:55:28 PM
the best way to animate would be to actually make each instance of the image you wish to rotate

So u have a plain image
Next u must make an instance of the same image a bit rotated
and so on and so forth until u have the complete animation sequence

an easy way to go about this is to play with the 'prespective settings' of the image in Photoshop..to produce 'tilted' images

Then u just put together the images in a gif

thats really the only way an involves pretty hard work

Apart from that there are other ways but those involve complex programs like 3D designing and mathematical algorithms which I dont really know anything baout
Title: Re: how to make rotating image
Post by: softtouch_ph on February 23, 2007, 03:19:58 PM
It might have been created with 3d studio.
Title: Re: how to make rotating image
Post by: marzi on February 23, 2007, 04:36:01 PM
About 10 years ago I made the rotating image (spinning planet) at http://www.geocities.com/thetropics/3348/  just the way Aku described the process. I put all the gifs together with a freeware program named gif animator (don't think they are still around). The process was not difficult by was time consumming.
Title: Re: how to make rotating image
Post by: Ianedres on February 23, 2007, 05:53:51 PM
Quote from: mythbuster on February 23, 2007, 02:38:52 PM
omg..
again....i DO know how to animate .... i just need to know how to get an image to apear to "rotate"... i mean how do i edit the image to make the animation frames look like a rotation . how do i get the image to turn like that? i know how to animate sep. images. i DONT know how to make the image rotate. i tried messing w/ the size and scale but it just looks like it get smaller and then bigger. like its "pulsing"... but HOW do i make the image apear to "rotate" ?
For the realistic rotation, you need a 3d modeler to output the rotation in separate .gif slices, then piece them together for the animated .gif file. (Some modelers do this for you automatically.)

Otherwise, you'll have to create (and recreate) each slice individually, making a 2d image appear 3d each time... not worth the time or effort IMHO.

I don't know of any way in Photoshop or ImageReady to do what you're asking.
Title: Re: how to make rotating image
Post by: mythbuster on February 23, 2007, 09:34:53 PM
thx for the replies
Title: Re: how to make rotating image
Post by: knat on February 24, 2007, 10:30:07 AM
I could do this using Xara Xtrem Pro and Xara3D.. Maybe post the picture you need and i give it a try ;)
Title: Re: how to make rotating image
Post by: mythbuster on February 24, 2007, 01:37:52 PM
i dont have a particular image to be rotated.. i was just wondering because i use a ton of animation on my sites
Title: Re: how to make rotating image
Post by: knat on February 24, 2007, 02:02:25 PM
ok.. then maybe check out Xara Xtreme Pro .. Great tool for making gif and flash the easy way ;)
Title: Re: how to make rotating image
Post by: mythbuster on February 24, 2007, 02:46:50 PM
i think i tried them b4.. dont u have to buy them to get the full features?
Title: Re: how to make rotating image
Post by: knat on February 24, 2007, 03:42:43 PM
I guess that depends.. i got mine from Rapidshare  ;D
Title: Re: how to make rotating image
Post by: hygron on March 01, 2007, 01:53:54 PM
This is awesome. Great info, thanks.  Now I might have the confidence to try out some flash...I have some images of plants I want to make a movie out of.
Title: Re: how to make rotating image
Post by: binkles on April 25, 2007, 07:24:34 AM
I have just had the good fortune to use Xara3D, i created this in less than 5mins.

(https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fwww.aishaweb.co.uk%2Fforum%2Ftp-images%2FImage%2Faishaweb_ripple.gif&hash=142a3d2da2cfb096dd5787224e95fafddac017b6)




Heres another done in around 1 minute,

(https://www.tinyportal.net/proxy.php?request=http%3A%2F%2Fi5.photobucket.com%2Falbums%2Fy185%2Fbinkles%2FBloc.gif&hash=5207ee88499c223e85d4c9146c56c8ad5ce9c90b)