IPB

Welcome Guest ( Log In | Register )

> Welcome to the Graphic Tutorials Section !

How does the Tutorial section works?
Want to learn how to use applications such as Photoshop, TheGimp or Blender? You'll find in this section tutorials written by our members.

You've written your own tutorial? Use an explicit title and create a new topic.
Please note that a Tutorial has to be well written, easy to read, well-presented and illustrated with as much pictures as needed (or the Team will delete it).
You can't post a tutorial if you aren't the author or without the author's authorization.

Warning :
Want to request a graphic? - Need some advices about your current drawing ? - A Problem using a BricoPack? - You've just arrived to our forums? -

In our Gallery : Icons & PNGs - Wallpapers - Visual Styles - Software - Skins - 3D Animations - Miscellaneous

7 Pages V   1 2 3 > »   
Reply to this topicStart new topic
> [ImageReady tutorial] Create Animation, Photoshop ImageReady Combination
Neil
post Aug 5 2006, 07:52:06 AM
Post #1


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



Well since I modified my avatar and signature last time, I saw that many people wanted to know how I did that wink.gif
How I gave such lifeness? So here is the answer in a tutorial cool2.gif

Okey lets start the resurrection of our Avatars and Signatures ar.gif
First lets add some blinking stars in to our avatar.

Note ar.gif To get the successful results, I recommend to use Adobe Imageready CS2

info.gif Basically you can follow all this with only Image ready application but since I'm a much addict towards Photoshop I'll use both mdr.gif

Hey I forgot to say, a nice music please lol.gif

Ok first of all, find a better avatar to add blinking stars or just design one wink.gif





Then go to the layer at the top.
Press Ctrl+Shift+N to create a new layer at the top & name it 'Star 1'

Select a white to transparent gradient and from the gradient type, choose 'Diamond'



Put a little star in the 'Star 1' layer like this,



Then Press Ctrl+Shift+N to build up anothe layer and name it 'Star 2'
Put another white star in that layer like this (not in the same place as 'Star 1' )



So then, as for your desire, add many stars as you like, but remember, each star must have it's own layer (a layer must contain only one star)

As for mine, I created nine stars in nine layers



but in the canvas, they look like this,



Ok now it's the time to press the magic button wink.gif

Switch to Image Ready now

or just press Ctrl+Shift+M

When you oen the document in Image ready, make sure to open the 'Animation' window



Let's start working 666.gif

ar.gif First of all select the opasity of the all star layers (Star 1-Star 8) to 0% but Keep the last star layer (Star 9) opasity to 100%



Go to the animation Window,

Hit Duplicate Current Frame and you'll have another frame



Go to the Frame No 2 from the Animation Window and there, set the 'Star 9' Opasity to 0% and 'Star 1' Opaity to 100%

In the Canvas It'll look like this



Now press the Tween Button in the Animation Window oui.gif (With Frame 2 Selected)



In the Tween Parameters, Set the number of Frames to add to 5 (the other parameters are not important to be discussed here)



Hit 'OK' and you'll see new Five frames between the ones you've edited smile.gif



If you play the animation now,



It'll look like this



Ok now, enough with viewing a part bad.gif let's finish this mdr.gif

Go to the last frame from the 'Animation Window' (Frame 7) and there, hit to Duplicate the Frame.

In the new frame, set 'Star 1' Opasity to 0% and 'Star 2' Opasity to 100%

Tween them now ( info.gif you'r previous parameters will be saved automatically. So you don't want to change the number of 'Frames to Add' )

Then Go back to the last Frame,

Set 'Star 2' Opasity = 0%
'Star 3' Opacity = 100%

Repeat this untill you change,

'Star 8' Opacity = 0%
'Star 9' Opacity = 100%

Now there should be 55 Frames in the Animation Window oui.gif

If you play the animation now, you must obtain this



And now Go to File>Save Optimised and give a god damn name to the gif lol.gif

Ok It's over now. smile.gif

Have some nice coffee till I continue this thread in telling how to get this



This post has been edited by Neil: Aug 5 2006, 06:47:51 PM
Go to the top of the page
 
