Avatars by JAK

I know it's kind of early, but this year has been absolutely poop!

So the sooner Christmas, the sooner the New Year and the sooner I see the back of this one.

Best wishes to you all.

Jack

Oh my god jack, that�s beautiful. Again what programs are you using to get these results? I�m blown away�.

Originally posted by kinglizard
Oh my god jack, that�s beautiful.

Again what programs are you using to get these results? I�m blown away�.

Ditto!...I especially like that subtle reflection....

Awesome job!

I can only chime in with previous posters. Simply beautiful, Jack!

Thanks all.

Originally posted by kinglizard
Oh my god jack, that�s beautiful.

Again what programs are you using to get these results? I�m blown away�.

I'm using Photoshop and ImageReady. I saw a tutorial for an orb online a while back which led to the idea.

I am pretty happy with the way it came out, although if anyone has any ideas about how I can get the lower blue half of to come out smoother, without the banding, I would be very grateful indeed.

Jack

Originally posted by JAK
if anyone has any ideas about how I can get the lower blue half of to come out smoother, without the banding, I would be very grateful indeed.

I would just select the bottom of the globe then select Filter>Blur>Gaussian Blur with about a 1.0 setting in Photoshop.

If the problem arises when you convert the images to an animated gif I don�t think much can be done about that. The same happened to the center of my current avatar when I assembled the animated gif image. Gradients don�t come out that well for some reason.



[edit on 7-12-2004 by kinglizard]

The banding is coming from the animation process.

I have altered the colour Reduction to Selective, the colours to 256 and the Dither to Method: Pattern



It is a little smoother, but still grainy. As far as I know playing with the RGB levels through the Histogram Palett should help, but... I have no idea what I am doing!

Jack

[edit on 7/12/04 by JAK]

Originally posted by JAK
The banding is coming from the animation process.

I don't think it's the animation process that does this. My guess is that the gif file format reduces the image quality???

Yes, that's what I meant KL. I made the initial pic in Photoshop then took it ti ImageReady, as an animated .psd file it is perfectly smooth. As a .gif it starts to become harsher.

It's not looking too bad now though, how did you achieve such a smooth red to black blend/gradient on your Avatar?

Jack

Originally posted by kinglizard
I don't think it's the animation process that does this. My guess is that the gif file format reduces the image quality???

Yeah, generally that is what I find with gif files.

Yeah zedd the gif format must reduce the number of colors in the image because the most noticeable problem seems to be with color gradients.

Jack the jpeg image I started with didn�t show any color lines in the red part of my avatar, it was a perfect gradient smooth as anything. When I saved the animated gif it reduced the quality. Look at my avatar you can see different hues of red in the center. I did use the selective color function and slid the black and red up a bit, it helped the image I think.

I'm not going to replace my current Christmas avatar, because I love it! And thanks again to everyone for the help and compliments, I think it's my best since the Matrix/ripped page idea.

But I've been playing with ImageReady and here's another, maybe for the New Year.



Unless anyone else wants it. If you see something you like (I can always alter certain parts to suit, I keep the layered file) or have an idea, just give me a shout and I'll do what I can.

Jack

[edit on 9/12/04 by JAK]

Hey JAK stop doing that, you are making the rest of us look bad. :bash: This Vader image is just unbelievable. Also it's really nice of you to offer help to other members.

[edit on 9-12-2004 by kinglizard]

Thank you kinglizard, coming from you that is high praise indeed.

The idea came yesterday while talking to MacKiller about what was possible with Image Ready. Like I said to him, I'm sure I haven't even scratched the surface yet, (only just figured out how to combine seperate animations).

As a matter of fact the very first lightsaber/beam I created in Photoshop was thanks to inspiration from an image of yours I saw a while back on the Dr. Jim thread. Actually, since arriving here I have found both you and your work greatly inspirational, so you bear responsibility for most of this!

Jack

Hey JAK would I be able to use Darth Vader avatar after Chirstmas?

Originally posted by JediMaster
Hey JAK would I be able to use Darth Vader avatar after Chirstmas?

No problem JediMaster. I've changed the text to white to match your miniprofile, if there's anything else just ask.



Jack

For krazyIvan



The image is actually taken from a WWII poster but the details of the uniform have been altered to relate to his reenactment group.

Jack

[edit on 10/12/04 by JAK]

MacKiller showed me a tutorial for a static radar pic the other day and I couldn't help but animate it. (Thanks Mac )



What a giggle

Photopshop and ImageReady... fantastic!

Jack

[edit on 12/12/04 by JAK]

Hey all. I was thinking about the recent Radar animation and I thought it would make a good tutorial.

Whether I am able to do it justice is another matter!

Ok, firstly I must credit the original static tutorial creator.

The original can be found HERE authored by Chris G.

