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.