+Quote Post
Disko
post Aug 5 2006, 08:41:58 AM
Post #2


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



Thanks for this Neil, I appreciate this loveit.gif

EDIT: I have done the tutorial and it looks mighty fine but it's too large to upload onto CrystalXP.

Attached File  Foggy.gif ( 59.37K ) Number of downloads: 197


loveit.gif
Go to the top of the page
 
+Quote Post
Neil
post Aug 5 2006, 08:56:20 AM
Post #3


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



QUOTE(Draginol @ Aug 5 2006, 01:42:58 PM) *
Thanks for this Neil, I appreciate this loveit.gif


You're Welcome Draginol mdr.gif
and I hope most of others will also like this oups.gif

I'm working with the sig animation oui.gif I'll post it soon here wink.gif
Go to the top of the page
 
+Quote Post
Disko
post Aug 5 2006, 10:00:15 AM
Post #4


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



loveit.gif
Attached File(s)
Attached File  D___Super.gif ( 52.81K ) Number of downloads: 162
 
Go to the top of the page
 
+Quote Post
Neil
post Aug 5 2006, 05:35:38 PM
Post #5


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



Good work Great.gif
Go to the top of the page
 
+Quote Post
Nan0me
post Aug 5 2006, 06:50:50 PM
Post #6


Penguin
**

Group: Members
Posts: 55
Joined: 6-July 06
From: Skiptvet, Norway.
Member No.: 49,047



That is a really nice tutorial.

I liked it.

Actually, I loved it. smile.gif

I will post an outcome soon.
Go to the top of the page
 
+Quote Post
Neil
post Aug 5 2006, 07:07:37 PM
Post #7


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



QUOTE(Nan0me @ Aug 5 2006, 11:51:50 PM) *
That is a really nice tutorial.

I liked it.

Actually, I loved it. smile.gif

I will post an outcome soon.


Thanks NanOme, of course I have also used your techniques here wink.gif

I'll be looking forward to your result

Off topic ar.gif Thread re-named
Go to the top of the page
 
+Quote Post
Disko
post Aug 6 2006, 01:19:22 AM
Post #8


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



Got any suggestions on how to reduce the size of the .gif?
Go to the top of the page
 
+Quote Post
Neil
post Aug 6 2006, 08:48:02 AM
Post #9


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



QUOTE
Got any suggestions on how to reduce the size of the .gif?


Why? what's the problem? xeyes.gif
Go to the top of the page
 
+Quote Post
Disko
post Aug 6 2006, 09:17:32 AM
Post #10


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



Well you see I couldn't upload it as my avatar because it was too large, but I fixed it now.

wink.gif
Go to the top of the page
 
+Quote Post
Neil
post Aug 6 2006, 07:19:07 PM
Post #11


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



Nice Avater reflections Draginol and please excuse my delay oups.gif I'll post the way how to reflect your signature soon oui.gif
Go to the top of the page
 
+Quote Post
Disko
post Aug 7 2006, 08:02:49 AM
Post #12


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



Great, looking forward to it.
Go to the top of the page
 
+Quote Post
acdcrocks
post Aug 7 2006, 12:20:49 PM
Post #13


Big Penguin
***

Group: Members
Posts: 232
Joined: 24-May 06
From: Sortland, Norway
Member No.: 38,336



this is a great tutorial Neil... Great.gif
I'll post my result soon.... oui.gif

BTW...I think it will be better if someone edit the topic title to :" Make animated refl......"

Edit*: My result is my avatar oui.gif... The image size got a little too big cry.gif , so i had decrease the quality of the image...
Go to the top of the page
 
+Quote Post
Neil
post Aug 7 2006, 07:26:16 PM
Post #14


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