I didn't follow this tutorial word for word, though you might like to.


Because I was working with the thought of an Avatar image for ATS in mind I created a new image 160 x 160 with a transparent background. I set my foreground colour to the green that radar brings to mind. And the background to black. (Obviously though there are numerous times throughout this where you could alter something to suit your own tastes.)

Select the paintbucket tool, (G) Then press X (which swaps the foreground and background colours) and fill your square. Double click on the layer panel (bottom right) and rename this from Layer 1 to Background.

Create a new layer and name this one Arm. Click on the paint Bucket Tool Icon and select Gradient Tool. Press X to swap the foreground/background colours again, making our Green the foreground. Click on the Gradient Picker window (top left) and select Foreground to Background. To the right of that window there is a slection of five icons for differing styles of gradient (Linear, Radial, Angle, Reflected and Diamond) choose Linear gradient. Left click in the top left of your image (making sure you are still on the Arm layer) hold and drag diagonally toward the bottom right untill you are just over half way. Now from the very top toolbar go to

Filter -> Distort -> Polar Coordinates

and select the Rectangular to Polar option.

In the Layers panel click the Create a New Set (folder) icon and drag both your Arm and Background layers into this 'Set 1' folder. You should now have something like this:



In the Layers panel, make sure you close the 'Set 1' folder (the little triangle arrow next to the folder icon) then create a new layer. Name this layer Overlay. Open the Marquee tool flyout (top of the left hand side toolbar) and choose Eliptical Marquee. Our image is 160 x 160 so with the rulers up (Ctrl + R) and the units set to Pixels (right click on the ruler to set units) we can see when our Marquee crosshair lines up perfect center. Holding down Shift+Alt left click and drag out to make a perfectly circular selection. Drag it out so the selection is about 10px shy of the edges. Using the paintbucket tool fill the selection with the Green from earlier. Keeping that now Green circle selected (if you have accidentally de-selected then just Ctrl-click the layer) Go to

Select -> Modify -> Contract

and contract the selection by 1 pixel, then cut out the remaining selection (Ctrl+X).

Duplicate this layer (don't worry about naming the duplicate) then go to

Edit -> Transform -> Scale

Up on the top toolbar change the width and height to 80%. Duplicate this new layer, and scale it to 75%. Duplicate again and scale to 65%. In the layers panel you should now have four 'Overlay' layers. Keeping the top layer selected press Ctrl+E to merge layers down untill you are left with only one 'Overlay' layer. You should now have a basic Radar layout something like this:



To this you can add whatever further decoration you desire, crosshairs, coordinate text etc. Just remember to keep the Overlay background transparent.




Now we get to the fun part - Animation.

Save your .psd image and open it up in ImageReady. In the layers panel go into Set 1 and select the Arm layer. Next, in the same window as the Layers panel, click on the Actions tab bringing it to the foreground then scroll to find and select Spin. With Spin highlighted, click the 'Play Selection' button as the bottom of the panel. Now you should see something like this:



If it is not up get the Animation slideshow window up by Window -> Animation. In this window, set the looping options (bottom left in the Animation window) to Forever. Now click play in your Animation slideshow window you should now have a nice rotating radar.



Now to give it some signals!

Create a new image in ImageReady same size - 160 x 160. In the Animation window duplicate the current (empty) frame. Select the first frame. Select the paintbrush tool and place a dot wherever you want to recieve a radar signal from (here I chose six O'clock). Now in the Animation window select the second frame, then go to the Layers panel and toggle the visability (of our one and only layer) to off. In the Animation window select Tween... Use these settings:

Tween With: Previous Frame
Frames to Add: 4

Layers : All Layers

Parameters: Position, Opacity and Effects. (All selected)

Now, if you click Play in your Animation window, you should see your six frame dot animation blinking:

Now, we have both images (blinking dot and Rotating Radar). With our new blinking animation selected, left clicking on the arrow in the grey bar in the top right of your Animation window should bring up another fly-out menu:



From this menu go 'Select all Frames'. Then open it again and 'Copy Frames'

Now select the Rotating Radar animation. Click on the frame you wish your signal to appear in first, for this example I have used six O'clock, so in my Animation window I would click on frame 7. Now if you then Shift-Click the last frame you want your (faded/fading) signal to appear in you will select up to that frame inclusive. For example I Shift-Click 12, so have selected all frames 7 to 12:



Now open up the same fly-out we used to copy the frames and select 'Paste Frames...' In the pop-up box that appears, select 'Paste Over Selection'.

Now in your Animation window (again with the Select looping options set to 'Forever') you can preview your Animated Radar with it's signal:



And there you go, add as many signals and radar screen decorationas you wish.

I hope this has helped someone get to grips with ImageReady a bit better. (It is my first ever tutorial)

Jack

Another for Shorty:



Jack