Greetings from Old Jack.

 

The reason you are reading this is because a lot of lovely folk (obviously including yourself) wanted to know how to create a “bling bling” graphic … and so did yours truly. As most of you are aware. Animations are my favourite part of graphical creation, and as soon as I was introduced to these clever little things by Jo (Snafu), I wanted to know how they were created. I could find no tutorials on the web, and after a lot of Googling, found a couple of references to them in Photoshop forums … not these particular ones we are going to attempt to create … but “bling blings” just the same. From these references, I found out that the filter required was Alien Skin’s Xenoflex2 – Constellation.

 

Common sense told me they were just line drawings created from shapes, and simple sight told me that they were created a portion at a time, and after a certain distance into the animation, were also deleted at the same time as the animation progressed … much like the cartoon character running away with a keg of gunpowder on his shoulder with the bung missing, and a lit fuse catching up from behind. So, an image or two … and a few hours messing about with settings in Constellation, and I had a rough bling bling going. And it was rough. It didn’t sparkle like the ones I had seen and downloaded, but that was only a couple more hours fooling around, until I found the random seed button in Constellation.

 

OK … I now had a passable bling bling, but the creation of the frames was, to say the least, cumbersome. I was random seeding each individual frame at the same time as adding to the front and removing from behind. And finally Fallen Anjel advised me that a tutorial had been written for these things by a lass from the Tainted Angels Group, named Nicky (a.k.a Sunnierskies and Nickym). I was kindly granted access to the group, and had a look at the tutorial. Unfortunately, it was just as confusing as my way of doing it. Nicky created her layers in PSP, and then took them to Animation Shop, both for editing and animation. Now, A.S has a pretty bare toolbox when it comes to top notch editing tools … it has an eraser. That’s it. And I’m still trying to find out how to resize it.

 

So, what I have done is to combine some of Nicky’s ways with some of mine, so that the full potential of both programmes is utilised (PSP & A.S) and that it is kept as simple as possible so that you don’t have to wear the tag “Advanced User” around your neck.

I apologise in advance for the size of this thing, but I figure screenshots are important to help you know exactly where you are. This is not a tutorial, and I do not lay claim to anything … neither © nor intellectual property. It is simply an explanation of my way of doing things. It is intended as an “in house” PSS document, and not for general release to the world wide web. The “Explanation” will be interrupted here and there as I go along by … you guessed it … explanations. So here we go.

 

All that you need apart from PSP (any version), Animation Shop and Xenoflex2, is the Image in the Rar, of which this was part. The image we will be using is 400 X 300 pixels, but any image created from a shape will do. It just needs to be white, and so that the resulting bling is not too dense, 3 pixels in line width. Unless you like a dense bling of course … then feel free to make it 4 pixels. But if you use the one supplied … you’re stuck with 3.

 

1) Open your PSP, and open the “Base Image.pspimage”  supplied in the Rar. On your keyboard press Shift + D to duplicate the image, and close the original.

 

2) Duplicate your image twice, so that you now have 3 layers. Hide the duplicated layers (i.e layers 2 & 3).

 

3) Add a new raster layer, and then arrange it to the bottom. Flood fill this layer with a colour that is easy on your eyes. I use R0;G64;B128 or #004080, but just select a colour you’re going to be comfortable with for a while.

 

4) Activate the first of your image layers by clicking on it in the Layers Palette. Your Layers Palette should now look like this …

 

 

5) Go to the Tool Bar and click on Selections/Select All; then Selections/ Float; then Selections/ Defloat; then Selections/Modify … Expand … 1 pixel.

 

6) Go to Effects/Plug-ins/Alien Skin Xenoflex2 and click on Constellation. When the plug-in opens, enter the settings as shown below, making sure the “Make Selection Transparent” radio button has a dot in it. You’ll know, when you see the effect applied, if you forget to do it.

 

 

 

Once you are sure the settings match, on the Constellation Menu Bar go to “Settings/Save” and save them to Preset. Once you have the gist of making these things, feel fre to play with the settings. By saving the initial ones, you always have a base setting to return to. Also … depending upon the image on which the finished bling is going to be placed, you may find you need a finer bling or maybe even a more dense one. This gives you a starting point. After you have saved the settings, click OK. Do NOT deselect.

 

7) Hide this layer, and click on the second layer in your Palette to activate it and make it visible. Effects/Constellation … BUT … this time before applying the effect, click on the “Random Seed” button. Then click OK. Do NOT deselect.

 

8) Hide the layer you have just applied the effect to, and click on the top layer to activate it, and make it visible. Effects/Constellation, and once again, click on the “Random Seed” button before applying.

 