Nice outcome [acdcrocks[/b] Great.gif

QUOTE
BTW...I think it will be better if someone edit the topic title to :" Make animated refl......"


'Give Animated Reflections' is a similer topic lol.gif

Well, the size limitation 30KB is for files you're using for avaters from your machine oui.gif


QUOTE
Edit*: My result is my avatar .. The image size got a little too big , so i had decrease the quality of the image...

If you have an avater a little more than the mentioned (should be 128x128) you can upload the avater in to the web and then give the link
Go to the top of the page
 
+Quote Post
Disko
post Aug 8 2006, 10:15:49 AM
Post #15


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



TIP: If you want an excellent quality .GIF it is going to be big oui.gif So what I did was used a service like ImageShack hosting to upload an image and then use the 'URL' option in the avatar settings to use it from there wink.gif

Enjoy Happy2.gif
Go to the top of the page
 
+Quote Post
de lioncourt
post Aug 8 2006, 12:25:14 PM
Post #16


New Penguin
*

Group: Members
Posts: 30
Joined: 5-August 06
Member No.: 55,511



ok... i couldnt resist myself to try this.. lol... lol.gif

please not that its still done with image ready 7 .. (Crap).. he.gif


and please continue with the tutorial about the bar effect, im done with my coffee lol.gif
Attached File(s)
Attached File  Untitled_1.gif ( 49.01K ) Number of downloads: 79
 
Go to the top of the page
 
+Quote Post
acdcrocks
post Aug 8 2006, 01:51:02 PM
Post #17


Big Penguin
***

Group: Members
Posts: 232
Joined: 24-May 06
From: Sortland, Norway
Member No.: 38,336



Great outcome de lioncourt Great.gif oui.gif
I'm shure Neil is sweating over his keyboard to finish the next part of the tutorial... lol.gif
Go to the top of the page
 
+Quote Post
Neil
post Aug 8 2006, 07:03:41 PM
Post #18


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



Nice animation de lioncourt

QUOTE
I'm shure Neil is sweating over his keyboard to finish the next part of the tutorial...


Quite right acdcrocks but it keeps enlarging lol.gif
you see I had this nice idea of getting another nice animation specially got signatures which I saw from a local TV program
So I'm trying to make a tutorial to show how to do both of them oui.gif
Go to the top of the page
 
+Quote Post
Disko
post Aug 9 2006, 09:25:50 AM
Post #19


Penguin Groupie
Group Icon

Group: English Moderator
Posts: 1,304
Joined: 2-February 06
From: Australia
Member No.: 14,373



Can't wait for this jap.gif
Go to the top of the page
 
+Quote Post
Neil
post Aug 9 2006, 06:53:52 PM
Post #20


Tracker...
******

Group: Members
Posts: 2,189
Joined: 5-February 06
From: Colombo-Sri Lanka
Member No.: 15,118



QUOTE(Draginol @ Aug 9 2006, 02:26:50 PM) *
Can't wait for this jap.gif


Post Edited ar.gif

Ok this is one way to add a reflecting line in to your Signature smile.gif

First, Select your signature or userbar.



Then Create a New layer over the current layer(s) and name it 'Ref line'

Now select White to Transparent gradient and select Reflected Gradient Type



Now click on an area like the green dot in the picture and drag the mouse in the direction of the red arrow. (You can customize your reflected lines as you like I'll give you samples in the end)



Then you'll have a Ref Line like this



Now Create another new layer and fill it with any color you want mdr.gif

Go to the Layers window and reduse the new layer's Color fill to o%

Now go to that layer's blending options and give the following parameters



Now you'll obtain this



info.gif You can change the Fill Type and the color according to the
main color in your Signature or User bar.
Try to give a color darker than the one in your creation


Now Switch to ImageReady

Select the 'Ref Line' and move it out of the Left Edge of the canvas
your 'Ref Line' should be placed like this



The blue rectangle is just a reseblance to show you where the layer should be & it won't be shown in your design area

Now click Duplicate Current Frame button in the Animation Window & go to frame 2

There, Move the 'Ref Line' layer out of the Right Edge of the canvas.



Now Hit Tween button

Set the Frames to add to 20 or 30



Hit Ok

Now play the animation.



So enjoy the animated reflections loveit.gif
Go to the top of the page
 
+Quote Post

7 Pages V   1 2 3 > » 
Reply to this topicStart new topic