[TuT] How to make a simple animated sig or userbar!

Everything related to graphics and image-related topics.
Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

[TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Tue Apr 07, 2009 9:25 am

K, so many people have been asking how to make a 'moving' or otherwise termed, animated sig. Here's the basics how.
First, select your userbars, or sig, that you want animated. I'll be using one of mine, with one of Veen's. (Hope you don't mind [V]... I didn't have any other ones on me at the time.

Image
Mine ^

Image
[v]'s ^

Now, to make it animated.... Like this.

Image

First open up photoshop, or imageready. I'll be using photoshop CS2.
And on the Finder bar, click Window, and select Animation.
There should now be an animation window on your screen.

Image

Now, Open up both the userbars or sigs, and copy the layer of one into the other. (Drag and drop)
So that both signatures are in one file.

Now, Go down to the animation window, and click, Duplicate Frame.... which looks like the normal 'New Layer' button.
So you now have 2 frames. Now, click the first frame, and make the top layer hidden. Then click the second frame, and make it visible.

Image

Then, at the bottom of each frame, is the delay time between frames. It should be at 0.2, click it, and change it to 2.0 (seconds)

Repeat with both frames.

Then, click file, save for web, and save it. (Make sure it's a .gif)

Open with your web browser, or upload and view on it the web, to see your simple animated sig or userbar.

Image

Look up and experiment with tweening to achieve other desired effects.

Image

or look at [v]'s sig for another example.

Good luck!
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

TaxiService
Night Stalker
Posts: 6887
Joined: Thu May 24, 2007 5:52 am
Location: 41.896198, 12.4165945
Contact:

Re: [TuT] How to make a simple animated sig or userbar!

Post by TaxiService » Tue Apr 07, 2009 11:18 am

O_O
oh the jesus. I DIDN'T KNOW THAT!!! O_O GOD FUCKING CHRIST!! I THOUGHT YOU NEEDED IMAGEREADY!!!


thanks!!! ;_; omg, thanks so much :''')
  • TaxiService! Shitposting since 2007!
MGM Sig

Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

Re: [TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Tue Apr 07, 2009 11:58 am

No problem taxi, I'll be making more tutorials on design and such to come as well.

Nao I can haz cookie?
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

TaxiService
Night Stalker
Posts: 6887
Joined: Thu May 24, 2007 5:52 am
Location: 41.896198, 12.4165945
Contact:

Re: [TuT] How to make a simple animated sig or userbar!

Post by TaxiService » Tue Apr 07, 2009 12:19 pm

Image
  • TaxiService! Shitposting since 2007!
MGM Sig

Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

Re: [TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Tue Apr 07, 2009 12:21 pm

LOL!

Nice XD
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

Løki
Ranger
Posts: 1229
Joined: Thu Dec 20, 2007 2:53 pm
Location: 0x4D610000
Contact:

Re: [TuT] How to make a simple animated sig or userbar!

Post by Løki » Tue Apr 07, 2009 8:09 pm

There's also $900 worth of Flash
I<3Flash
Image

Smythe
Commando
Posts: 2429
Joined: Tue Dec 25, 2007 12:52 am
Location: 'Straya Mate

Re: [TuT] How to make a simple animated sig or userbar!

Post by Smythe » Tue Apr 07, 2009 9:32 pm

Awesome i will make one now
Image

Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

Re: [TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Tue Apr 07, 2009 9:56 pm

Yes... but flash is also $900... And nowadays economy, in most countries... being not all that great, most people can't afford to run out and go buy it...

Heck, Why do you think I'm still using CS2? $$....
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

Sharker
SEAL
Posts: 480
Joined: Tue Nov 06, 2007 1:55 pm

Re: [TuT] How to make a simple animated sig or userbar!

Post by Sharker » Wed Apr 08, 2009 3:30 am

OR you could just use apng edit without the whole fuss. That is IF you have FireFox

Image

Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

Re: [TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Wed Apr 08, 2009 10:24 am

Sharker wrote:OR you could just use apng edit without the whole fuss. That is IF you have FireFox

Image
That doesnt seem to be animating.... And don't hijack my topic!
I made this as a tut for photoshop or imageready, idfc what other programs you use to do it.
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

Zanghfei
Ranger
Posts: 1590
Joined: Tue Jul 01, 2008 1:52 pm

Re: [TuT] How to make a simple animated sig or userbar!

Post by Zanghfei » Fri Apr 24, 2009 7:54 pm

0_o SEXY I dON't even know you smart. ( not sure but )
Did you go on website?

yup i stuck here

Now, Open up both the userbars or sigs, and copy the layer of one into the other. (Drag and drop)
So that both signatures are in one file.

Now, Go down to the animation window, and click, Duplicate Frame.... which looks like the normal 'New Layer' button.
So you now have 2 frames. Now, click the first frame, and make the top layer hidden. Then click the second frame, and make it visible.

Wtf ? Translator suck.

Slapzy
Ranger
Posts: 1806
Joined: Mon May 05, 2008 3:21 pm
Location: ~root@208.113.172.130# sudo rm -f /

Re: [TuT] How to make a simple animated sig or userbar!

Post by Slapzy » Fri Apr 24, 2009 11:26 pm

Look at the pictures....
~ Teh Slapz
Image
TaxiService wrote:OMG BARREL ROLL ON ACIDS
._. \·. |: /.· .-. ·.\ :| .·/ ._. \·. |: /.· .-. ·.\ :| .·/ ._.
WHOOHHAGHGHHGEHGR

Sharker
SEAL
Posts: 480
Joined: Tue Nov 06, 2007 1:55 pm

Re: [TuT] How to make a simple animated sig or userbar!

Post by Sharker » Sat May 09, 2009 7:54 pm

~ !dentity wrote:
Sharker wrote:OR you could just use apng edit without the whole fuss. That is IF you have FireFox

Image
That doesnt seem to be animating.... And don't hijack my topic!
I made this as a tut for photoshop or imageready, idfc what other programs you use to do it.

That's probably because you're using some shitty browser like safari or something
and for the people who don't have ps and make it take longer to make it then it needs to. Plus it's png if you didn't notice

draconic74
Green Beret
Posts: 3470
Joined: Sat Jun 03, 2006 11:08 am
Contact:

Re: [TuT] How to make a simple animated sig or userbar!

Post by draconic74 » Sun May 10, 2009 12:27 am

zanghfei wrote:Wtf ? Translator suck.

Couldnt have put it better myself...

I remember trying out the CS2 Demo. I was actually using a copy of PS7 off a flash drive back then. It was crazy with its animation and 3D warping abilities. In fact, I made this with it:

Image

My first sig ever! Then I made this for fun:

Image
(it loops once then stops on the end - you need to reload the page to see from the beginning)
Image

Kiyoshi
Commando
Posts: 2537
Joined: Sat May 31, 2008 7:12 am
Contact:

Re: [TuT] How to make a simple animated sig or userbar!

Post by Kiyoshi » Sun May 10, 2009 12:14 pm

draconic74 wrote: Then I made this for fun:

Image
(it loops once then stops on the end - you need to reload the page to see from the beginning)
Fcking Win.
Image

Post Reply

Who is online

Users browsing this forum: No registered users and 19 guests