9) Deselect. Unhide all hidden layers … then hide your bottom layer … the coloured one. Your Palette layer should now look like this …

 

 

Save your image now to wherever your heart so desires (as long as you remember where you save it to) and name it what you wish (as long as you don’t forget what you called it.) Once saved you can close it down, but don’t close PSP … we’re off to visit Animation Shop and we’ll be back in not such a long time. Open your Animation Shop.

 

Now … firstly an explanation within this explanation. The steps above so far parallel those of Nicky’s tut, as do most of the following Animation Shop steps, including the hint for the background, which most users, myself included were aware of. It is at this point that Nicky brings you to A.S to totally finish the animation … and it is at this point that I depart her method. The reason we are in A.S now at this stage is only to duplicate the layers. We will then export them back to PSP which is why you didn’t close it. It can of course be done in PSP … but here it is much simpler. In PSP, we would have to duplicate each layer 10 times, then collate them 1,2,3 … 1,2,3 and so on. Here, its just a few clicks and done, and they are even renamed in consecutive order … instead of “copy of” and “copy 2 of” etc.

 

 The hint that I mentioned has to do with viewing the fine white dots of the bling on the standard chequered “transparency background”. You obviously cannot see the contents of each frame. To overcome this (and remember that we will be returning for the final animation … which is when you really need to see the contents of the frames and the finished product) … you can temporarily make your “transparency chequers” opaque. In here … Black is good. You won’t be spending much time looking at it. Go to File/Preferences/General Program Preferences, and when the dialog box opens, click on the Transparency Tab. Click on the Swatch under “Colour 1” and on the colour picker, select Black. Ditto for “Colour2”. Click OK. Now go to File/Open, and open the file you just saved from PSP.

 

You should have 3 frames of your bling (we had the bottom layer hidden when we saved, so it will not show in here … remember?) showing on a black background. I’ll step the rest out for you …

 

1) Go to Edit/Select All

 

2) Right click on the blue title bar at the top of your images, and click on “Copy”.

 

3) Click in the middle of the last frame to select it and right click on the title bar again, and click on “Paste after Current Frame”. You will now have 6 frames.

 

4) Repeat the last step, and you will have 9 frames.

 

5) Continue this step until you have 30 Frames … more than we need … but it beats the living daylights out of running one short. I know there is an option for “right click/duplicate selected” but for some reason, Mrs A.S always seems to stuff up the continuity of the animation, and you end up with 2 consecutive frames the same … which causes the final animation to jump. This way is a little longer, but you are sure the sets of animations are full sets.

 

6) Once you have your 30 frames, go to “Edit/Select All” (make sure you do NOT miss this step).

 

7) Go to File/Export Frames/To PSP.

 

Mostly, this will minimize A.S to the task bar, and take you straight back into PSP, which is why we left it open. But we need to temporarily revisit A.S, so restore it from the task Bar. Once restored, right click on the title bar, and click on “Break Link With Exported Frames”. Minimize your frames in A.S, and then minimize A.S back to the task bar. You should now be back in PSP with your 30 frames open and active. Before anything else, save your frames, then Shift + D on your keyboard, and close the original.

 

Okies … time for another Explanation within an Explanation ……………………. ………………….. <sorry for the break … had to go for a nervous wee.  It is at this point in Nicky’s tut that she has you building the bling, and then halfway through, building and deleting at the same time. I found this very distracting after a few frames … trying to remember where I had finished building and where I had erased to. So, what we are going to do now, is to build it right through, and then go back and follow through on a second indepentant run to erase behind . You can if you so wish try both ways … remember that your frames are still at this very minute open in A.S. All you need do is select your eraser tool in A.S and erase away. I would however suggest you don’t try doing both methods simultaneously. One after the other is an elegant sufficiency, I would think.

 

The object now is to build our bling in somewhere around the 24 frame mark … but it matters not if it takes a few more … and if you do it in a few less … then it’s just going to flash by quicker, is all. If it takes 33 frames, then so be it … the finished file size is not increased by very much at all … these are very small file size creations. Looking at our image we have 2 sides and a top, so to do the thing in 24 frames means we have 8 bits to each leg. They don’t have to be exact … judgement by eye is fine. When they are being displayed at 12/100ths of a second, no one has time to run a ruler over them, and when you have a pattern involved, you may wish to shorten or lenghten one to finish or start at a particular point. You can use the Eraser tool if you so wish … I prefer Select and Delete, because the eraser, on any size tip over 1 pixel, leaves partial pixels around that A.S will render opaque, and you end up with white flecks dancing around your bling. The Select/Delete option is totally clean.

Okay … here comes the fun bit.

 

1) Hide all the layers except Frame 1.

 

