magic it's in the title of the show and
it's a pretty big part of the show
itself there's no shortage of magic
being used to float stuff around at any
given episode among other things so in
honor of unicorn Appreciation Day the
holiday that I just made up let's spend
some time and go over all the elements
it takes to put the magic in friendship
is magic it must be the unicorns they're
doing it with their awesome magic first
off is the effect on the horn which is
just a little 10 frame cycle with some
gradients applied let's start with the
main shape which I drew out here I
really don't have any tips on how to
draw wave cycles like this since all I
did was trace it off of screencaps
I did try to use as few points as
possible to make it easier to manipulate
and follow the waves up through the
frames I then copy the frames to a new
layer and use the edit multiple frames
tool to uniformly scale down all the
frames at once then we can copy and
paste those lines back into the original
layer and fill everything in with the
paint bucket tool to make solid inner
and outer shapes like this now we can
start building the final artwork on
another new layer I drew a rectangle
with a radial gradient with the Alpha
turned down to put a hole in the middle
and use the transform gradient tool to
adjust the position then we can use the
inner shape we made as a mask and make
the whole thing into a symbol the outer
shape is really the same deal as the
inner but with a linear gradient then we
combine those two symbols into one more
symbol and that's it looks pretty good
all that's missing are the little
sparkles I drew out one little shard and
copied it a few times to build up a
sparkle then I can convert it to a
symbol then go inside and animate it
just by scaling and moving each piece
every couple frames there's no hard or
fast rules on how these are built so
feel free to experiment and see what
works there's not a lot written on
traditional effects animation I do
highly recommend Joseph Gillan's
elemental Magic books if you're
interested in animating splashes flames
or sparkly pixie dust stuff there's also
a link to his and another interesting
effects blog in the description here's a
few more sparkles that I built and
you're not just limited to this of
course here's a really cool and I just
traced off of the screen caps inside the
magic symbol I extended things
a couple of loops to make it a 30 frame
cycle and dragged in some sparkles
starting at different times if the
animation goes past the last frame I
just put those extra frames back at the
beginning so here's the final effect
laid over a screen cap of Twilight that
does it for the effect on the horn which
can easily be animated along with the
head reused over and over as well as
tinted and reused on other characters
but what about the magic effect on
objects is that done the same way
thankfully no the magic effect used on
objects and such is custom for each
instance so you can go through all this
every single time and you can see how
the effect is sort of fluid and if two
objects are close enough they just meld
together which we can't do with this
method at least not easily it's actually
not that hard of an effect to pull off
but we'll need to venture out of Flash
and into After Effects to do it so let's
start by making a comp to put whatever
elements we want to apply the effect to
we can go composition new composition or
you can click the make comp button I'll
call it input and we'll set it to
whatever our final output size will be
in my case that's 1280 by 720 square
pixels 24 frames per second and let's
make it like a minute long to cover any
potential scene that might come up
having this is a comp instead of just a
layer means we can easily swap the
contents in and out without having to
change anything in the effect I just
drew a few shapes with the shape tool
act as a placeholder for now let's
trigger input comp into another new comp
and call it magic so let's add a simple
choker effect mat simple choker this can
be used to expand or contract the shapes
edges we'll drag it out to about
negative 50 now like the effect on the
horn we want to create a hole to see the
original through when we lay this on top
of it we'll drag out another copy the
input comp onto the first go to the
track mat for the bottom layer and set
it to alpha inverted this is a good
start let's soften the edges some will
add another simple choker on the top
layer set it to about negative 15 to
pull it out a little farther and add a
blur effect learn sharpen fast blur and
set that to about 20
let's precompose those two layers into a
new comp which I call mat for some
reason the reason for putting this in a
separate comp is so when we distort the
shape later it'll also distort the
inside of the shape instead of just the
outside so let's start whipping this
effect into shape by changing the color
effect generate fill and we'll set it to
a sort of purpley Twilight color now for
the actual distortion effect distort
wave warp
that'll give us these wavy edges and it
animates automatically going through the
parameters will leave wave type the same
you can fiddle with the wave height and
width depending on how far away the
effect is supposed to be from the viewer
but I think six and thirty five is a
good start direction can depend on the
angle is shot but 90 is a good default
and we'll leave the speed at 1 if you
look at the effect in the show it has a
semi-transparent edge to it that
actually tints the object it's affecting
so we'll need one more layer for that to
achieve that we'll drag out another copy
of our input comp and label it tint
basically want something similar to our
mat comp but without the track mat to
put the hole in it we can just copy the
effects the simple choker the fill and
the wave warp and paste them onto this
layer then we'll add another simple
choker to bring it out another 15 pixels
or so and it looks like we'll have to
drag the fill down to the bottom of the
effect stack and finally let's hit the T
key and take the opacity down to about
25% we're basically done but since this
is an effect that's attended to be
reused let's take a few more steps now
to make it more user-friendly down the
road let's add a null layer new null
object and label it controls then we can
go into the expression controls either
in the effects menu over here in the
search menu and dragging controls for
all the parameters we want to manage
color control for the fill angle control
for the direction slider controls for
the height and width cetera et cetera
and we'll link the effects to these
controls
let's lock this window so it doesn't
change when we click around if we go
into each effect and find the parameter
we want to link to alt click on the
stopwatch and use the pick whip to link
it to the control air I'll skip ahead so
you don't have to watch me do this
another dozen or so times this way
effects on both the matte and tint layer
stay synched up
you see if I change the color here it
changes both layers at the same time and
we have all the controls we need in one
place we don't have to go hunting
through different layers as an added
detail I also put a small wiggle
expression on the speed to make the
animation feel a little less mechanical
so let's try out our new effect with a
practical example I made a quick mock-up
of this abacus shot in flash and
rendered it out as an image sequence I
then singled out just the parts for
applying the effect to these four beads
here and rendered out a PNG sequence
which I called mask for some reason with
an alpha Channel and when you do this be
sure to render the full document size
now before we leave flash let's do the
sparkle effect in a new symbol I'll
build a little patch of some different
sparkles roughly the shape of what we're
affecting with varied sizes and starting
at different times
I made it another 30 frame loop like I
did with the horn then I'll make a copy
of the layer I want to attach it to
and just swap the sparkles for the
original symbol so it has the same
animation and that can change the start
frame of the cycle to offset the timing
if I want to reuse them and I did render
all this out in its own passes of PNG
sequence as well now back in After
Effects I imported the image sequences
you may have to go into the interpret
footage setting to ensure the correct
framerate and I place the masked
sequence in our input comp and delete
the placeholder since the angle this
shot is a bit tilted I'll change the
direction setting to about 60 degrees
let's make a new comp out of our full
render then we can add the magic comp
and the sparkle pass and finally animate
the opacity on the magic of sparkle
layers to fade them in and out and
here's the composite of the final shot
there now you can build your own
reusable magic effects or you can just
use my versions which are
description either way go out there and
make this the best unicorn appreciation
day ever