2) Click on Frame 1 in your Layers Palette and add a new raster layer. Arrange it to the bottom, and floodfill with your “easy on the eyes” background colour.

 

3) Click on your Selection Tool to activate it and set the Tool Options Bar so it looks like this …

 

Make sure the Mode is in “Add”, the Selection Type is “Rectangle” and the feather is zero. Once you have set the Rectangular Selection Tool, click on the Freehand Selection Tool (Magic Lasoo) and set the Tools Options Bar to look like this …

 

Make sure the Type is “Point To Point”, and once again, the Mode is in “Add”, and the Feather is zero. It makes no difference which tool you use to make your selections … whatever you feel most comfortable with; but now they are both set, you can switch back and forth without worry to settings.

 

At this stage you have Frame 1 and your coloured Background layers open … all else closed. Just remember the following … on the build stage … you only select what you want to KEEP … everything outside your selection is for deletion.

 

4) Select the first portion of your bling (remember we have roughly 8 portions on this first side, so approximately 1/8th is to be kept. Once you have made your selection, go to Selections/Invert, and then hit the Delete key on your keyboard. Your image should now look like this …

 

Go to Selections/Selections None. Leave this layer visible and 100% opacity.

 

5) Click on Frame 2 to activate it. Make it visible. Lower the opacity to around 40 – 50%. You will be doing this all the way, purely to give you perspective of how far you’ve come and how far you have to go. Each time you complete a layer, leave it open, increase your opacity to 100%, activate the next layer, make it visible and lower the opacity of the new layer. So now we have Frame 1 visible at 100% opacity and Frame 2 visible and ACTIVE at around 50% opacity … your image should look like this …

 

 

and your Layers Palette should look like this …

 

 

We are still in Step 5. Select the next portion that you wish to keep. Remember that the image upon which you are working is 300 pixels in height, and we are selecting roughly 1/8th at a time, so your selection should be roughly at the 200 pixel mark on your ruler (give or take a bit here and there). Once you have selected it, go to Selections/Invert. Your image should look like this …

 

Notice that we are selecting right from the start each time, and will continue to do so until the whole image is revealed. Notice also that the partially opaque part of the selection is being kept … it is only dim because we have the layers opacity lowered, but everything inside the selection will be saved. Hit the Delete key on your keyboard. Selections/None. Now, hide Frame 1, increase the opacity on Frame 2 to 100%, click on Frame 3 to activate it, make it visible and set the opacity at your 40 – 50% mark. Your image should now look like this …

 

 

and your Layers Palette like this …

 

 

And so you go … adding your little portion each time. You will eventually get yourself in the rhythm of … Delete the unwanted bit, Select None, Increase the opacity, hide the layer below, activate the layer above, make it visible and lower the opacity, make the selection etc etc etc. Make a hundred of these little suckers and you’ll be chanting it in your sleep.

 

Now, because I am working on an image I previously prepared, I know that at Frame 13, I got to where the line met the little heart. This is significant, because it is also where I decided that when it came time for the tail to chase the head, this was where I would start it. I include this screenshot purely and simply to show you why it is beneficial to set your Selection Tools to the “Add” mode. Notice that the selection is in 3 parts … 2 of them selected with the Rectangle Selection, and the 3rd with the Freehand Selection Tool. It allowed a nice clean seperation of the heart from the line, like so (the selection is prior to Inversion) …

 

 

 

Continue your building process until you finish it.

 

 

Now for the Deletion.

 

 

For me, it took 22 frames to build the whole image, and we started with 30. I have decided to commence the demolishment at Frame 13, as I said above. so in effect, I have 17 Frames in which to erase the whole thing. Too easy. Remember also that the focal point of this particular bling is the heart graphic and the box beneath. The longer it takes to erase the line, the longer the focus is visible to the eye, before it too is erased. Add to that the fact that the timing of the finished bling is 12/100th of a second, and it requires a fraction over 8 frames to see the whole focus. In other words, if you use 9 frames to erase the line, your focus would have been totally visible for 1 second. That leaves you 8 frames to erase the focus itself. You can of course, add more frames … they are still open in A.S. But really, it is not necessary, unless you so want it to be. Confused? Me too.

 

So … away you go. Go back to the frame where the line met the heart, and make it visible AND active. Mine looks like this …

 

 

 

 Hide all other layers except your background, and sit there for a few seconds and mentally divide your line into 9 portions. When you are ready, select your portion and press the Delete key on your keyboard. Mine now looks like this …

 

 

Selections/Select None, and hide that layer and make visible AND active the one above.  Starting at the end of your second portion, select back to the start, and press Delete. Remember, on each frame you must select your new portion to delete PLUS the rest of the line back to the start. We are now erasing the whole image … not building it. At the end of my second deletion, it looked like this …

 

and at the end of the third deletion, it looked like this …

 

 

Notice how it is now being deleted and growing at the same time. By the time you have deleted your last bit of line you should be at the point where the last of the line was deleted and the focus fully displayed (Frame 22 in my case) and your image should look thus (after deletion, but prior to deselection) …

 

 

 

 

The first portion of your focus is deleted on your equivalent of my frame 23 and so on, until it is all deleted. When you have deleted the very last piece, that frame will be of course, completely blank, which we need to set the timing between the display of the bling and its final disappearance.

 

Delete any frames left above that blank one. All done.

 

Well Kiddies … that was fun, wasn’t it? But you’re not finished yet … after all that, this sucker has got to bling or else. Make visible all layers except your background (the very bottom one) … close that one off, and then save your image. Don’t close PSP yet in case you cocked it and have to start again (Heaven forbid). Restore A.S from the Task Bar, and open your newly saved image. (Surely you can’t have forgotten that quickly where you just saved it.) Go to Edit/Select All. Right click on the Title Bar of your image, and click on Frame Properties. When the dialog box opens, type in 12. Then scroll to the last (blank) frame and click in the middle of it. This deselects all frames except the last one. Right click on the Title Bar again, and click on Frame Properties. Set this last frame at 100. Click on the Play icon, and watch your creation.

 

If all looks ok, close the player and then click on File/SaveAs. In the “Save as File Type” dropdown, slect .mng. Name it, pick the save location and save it. It is now available for overlaying a tag graphic. You also have the original saved as a .pspimage, so now all things are possible. You can if you so wish, save it as a .gif … but you won’t be impressed with the result. These things are meant to be overlayed on a background image in their true 16.7 million colours. By saving as a .gif, any partially transparent pixel will be saved full colour, and believe me … there are thousands of those partially transparent pixels, so you’ll likely end up with a blob instead of bling.

 

To make this usable for other things … I never went into placing a name in the box but compared to what you’ve just gone through, it is a deadset walk in the park. Use the original image that you started with as a template. Open it in PSP, press Shift + D to duplicate it and close the original. Add a layer and flood fill for a background, and move it to the bottom. Select your Text tool and set your foreground to null and your background to white.

 

Activate the image layer and set up and type your text in Vector. (This automatically adds the layer upon which the text resides). Move it around and get it where you want it, and when set, right click on the text layer in the Layers Palette, and click on “Convert to Raster Layer.” Duplicate the layer twice. Then just apply Constellation to each layer exactly as you did in the original image. You now have your name in bling.

 

Hide the Template Layer and Background layer, and make sure all 3 text images are open and “Save As.”

 

After you have saved, but before you close the image in PSP, hide all the text layers, and open the Background and Template layers. Right click on the Title Bar of the image, and click on “Copy Merged”, then right click the Title Bar again and click “Paste/As New Image”. Right click on the Title Bar of the new image and click “Copy”. You can now close the image in PSP.

 

Go back to A.S and  click in the centre of first frame of your bling to select it. Then right click on the Title Bar of your bling and then click “Paste BEFORE Selected Frame.  The reason for this is to give you a template for a precise bearing on where to place your text, because the box that will eventually surround it is some 18 frames away, and all you can see on the first frame is a little strip of bling in the bottom left corner.

 

Now open your newly saved text image. Go to Edit/Select All.

 

Click on the Title Bar of your bling, and go back to Edit/Select all. Go back to Edit, and click on “Propogate Paste”. <<< Do NOT forget this step.

 

Make sure you are on the first frame of both the Text and Bling. Drag the first frame of text into your template frame and position it where you want it. When set, release the drag. Go straight to Edit/Undo Drag … this restores your text in case you missed and have to do it again.

 

Click on the Title Bar of your bling to activate it, and then click play. (Your first frame … or template frame will appear at the start of each sequence … we’ll fix that next) If all is OK stop the play, select the first template frame, right click in the middle of it and then click Delete. Replay to make sure it is now complete, and “Save As” a .mng file. All done.

 

Don’t forget before you leave A.S to reset your transparency grid to the default grey and white chequers.

 

As I said at the beginning, I am truly sorry this explanation is so long, but I can find no way to edit it down in size, and not lose you in the steps along the way. Those of you who are truly advanced users of PSP (as one day I hope to be) will undoubtedly know of shortcuts to carry out some of the steps … but I had to write this with the premise that a lot of not so advanced users would also give it a try. After you have made a few, the steps become second nature, and these animations are a really pretty accent for a lot of graphics. Once you master the construction, I hope you get a lot of pleasure and satisfaction from your creations.

 

Lotsa  … Old Jack.