Video Game Style | 8-Bit Color Cycling in After Effects

You will constantly have to figure out ways to pull off new looks, to be more efficient, and to achieve your creative vision, and this tutorial is meant to show you how to think of After Effects as a tool to do just that. While this technique may seem very specific on the surface, you'll learn some practical tips on how to start thinking in the language of After Effects so you can bring all of your creative visions to life.

Or maybe you just think that the 8-bit video game look is just cool and want to use it in your work. Either way, you'll get something out of this lesson.

If you have any questions, click over to the Q&A tab to post them. Other students can answer you, and we'll put our team on the case to try and get you a solution ASAP. 


Download Project File
    00:00:17,238- Hey there, Joey here at School of Motion,
    00:00:19,373and welcome to day 13 of 30 Days of After Effects.
    00:00:22,799Today, we're going to talk about something
    00:00:24,439that's kind of one of these niche little effects
    00:00:26,878that maybe is useful, maybe not.
    00:00:28,902But what I really hope you learn from this video
    00:00:31,383is how to approach problem solving in After Effects
    00:00:34,325because that is a far more useful skill
    00:00:36,792than what we're actually going to be creating,
    00:00:39,376which is 8-bit color cycling.
    00:00:41,518If you were born in the '70s or '80s,
    00:00:43,753then you have probably played computer games
    00:00:45,465that used 8-bit color cycling,
    00:00:47,536because back in the good ol' days of adventure games,
    00:00:50,432you really could only have 16,
    00:00:52,112maybe 256 colors on screen at a time.
    00:00:55,667So this was a technique that programmers used back then
    00:00:58,396and it looks really interesting.
    00:01:00,225So I'm gonna show you how to do it in After Effects
    00:01:02,186and hopefully you'll learn a little bit
    00:01:04,387about the process of problem solving in motion design.
    00:01:07,275Also, don't forget to sign up for a free student account
    00:01:09,972so you can grab the project files from this lesson,
    00:01:12,349as well as assets from any other lesson on this site.
    00:01:15,078Alright, let's hop right in and get to it.
    00:01:17,918So this is color cycling,
    00:01:19,831and before I get too far in this tutorial,
    00:01:22,613I wanna just point out that
    00:01:25,251this technique, I've never actually had to use it
    00:01:28,280for any sort of paid work.
    00:01:31,298I can't imagine, really, that many situations
    00:01:32,912where you need to know how to do this.
    00:01:35,151So the reason I'm making this tutorial,
    00:01:37,454it's not just to show you a neat trick,
    00:01:39,362because sometimes that's fun too,
    00:01:40,733it's fun to just learn a neat trick.
    00:01:42,545But what I'm hoping you'll get out of this
    00:01:44,185is you'll have a little bit of a framework
    00:01:46,189when it comes to figuring out how to do effects
    00:01:49,394that you don't know how to do,
    00:01:50,406that you've never done before.
    00:01:51,687This effect, I had never actually done
    00:01:54,193in After Effects before,
    00:01:55,869but I've sort of--
    00:01:58,342After years of using After Effects and a lot of practice
    00:02:02,299and just kind of banging my head against it,
    00:02:04,601I've gotten pretty good at figuring out
    00:02:05,747how to make effects.
    00:02:07,029So I wanna try and teach you guys a little bit
    00:02:09,919about how my brain goes about doing that.
    00:02:12,400Hopefully, this will help you
    00:02:14,296when you have to do something like this.
    00:02:16,474Alright, so I got this idea.
    00:02:19,603Actually, my friend, Joe Russ,
    00:02:21,124he posted something about Monkey Island today,
    00:02:23,342and if you don't know what that is, Google it.
    00:02:24,873It's one of the greatest computer games ever made.
    00:02:28,204And it got me thinking,
    00:02:29,221I had seen this website before.
    00:02:31,992I can't remember when I saw it,
    00:02:33,239but I'll link to it in the description.
    00:02:36,021And what this is,
    00:02:36,984this is this artist, Mark Ferrari,
    00:02:39,353who created this artwork.
    00:02:41,207And it looks like it's moving, right?
    00:02:42,773But if you look at the palette over here,
    00:02:44,701you can actually see the trick that's creating the movement.
    00:02:48,949And here, what I'm gonna do is I'm gonna
    00:02:50,678turn this Cycle Speed down to a quarter.
    00:02:53,448And so now what you can see is that
    00:02:55,182this artwork has all of these little layers to it, right?
    00:02:59,457It's very deliberately created in such a way
    00:03:01,699that when you cycle specific parts of the color palette,
    00:03:05,625it creates this illusion of movement.
    00:03:08,419And there's a whole bunch of cool examples here
    00:03:10,424on this website.
    00:03:11,996Let me turn this back up to normal speed.
    00:03:14,538And you can kinda see here,
    00:03:15,832it looks like the water's moving.
    00:03:18,071If I come down here,
    00:03:18,904it looks like a rippling pond, right?
    00:03:23,409Like there's little raindrops.
    00:03:24,952And this is all done with the same trick.
    00:03:26,554If you look at the color palette,
    00:03:27,698that's what it's doing.
    00:03:28,845It's cycling the palette.
    00:03:30,689And so I said,
    00:03:32,308"Okay, how do I do that in After Effects?"
    00:03:36,159And so what I started with--
    00:03:37,660I'm gonna try and get through this part quick
    00:03:39,287'cause this part is not the interesting part.
    00:03:40,829But what I started with
    00:03:43,263was I just made a gradient.
    00:03:44,499So I made a new layer,
    00:03:46,010I used the Generate.
    00:03:48,675And it's called Gradient Ramp now,
    00:03:50,387it's kind of the new word for it.
    00:03:52,014It used to just be called Ramp.
    00:03:53,695So Gradient Ramp, right?
    00:03:55,558Just creates this gradient.
    00:03:56,826And then this is the trick
    00:03:58,865and the key to the whole thing, really.
    00:04:00,920And from here you might even be able to figure it out.
    00:04:04,501You use this effect with a silly name.
    00:04:07,025It's called Colorama.
    00:04:08,487Colorama!
    00:04:10,453And this is what it does.
    00:04:13,228It takes an Input
    00:04:15,082and you can tell it what that input is.
    00:04:17,697By default, it's the Intensity.
    00:04:19,994Intensity basically means the brightness of a pixel
    00:04:24,748in conjunction with its transparency.
    00:04:27,904So this layer has no transparency,
    00:04:29,912so Intensity is just how bright the pixel is, basically.
    00:04:33,634So here's the darkest pixel, here's the brightest pixel,
    00:04:36,283everything in the middle is somewhere in between,
    00:04:38,822and it maps that to an Output Cycle.
    00:04:42,509And if we open that up,
    00:04:43,414you can see this is the Output Cycle.
    00:04:45,563So, black gets mapped to this red.
    00:04:49,138And then as we get darker, it slowly turns yellow,
    00:04:51,439then green, then teal, then blue, then pink.
    00:04:53,631And you can see that that's exactly what happens.
    00:04:57,054And if I move these colors around,
    00:04:59,102you can see that it moves them around within this gradient.
    00:05:02,090All it's doing is mapping the colors.
    00:05:04,168Now the trick is if I go back
    00:05:05,783to this Input Phase section here,
    00:05:08,277there's a Phase Shift.
    00:05:09,660And watch what happens if I cycle this.
    00:05:12,274Whoa, there we go.
    00:05:14,202Okay?
    00:05:15,035So, once I sort of figured this out, I said,
    00:05:17,721"Okay, well, that's probably--"
    00:05:19,828I mean, that's clearly the trick,
    00:05:21,129that's the trick right there.
    00:05:22,042But how do you get it to look really good?
    00:05:25,904How do you really get it to look--
    00:05:28,456Not that this is the most amazing example
    00:05:31,814of color cycling ever, but it works.
    00:05:34,276It looks like a waterfall
    00:05:35,955and the ripples are working.
    00:05:37,669And I want you to notice that this white part
    00:05:40,436that sort of falls down the waterfall,
    00:05:42,405it starts off slow and then it kind of feels like
    00:05:45,010it speeds up as it falls.
    00:05:47,701And that's deliberate,
    00:05:49,162and I'll show you how I did that.
    00:05:50,162So, here's what we need to do.
    00:05:52,414Let me delete this.
    00:05:53,707What we need to do is first animate a waterfall.
    00:05:57,579And so, you know, I spent a lot of time
    00:06:00,889looking at this website,
    00:06:03,443turning the cycle speed down to a quarter,
    00:06:05,814and just sort of analyzing
    00:06:07,361what the heck a waterfall looks like
    00:06:09,640and how could I make that in a very simple way.
    00:06:11,561This guy is a far, far better artist than me,
    00:06:15,257so there's no way I can really recreate this,
    00:06:17,459but here's what I figured out.
    00:06:20,349I figured that...
    00:06:22,392A big sort of sheet of water falling,
    00:06:26,388it starts off kinda shaped like an ellipse.
    00:06:29,556And I don't want any strokes.
    00:06:30,970Let me turn that off.
    00:06:32,017Let me turn the Fill back on here.
    00:06:34,202It starts off like this,
    00:06:35,337and then as it falls,
    00:06:37,502it's gonna sort of--
    00:06:39,276Let me put the anchor point in the right spot here,
    00:06:43,152so this makes sense.
    00:06:44,010It's gonna sort of fall kind of like that.
    00:06:48,259It's gonna sort of--
    00:06:49,762You see the bottom edge?
    00:06:50,674Ignore this top part for a minute.
    00:06:52,250It's just gonna sort of fall down like that.
    00:06:55,490And so what I thought might work
    00:06:57,954is to take an ellipse
    00:06:59,838and I want it to be right in the center
    00:07:02,327of my comp, to make this easier to animate.
    00:07:04,711So, I'm gonna just double click the Ellipse tool.
    00:07:07,308It makes an ellipse the size of my comp.
    00:07:10,163And then I'm gonna double tap the u key.
    00:07:12,746Let me just call this Waterfall.
    00:07:15,850I'm gonna unlink the X and Y properties of the size
    00:07:19,442and I'm gonna shrink the X way down like this,
    00:07:22,397and I'm gonna shrink it way down like this.
    00:07:24,687Okay, so this is where it's gonna start,
    00:07:27,165so let's put a keyframe there,
    00:07:28,583and let's go forward.
    00:07:31,004And to be honest, it doesn't really matter
    00:07:32,221how far we go forward, I'll show you in a minute.
    00:07:34,163I kinda wanna get a sense of the timing of this,
    00:07:36,939so I'm gonna go forward one second,
    00:07:38,862and I'm gonna stretch this way out.
    00:07:41,512And again, ignore this top part for a minute.
    00:07:44,248Just think about the bottom.
    00:07:48,225So now, if we just RAM Preview this,
    00:07:50,461this doesn't look like water falling.
    00:07:52,913When things fall--
    00:07:55,675Let me first Easy Ease these
    00:07:56,724and hop into the Curves Editor here.
    00:07:59,677When things fall, they start off not moving.
    00:08:03,968And the curve is flat here,
    00:08:05,199so that's correct.
    00:08:06,918But then they just accelerate until they hit something
    00:08:10,832and this is a waterfall,
    00:08:12,006so it's not really gonna hit anything.
    00:08:14,885And so, what I need it to do,
    00:08:16,101I just need this curve to accelerate
    00:08:18,602all the way into this last keyframe.
    00:08:20,624So that's what this curve is now doing.
    00:08:23,248And I'm gonna pull this out a little bit,
    00:08:24,998so that it kind of hangs for a minute.
    00:08:26,883I'm also gonna just nudge this curve a little bit off
    00:08:30,202of perpendicular like that,
    00:08:31,948so it's never totally static.
    00:08:35,525So now you look at that.
    00:08:36,950There's a little bit of an acceleration to it.
    00:08:39,056And it doesn't feel fast enough,
    00:08:40,463it's a little bit unnatural,
    00:08:41,608so I might scoot that keyframe back a little bit.
    00:08:45,729And you really have to use your imagination here.
    00:08:47,834This doesn't look anything like a waterfall yet.
    00:08:49,871But believe it or not,
    00:08:51,325this is exactly how I made this thing.
    00:08:54,164Okay?
    00:08:55,286Cool.
    00:08:56,119So you start with that
    00:08:57,329and now I want to pre-compose this.
    00:09:01,021I'm just gonna call this 01_WaterfallPC.
    00:09:04,611And if you don't know why I'm putting this 01 here,
    00:09:08,080you should watch the tutorial in this series
    00:09:10,634which deals with pre-comping 'cause I get into that.
    00:09:13,562Alright, so there's my pre-comp.
    00:09:15,325Next thing I want to do is mask out
    00:09:16,769the part of this that I don't want.
    00:09:18,565So I'm just gonna grab my Mask tool here
    00:09:22,115and I'm gonna get approximately in the center
    00:09:24,540and I'm just gonna grab the bottom like that.
    00:09:27,110Okay, so now let's take a look at that.
    00:09:29,345So now that's what it looks like.
    00:09:32,351And that's why I pre-comped it,
    00:09:33,467so I can easily mask it.
    00:09:35,972Cool, that's great.
    00:09:37,959Okay.
    00:09:38,816So while we're in this pre-comp,
    00:09:40,577this does not look like water.
    00:09:42,894It's so perfect.
    00:09:44,201It's just perfectly round.
    00:09:45,278And if you were trying to make super cartoony anime water
    00:09:49,041or something, maybe that's what you'd want,
    00:09:50,506but I don't want that.
    00:09:51,339I want it to be a little bit turbulent, like water.
    00:09:54,775So what I'm gonna do is add a Turbulent Displace effect.
    00:09:59,535And I could put it right on the layer,
    00:10:03,137but what I usually do is I'll put it on an Adjustment Layer.
    00:10:07,077So I'm gonna make an Adjustment Layer.
    00:10:08,619Why don't we just call this Turbulent,
    00:10:10,990so I know what it is.
    00:10:12,238The reason it's nice to put Turbulent Displace,
    00:10:14,636which by the way is in the Distort menu.
    00:10:17,004Turbulent Displace.
    00:10:17,837It's good to put it on an Adjustment Layer
    00:10:19,601because what this effect does is it creates a noise field.
    00:10:24,031It basically creates fractal noise.
    00:10:25,667If you guys are familiar with that effect.
    00:10:28,123Creates fractal noise and then it uses the fractal noise
    00:10:31,448to displace the image that it's applied to.
    00:10:35,343And if you put Turbulent Displace on--
    00:10:39,179Here, let me show you a quick example real quick,
    00:10:40,690so it can be easier to just show you.
    00:10:44,762Alright, make an ellipse here.
    00:10:49,007Let me just pre-comp it.
    00:10:51,624Cool, so now I've got this nice ellipse shape.
    00:10:53,878And if I put Turbulent Displace on this layer
    00:10:56,758and let's turn the size down a little bit,
    00:10:59,001crank up the amount.
    00:11:00,242If I move this around, you see how it's like
    00:11:02,908it's displaced, but the displacement doesn't change at all.
    00:11:05,608It's stuck to that layer,
    00:11:07,103versus if I add an Adjustment Layer.
    00:11:11,543Let me take this effect, then just cut it,
    00:11:13,456paste it on the Adjustment Layer.
    00:11:15,738Here we go.
    00:11:17,143Now if I move that layer around
    00:11:19,313underneath the Adjustment Layer,
    00:11:20,919it will actually flow around the Turbulent Displace.
    00:11:26,927That's pretty slick, right?
    00:11:28,197So now we can get rid of this.
    00:11:30,373So that's why I like to put Turbulent Displace
    00:11:32,592on an Adjustment Layer.
    00:11:36,154So let's go back here.
    00:11:38,441Here's my Adjustment Layer.
    00:11:39,618And so let's crank the Size down a little bit.
    00:11:46,065Let's turn the Amount up a little bit.
    00:11:48,724And I just sort of played with all these settings.
    00:11:51,288I found that Turbulent Smoother
    00:11:52,554kind of worked a little bit better.
    00:11:55,215And look at that.
    00:11:56,124And you can see that as it falls down,
    00:11:58,868the edge of it kind of changes,
    00:12:02,523but it does it in a way that feels a little more natural,
    00:12:06,126because it's moving through that noise.
    00:12:09,088And if I wanted to,
    00:12:10,100I can also animate the Evolution a little bit,
    00:12:12,293but I don't really need to.
    00:12:14,597Alright, so let's leave it like that for now.
    00:12:17,352Cool.
    00:12:18,185So here's what I'm trying to get at.
    00:12:20,967What I want is, I want an image
    00:12:23,935where I see each frame of this animation.
    00:12:27,195Like this frame, then this frame,
    00:12:28,667then this frame, then this frame.
    00:12:29,940And I wanna see them all kind of as a gradient.
    00:12:33,936All put together, going from white to black
    00:12:36,916or black to white,
    00:12:38,205where I can kind of discretely see each individual frame,
    00:12:42,569if that makes sense.
    00:12:43,499And the reason I want that
    00:12:44,899is 'cause then I can put a Colorama effect on that
    00:12:47,144and cycle the colors.
    00:12:48,848So here's the first step, pre-comp this.
    00:12:52,565So this is gonna be 02_,
    00:12:54,638we'll call it WaterfallTurb.
    00:12:59,098Cool.
    00:12:59,931Alright, so now I've got this pre-comped.
    00:13:01,721So there's a bunch of different ways to do that.
    00:13:04,047What I found worked pretty well.
    00:13:07,090I was sort of thinking,
    00:13:08,422I know that there's some time effects here.
    00:13:10,906Like, there's this Echo effect.
    00:13:13,013And what the Echo effect does,
    00:13:14,684you set the Number Of Echoes.
    00:13:16,784So let's say I want eight kind of in-betweens
    00:13:21,015for this animation,
    00:13:21,987so I'm gonna say eight echoes.
    00:13:23,603And I want the Echo Time in seconds.
    00:13:26,009I don't want it to echo things
    00:13:27,787that have happened previously,
    00:13:29,209I want it to actually look forward in time.
    00:13:32,174And you can see that's not working,
    00:13:33,905but that's because this Decay is at one,
    00:13:39,288meaning it's not really decaying at all.
    00:13:43,057What it means by decay is sort of fading out each echo.
    00:13:46,598So if I lower this a little bit, there we go.
    00:13:49,866You can see it's starting to work
    00:13:52,081and it kind of works,
    00:13:54,088but I found the Echo effect really weird.
    00:13:56,524Like, this is kind of what I was going after,
    00:13:59,562but it's sort of not doing it in a way
    00:14:02,476that makes any sense to me.
    00:14:06,119I don't really understand why this number has to be so low.
    00:14:09,804I have eight echoes in there,
    00:14:11,564I don't really see eight layers here.
    00:14:13,114So the Echo effect wasn't working for me, so I killed it.
    00:14:17,081And then I tried some other ones
    00:14:18,027and I found this Wide Time effect,
    00:14:20,364which is really simple.
    00:14:21,943Backward Steps, I want zero,
    00:14:23,742and then Forward Steps, I want eight steps.
    00:14:25,777And now, I'm starting to see,
    00:14:28,390this actually gives me a little more control
    00:14:30,938and I actually can see eight steps here.
    00:14:35,044Now, I don't see the eight steps that I want,
    00:14:36,827so then the next move
    00:14:38,836is I need to actually speed up this animation.
    00:14:41,894So I need to go back in here
    00:14:44,591and move this keyframe back a little bit.
    00:14:49,180And if I was smart
    00:14:51,270and I wanted to be able to move that keyframe in,
    00:14:53,604see the result,
    00:14:55,352what I would do is make sure
    00:14:56,383that this comp is available
    00:14:58,900down here in my timeline,
    00:15:00,546lock the viewer with the little lock button,
    00:15:03,236and then pop in here and just scoot this keyframe back
    00:15:06,008until I get what I want.
    00:15:09,705And you can see now.
    00:15:12,331There we go.
    00:15:13,164That's pretty much it.
    00:15:17,533The first frame of our animation
    00:15:20,027is this white--
    00:15:21,728Like, the brightest part.
    00:15:23,536Then, the second frame is a little darker,
    00:15:26,795and the third frame is a little darker.
    00:15:29,528And it basically gets darker and darker and darker
    00:15:30,743as time goes on.
    00:15:34,047And you can see too that because I changed
    00:15:37,654the animation curves so that there was acceleration
    00:15:41,111throughout the animation,
    00:15:43,957the sort of gradation between the shapes,
    00:15:47,003it's thinner at the beginning of the animation,
    00:15:50,248and then it gets wider and wider and wider as time goes on.
    00:15:53,315If we jump closer and we go to full res,
    00:15:57,042you can see that my Turbulent Displace
    00:15:58,666is actually causing some of the second frame
    00:16:01,861and the third frame
    00:16:02,727to be above the first frame.
    00:16:04,969So I may wanna, with this lock still on,
    00:16:09,443come here and mess with my Turbulent Displace settings.
    00:16:12,502Maybe we can try Bulge Smoother.
    00:16:14,916That kinda fixed most of it.
    00:16:17,736I could try turning the complexity down,
    00:16:21,767or turn it up and see what that does.
    00:16:23,371I don't like that, I like it back where it was.
    00:16:27,153I can mess with the Evolution,
    00:16:28,753just to see if maybe I can find a better value for it.
    00:16:32,441Alright, and if we kinda zoom out and look.
    00:16:35,453Right, not bad.
    00:16:37,459You can mess with these settings as much as you want.
    00:16:41,032That's not what I wanted to do.
    00:16:42,463I wanted to mess with the amount
    00:16:43,672to get a little bit more.
    00:16:48,139So anyway, you mess with these until you get--
    00:16:50,495Oh, that's interesting, but terrible.
    00:16:52,807Interesting, yet terrible.
    00:16:56,189Alright, so let's just say this is what we want.
    00:16:58,927Got a little bit of variation to it
    00:17:02,248and you can see we've got exactly
    00:17:03,985the shape we're looking for.
    00:17:07,255And so, now here's the problem.
    00:17:09,436If I play this animation, this is the frame we want,
    00:17:13,483but it goes away very quickly.
    00:17:14,864And so, what I thought I could do--
    00:17:18,227I'm kind of a big fan of showing you my screw-ups here too,
    00:17:21,119I think that's helpful.
    00:17:22,673What I thought I could do was pre-comp this
    00:17:25,378'cause it's got the Wide Time effect on it.
    00:17:28,023And I could just call this 03_WideTimed
    00:17:31,860or something, right?
    00:17:33,766And what I thought I could do was just Time Remap it.
    00:17:36,852Command + Option + T enables Time Remap.
    00:17:40,429And before I do that,
    00:17:41,262let me show you one thing I screwed up.
    00:17:42,813Let me undo all these things I just did.
    00:17:46,095So, when I pre-comp this.
    00:17:48,945Shift + Command + C.
    00:17:50,038You have to makes sure
    00:17:51,531that you are moving all the attributes
    00:17:53,452into the new comp.
    00:17:54,636So 03_WideTimed.
    00:17:59,241So now, this WideTimed pre-comp
    00:18:01,505does not have the effect on it.
    00:18:03,407The effect is inside the pre-comp.
    00:18:06,570That's what we wanted.
    00:18:08,670And now, what I thought I could do
    00:18:10,249is turn on Time Remapping,
    00:18:11,409so Command + Option + T,
    00:18:12,870and then make this a Hold keyframe.
    00:18:14,883So hold Command, hold Option at the same time,
    00:18:16,246and click it.
    00:18:17,892Thinking, "Okay well, now it's just gonna hold
    00:18:19,882"on frame zero, and that should hold the frame we want."
    00:18:22,441But as soon as I did that, you see what happened?
    00:18:24,599Our beautiful gradient image went away
    00:18:28,075and I don't know why.
    00:18:29,510I think it must be some sort of issue
    00:18:32,883with the way the Wide Time effect works.
    00:18:36,165It just doesn't work when you go up a level
    00:18:39,456and you Time Remap it, it just stops working.
    00:18:42,481So what I did, I did something I normally hate doing,
    00:18:45,666but every once in a while I have to,
    00:18:47,720which is I just rendered this out.
    00:18:49,906Before I render it out, I just wanna point out something.
    00:18:51,773That this is not actually a darker color.
    00:18:57,404If I hit the Transparency Grid,
    00:18:59,646you could see it's actually transparent,
    00:19:02,008and maybe that's hard to see.
    00:19:03,674Let me fill this with a color real quick,
    00:19:05,892so you can actually see it.
    00:19:07,484It's actually transparent,
    00:19:09,485it's not darker.
    00:19:11,563And that's gonna come back and bite us
    00:19:13,150in the butt a little bit
    00:19:14,195when we jump into the Colorama,
    00:19:15,028but I'll show you how to deal with that.
    00:19:17,354So what I'm gonna do,
    00:19:18,193let me turn this back to full res for a second.
    00:19:20,732And I'm gonna hit Command + Option + S.
    00:19:23,207That's the keyframe for save a still frame.
    00:19:26,497You'd notice if you watched my tutorials,
    00:19:28,947I hate to use these menus up here if I don't have to,
    00:19:31,492I always use the keyboard.
    00:19:32,710It makes you much, much faster.
    00:19:34,844Alright, so I'm just gonna save a Photoshop file.
    00:19:37,715And by default, just so you guys know,
    00:19:40,672when you save a Photoshop file,
    00:19:42,046it is saving the Alpha Channel,
    00:19:44,063so it's saving that transparency.
    00:19:45,911And let's save that in my ColorCycling folder
    00:19:51,144and we'll stick it in here.
    00:19:52,412We'll just call this Waterfall.
    00:19:56,607Cool.
    00:19:57,677Alright.
    00:19:59,287And now we've got that saved.
    00:20:01,529So let's import that.
    00:20:03,757Let's bring that back in.
    00:20:07,102There it is.
    00:20:08,843Okay, cool.
    00:20:09,676So now, let's make a new comp
    00:20:12,810and let's bring in our Waterfall.
    00:20:15,718Okay, so now I'm gonna call this comp
    00:20:17,751Waterfall02.
    00:20:22,774And what I wanna do is actually make a folder here
    00:20:25,024in my COMPS folder.
    00:20:26,719I'm not sure I've talked about this yet,
    00:20:28,697but this is how I set up pretty much all
    00:20:30,822of my After Effects projects.
    00:20:32,779And at some point, I'll get into it
    00:20:35,004and I'll talk a little bit about why.
    00:20:36,839But for now, I'm gonna put all of these comps that I've used
    00:20:40,839to make my waterfall.
    00:20:43,865I'm gonna put them all in a Waterfall folder.
    00:20:45,864The reason I wanna do that
    00:20:47,006is 'cause then what if I wanna make some ripples,
    00:20:49,385what if I wanna makes some splashes?
    00:20:51,641Well, I've got this setup here that I could just duplicate
    00:20:54,188and it's gonna make it a lot easier
    00:20:55,808to copy this setup and reuse it.
    00:20:59,455And in fact, I might as well put an 04 in front of this,
    00:21:02,148even though this 04 comp does not actually
    00:21:06,222contain the 03 comp,
    00:21:07,783at least I know sort of the order
    00:21:09,265I'm supposed to do things in.
    00:21:11,206Alright, so here--
    00:21:12,531Excuse me.
    00:21:14,022Here's my--
    00:21:14,855I'm going through puberty while I do these tutorials.
    00:21:16,997Here's the waterfall image we just rendered out,
    00:21:19,701and now I'm ready to put the Colorama effect on there.
    00:21:23,136So let's just apply Color Correction,
    00:21:26,500Colorama.
    00:21:28,188Colorama!
    00:21:29,224There it is.
    00:21:30,164So that didn't work at all.
    00:21:31,760See?
    00:21:33,380So, the reason it's not working right now
    00:21:35,226is because the Input Phase.
    00:21:37,500It's trying to get the phase from the Intensity,
    00:21:41,450but the problem is the Intensity
    00:21:44,266looks at the brightness of a pixel
    00:21:45,954and the pixels technically all have the same brightness.
    00:21:49,878They do have a different Alpha Channel.
    00:21:52,548And so, if you turn this on
    00:21:55,795and you turn off this Modify Alpha option
    00:21:58,752down in the Modify section,
    00:22:00,529now it'll leave the Alpha Channel alone.
    00:22:02,988So by default, what it does is it looks at the Intensity,
    00:22:06,065which is the brightness and the Alpha taken kinda together.
    00:22:09,589But this Modify Alpha option that's turned on,
    00:22:13,141it basically kills whatever Alpha's there
    00:22:18,080and creates a new one.
    00:22:20,270Alright, so if you turn that off, now you get this,
    00:22:22,380which is closer to what we want.
    00:22:24,243And actually, if we go back into the web browser
    00:22:27,997and we take a look at this.
    00:22:29,196And I turned this down, right?
    00:22:30,693It's at one quarter cycle speed.
    00:22:32,590And if you look really closely,
    00:22:34,243like look in here,
    00:22:35,076you can see a lot of transparency in this image.
    00:22:37,495When it's playing kind of quickly,
    00:22:39,317you almost don't notice it.
    00:22:40,857But when it's going really slow,
    00:22:42,674you can kinda see the layers that this artist built up
    00:22:46,519to enable this waterfall to look very complicated.
    00:22:50,489So I actually like the idea
    00:22:52,457of having some transparency here.
    00:22:55,520If I turn this Transparency Grid on,
    00:22:58,328I can see that I've got
    00:23:01,779this feathered transparency,
    00:23:04,317which is cool because
    00:23:05,317what if I layered a bunch of these
    00:23:07,723to create a waterfall, for example?
    00:23:10,685Alright, so let's look at the Colorama settings.
    00:23:13,452Here's the Output Cycle.
    00:23:15,677Right now, it's not actually doing anything,
    00:23:17,979except giving us red.
    00:23:19,793And that's because it's getting the phase from Intensity.
    00:23:21,929If we switch that to get phase from Alpha,
    00:23:25,355now it's actually gonna show us all of these colors.
    00:23:30,990And remember, when it was getting the phase
    00:23:32,462from the Intensity,
    00:23:33,295it was looking at the color of the pixels.
    00:23:35,012But the color of the pixels,
    00:23:36,617they were all technically white.
    00:23:39,060They just had different Alpha Channels.
    00:23:40,549If I get the phase from the Alpha Channel,
    00:23:42,475since the Alpha Channel is now different on each one,
    00:23:46,375then we actually get the Colorama effect.
    00:23:49,530And if I now animate the Phase Shift, look at that.
    00:23:52,176There's your waterfall.
    00:23:55,105So the next step is to create
    00:23:58,886the right colors for a waterfall.
    00:24:00,923And so there's all these presets.
    00:24:02,782If you look in the Output Cycle section here,
    00:24:04,768there's this Use Preset Palette
    00:24:06,559and there's a ton of them they give you.
    00:24:08,471And there's some really interesting ones
    00:24:09,672that are actually pretty nice.
    00:24:11,745This Caribbean one is not a bad starting point,
    00:24:15,435but you can see there's a lot of different cycles
    00:24:18,345and I don't really want it to go from bright,
    00:24:20,849to dark, to dark, to bright,
    00:24:22,484to dark, to really bright.
    00:24:23,767I don't want it to do all that.
    00:24:26,013So what I did is I just picked
    00:24:27,980one of these simple ones here.
    00:24:29,252Like, I think I picked Ramp Blue.
    00:24:31,529It starts at this ridiculously electric blue
    00:24:35,019and it goes all the way around to black.
    00:24:36,981So instead of doing that,
    00:24:38,456I want it to start at white.
    00:24:43,087And then pretty quickly,
    00:24:45,142I want it to turn to kind of a nice, lighter blue color.
    00:24:50,328Maybe this is kind of like a Caribbean blue.
    00:24:52,361And then by the time it gets to the end,
    00:24:55,518I want it to be still in that family of blue,
    00:24:59,139but I want it to be much darker.
    00:25:01,790And then along the way,
    00:25:03,919you can introduce a little bit of natural variation to it,
    00:25:06,825which just kinda makes it a little nicer.
    00:25:09,854But now when I cycle this,
    00:25:12,739you can see we're starting to get that effect.
    00:25:18,665Now, it's not working perfectly yet,
    00:25:21,608and so I'm basically just gonna play around
    00:25:24,796with these colors a little bit.
    00:25:27,357The main problem I'm having right now
    00:25:29,515is I'm not seeing enough of that white, I feel like.
    00:25:33,217So I might actually click here
    00:25:34,600and basically all you have to do
    00:25:36,011is you click around the perimeter of the circle
    00:25:37,652and you can add more colors.
    00:25:38,923And I'll just add another white color,
    00:25:41,075so now I can create a bigger band
    00:25:43,310of where this should be white.
    00:25:47,059There we go.
    00:25:48,381Cool.
    00:25:50,238Alright, that's pretty cool.
    00:25:51,930Awesome.
    00:25:53,059Alright, so now here's some other settings.
    00:25:55,703So first of all, if I turn off Modify Alpha now,
    00:25:59,334because I'm using the Get Phase From Alpha,
    00:26:02,882you could see now
    00:26:03,944it basically brought all the colors to full brightness
    00:26:07,933because now there's no Alpha Channel.
    00:26:09,718So I wanted to show you guys this is a cool option.
    00:26:13,028A problem with this is now
    00:26:15,250if I duplicate this waterfall layer
    00:26:17,393and I move this over,
    00:26:19,068it just looks like a solid shelf of water,
    00:26:23,603and it's not blending at all.
    00:26:26,480So let me turn the Coloramas off for a second.
    00:26:28,492And actually, the way I had this set up in my demo,
    00:26:31,640let me delete this Colorama effect.
    00:26:34,226Let me turn this one off for a minute.
    00:26:36,281What I actually did was I made an Adjustment Layer.
    00:26:38,303Called it Colorama.
    00:26:41,529And I put the Colorama effect on that,
    00:26:45,333and the reason I did that
    00:26:46,553was 'cause now I can just turn this off
    00:26:48,137and I can actually take all of these
    00:26:51,279little waterfall layers like this
    00:26:53,162and I can kinda move them around
    00:26:55,387and then turn the Colorama effect on,
    00:26:57,150and I can build little shelves of them
    00:26:59,898and little kind of pieces of them.
    00:27:01,774And they're not blending together all that well right now.
    00:27:07,597And so I found that when you have this Modify Alpha
    00:27:12,964turned off, it gives them transparency,
    00:27:17,292which is gonna let them blend a little bit better.
    00:27:21,647Here, let me just do a quick little test here.
    00:27:25,433If I go back to the Input Phase
    00:27:26,881and I animate the Phase Shift,
    00:27:28,228you can see that they both kind of animate at the same time.
    00:27:32,111And I wanna start being able to preview this waterfall
    00:27:35,322and see if it's actually looking like a waterfall.
    00:27:37,376So what I'm gonna do is actually keyframe--
    00:27:39,575I'm not gonna keyframe it.
    00:27:41,251That's ridiculous.
    00:27:42,739Why would I do that?
    00:27:43,680But I am gonna animate the Phase Shift.
    00:27:45,729And whenever I have to animate something
    00:27:48,128that I just wanted to increase at a constant speed,
    00:27:51,787I use the simplest expression I know,
    00:27:53,701which is hold Option, click the Stopwatch,
    00:27:56,784and you just type in time times a number.
    00:27:59,881Alright, so let's start by putting in time times 500
    00:28:03,441and see what happens.
    00:28:04,794And if I do a RAM Preview...
    00:28:08,269Let me switch this to half res,
    00:28:09,682so it doesn't take so long to RAM Preview.
    00:28:12,128But if I do a RAM Preview,
    00:28:13,710it's animating automatically
    00:28:16,158based on the time of the comp.
    00:28:17,544And that's actually not a terrible speed,
    00:28:19,339so let's leave it at that.
    00:28:20,446Now, one thing that is bothering me a little bit
    00:28:23,436is they're both animating at exactly the same time.
    00:28:28,021It just looks like a copy.
    00:28:32,483It's just too obvious.
    00:28:33,625So what I'd like to do is have this waterfall
    00:28:38,766animated a different kind of--
    00:28:41,064Maybe the same speed, but sort of have the animation
    00:28:43,816start in a different place than this one.
    00:28:46,007And I could just put the Colorama effect
    00:28:48,152on each layer individually and do that,
    00:28:51,640but then that's gonna be kind of a pain
    00:28:53,503to manually offset them
    00:28:55,183and make them look the way I want.
    00:28:56,394So what I did was actually
    00:28:59,331I took the Colorama effect
    00:29:01,094and I put it on this waterfall layer.
    00:29:04,073So let me just do that real quick,
    00:29:05,295put Colorama back on there.
    00:29:08,363Colorama!
    00:29:11,849Alright, and just tweak the settings here
    00:29:13,686so the Input Phase on the Colorama
    00:29:15,467is gonna come from the Alpha.
    00:29:17,480So remember, that's really all the information we have here.
    00:29:19,554And then the Output Cycle,
    00:29:21,417I don't want this crazy rainbow thing.
    00:29:24,527I'm gonna use the Preset Palette
    00:29:26,218called an Alpha Ramp.
    00:29:29,085What the Alpha Ramp is doing,
    00:29:30,292this is kind of an interesting thing Colorama can do,
    00:29:32,176it can actually ramp,
    00:29:33,312not just between a bunch of different colors,
    00:29:35,360but also between a bunch of different Alphas.
    00:29:36,979So what it's ramping here is the color remains white,
    00:29:40,865all the way around the circle,
    00:29:42,341but the Alpha goes from totally opaque,
    00:29:45,420all the way to totally transparent,
    00:29:46,953which, coincidentally, is what this layer already had on it.
    00:29:50,916So this Colorama effect, it's not really doing much.
    00:29:54,204The reason it does kind of change it a little bit
    00:29:58,052is because by default,
    00:29:59,320you have a setting that says Composite Over Layer
    00:30:02,288and I don't know why that's on by default.
    00:30:05,003Let's turn that off
    00:30:06,514and now the effect does nothing.
    00:30:10,206Because what it's doing is it's mapping the Alpha Channel
    00:30:13,802to a normal Alpha Channel.
    00:30:15,817If we now Phase Shift it though,
    00:30:18,527it's actually gonna cycle the colors for us.
    00:30:22,362And now that I've cycled the colors,
    00:30:23,887I can turn this Colorama back on
    00:30:25,745and I can actually kind of offset
    00:30:28,957this little waterfall piece individually,
    00:30:33,220which is pretty cool.
    00:30:34,774And so then, the other thing I can do
    00:30:36,005is I can maybe set both of these to Screen or...
    00:30:41,602I think I've played around with Screen.
    00:30:44,026I think I ended up with a lighter color.
    00:30:47,571And really, all that does.
    00:30:50,120If you have it on Normal,
    00:30:52,280there's an Alpha Channel,
    00:30:53,113so it's not gonna make much of a difference,
    00:30:54,296but you can add them together
    00:30:57,005and you can kinda get different looks
    00:30:59,857like the way they blend together.
    00:31:01,275And then the Colorama's just gonna act on that,
    00:31:03,495so let's leave that on Lighten.
    00:31:06,619And now that I've offset this one,
    00:31:08,311I have a different timing to it.
    00:31:12,369And so it adds a little more depth to it.
    00:31:14,955And you can also start to kind of play
    00:31:17,506with the scale of these things.
    00:31:21,141And so what I was thinking was,
    00:31:22,491this one here's gonna kinda be the big main piece,
    00:31:26,345and then there's gonna be some little kind of offshoots
    00:31:29,156coming off of it.
    00:31:31,946Maybe one over there, maybe one over here.
    00:31:34,304This one's a little bit smaller.
    00:31:37,949And along the way, I'm gonna change the Input Phase
    00:31:40,854on each one, so that they're never perfectly in sync.
    00:31:48,274Let me duplicate that.
    00:31:51,922There we go.
    00:31:54,504And this Colorama effect for some reason
    00:31:56,343is kind of a render hog,
    00:31:57,765so just know that
    00:31:58,763it is gonna work a little bit slowly for you.
    00:32:03,180Alright, and then we can mess with this one.
    00:32:09,231And as we start looking,
    00:32:15,449you're starting to get that nice
    00:32:17,015kind of cascading waterfall look.
    00:32:22,832Right, that's pretty cool.
    00:32:24,325Now, looking at this,
    00:32:25,856I'm thinking, the bands here,
    00:32:28,363this is pretty chunky.
    00:32:29,967If you go back and look at this,
    00:32:31,493how nice and smooth and pretty that looks.
    00:32:33,904So what that tells me is maybe what I should've done
    00:32:36,958was back in my pre-comps here,
    00:32:40,690I should've had the Wide Time have a few more Forward Steps.
    00:32:42,995So if I just crank this to like 16,
    00:32:45,349instead of eight,
    00:32:47,875and then what I need to do is go into this pre-comp
    00:32:52,260and move this frame forward to at least frame 16.
    00:32:56,845Now if we look at it,
    00:32:58,547you're gonna get more of a gradation to it.
    00:33:02,681So let me put the lock on this comp one more time
    00:33:05,786and come back to this pre-comp
    00:33:08,601and move this keyframe.
    00:33:10,374Turn this to Half.
    00:33:12,207And I'm gonna move the keyframe
    00:33:13,196until I get what I'm looking for.
    00:33:15,491There we go.
    00:33:16,324So now we have a much nicer kind of flow to it.
    00:33:20,164And now what I need to do
    00:33:22,081is Command + Option + S,
    00:33:25,877render that frame out.
    00:33:26,972I'm just gonna render right over this old one.
    00:33:29,517Replace it, render it.
    00:33:31,859It's giving me a warning saying,
    00:33:32,897"You're about to overwrite something."
    00:33:34,631That's fine.
    00:33:36,075And then I'm just gonna Control click on this
    00:33:37,939and say Reload Footage.
    00:33:40,031So now, if we go back to our...
    00:33:44,666Here we go.
    00:33:45,499Oh, for Waterfall02, come back here.
    00:33:48,338Let me unlock my comp viewer.
    00:33:52,398Oh, I know what I did wrong.
    00:33:53,335I did something really silly, people.
    00:33:55,122I'll tell you what I did.
    00:33:56,633If we come back to this comp,
    00:33:57,877I left this on half res.
    00:33:59,732And by default, if you hold Command + Option + S,
    00:34:04,637it's gonna render at the current settings.
    00:34:06,714What you can do,
    00:34:07,653you can either turn your settings to full
    00:34:09,669before you render it,
    00:34:11,174or you can just switch it here to Best Settings,
    00:34:14,013instead of Current Settings.
    00:34:16,186Then render over Waterfall, Replace.
    00:34:19,010There we go.
    00:34:21,452And then we'll just Control click, reload the waterfall.
    00:34:24,580Go back to this comp
    00:34:25,775and now our waterfall has more variation in the colors,
    00:34:30,948so it's gonna look a little bit smoother.
    00:34:33,319And if you're a super accurate computer game history buff,
    00:34:36,552you might even say,
    00:34:37,399"Well, it was in the '80s.
    00:34:39,109"You only had, sometimes, eight colors.
    00:34:43,485"We're talking CGA monitors here, people."
    00:34:50,227And then by the time you got to Super Nintendo,
    00:34:52,028you had 256 colors, which is a lot better.
    00:34:55,650So this is starting to look pretty cool, right?
    00:34:58,337Alright, so I'll show you kind of the next step of this.
    00:35:01,607So then what I did was I took this.
    00:35:04,011So here's my Waterfall comp.
    00:35:05,719Let's make a new comp real quick
    00:35:07,377and we'll just call this Scene.
    00:35:09,990And what I did was I got this very nice picture
    00:35:15,988off of the Creative Commons search engine on Flickr.
    00:35:18,735And I'm just gonna darken this real quick.
    00:35:20,790I'm not gonna do all of the compositing in this
    00:35:22,988because it would make the tutorial much, much longer
    00:35:25,576than it's already going to be.
    00:35:27,389I'm just gonna darken a little bit
    00:35:28,397and then I'm gonna take my Waterfall pre-comp
    00:35:33,128and I'm gonna put it over here.
    00:35:36,216And I'm just gonna tone back the transparency
    00:35:38,566just a little bit.
    00:35:39,426Maybe to 80% or maybe 90%.
    00:35:42,177Just a little.
    00:35:44,486And so you can see that I can stick this wherever I want.
    00:35:48,121I wanted it to kind of come over this ridge here,
    00:35:51,257but I want it to look
    00:35:52,132like it's actually coming over the ridge.
    00:35:54,875And right now, it's just got this straight line edge,
    00:35:57,901which isn't gonna work.
    00:35:58,734So what I figured I would do
    00:36:00,899is I'd use a Mesh Warp,
    00:36:03,216which is an awesome effect.
    00:36:04,458It's in the Distort group.
    00:36:06,084Mesh Warp.
    00:36:07,828And it gives you this mesh
    00:36:09,023and you can pull points around and stuff.
    00:36:11,061And the problem is you can see that the mesh
    00:36:14,020goes all the way over all this empty stuff
    00:36:17,076that you don't need.
    00:36:18,364And so if all I want to do is change this top edge,
    00:36:22,109it's gonna be a pain
    00:36:22,997because it's like,
    00:36:24,111"Okay well, I have all this extra garbage
    00:36:27,216"out here I don't need."
    00:36:28,319So what I usually do if I'm gonna do a Mesh Warp--
    00:36:30,666Let me delete that effect for a minute.
    00:36:32,688Is I first crop the comp,
    00:36:34,617so it's only what I need.
    00:36:36,276So let me go back into this comp for a minute.
    00:36:38,265And here's how you crop a comp in After Effects.
    00:36:41,236If you didn't know, you click this button here.
    00:36:43,969Region of Interest.
    00:36:45,952This is one of these things that's like,
    00:36:47,882I don't know.
    00:36:48,715I don't even remember how I heard about it.
    00:36:51,870But most people don't use it,
    00:36:53,044most people don't know about it.
    00:36:54,399You set the Region of Interest on your comp
    00:36:56,761and what it actually does
    00:36:58,126is it tells After Effects
    00:36:59,414this is the only part of my comp to render.
    00:37:01,847In Nuke, Region of Interest is actually a pretty big deal,
    00:37:04,892but in After Effects, it gets forgotten a lot.
    00:37:06,675Once you set that,
    00:37:07,881you can now go to Composition,
    00:37:10,935Crop Comp to Region of Interest,
    00:37:14,101and it crops your comp for you, which is awesome.
    00:37:16,805The best part about that now
    00:37:18,060is that back in my scene,
    00:37:21,399that comp is only that big.
    00:37:24,017And so if I add a Mesh Warp,
    00:37:25,519the Mesh Warp is only that big,
    00:37:27,390and so now I don't even need all these rows and stuff.
    00:37:29,482Maybe we'll do two rows with three comps.
    00:37:34,365That's all the detail we really need.
    00:37:36,373And let's scale it down a little bit
    00:37:39,844and let me turn the transparency way down for a minute
    00:37:42,245and zoom in here.
    00:37:44,196And I kinda move this roughly into place.
    00:37:46,781And then now with the Mesh Warp,
    00:37:48,736you can just kinda grab the points of it like this.
    00:37:53,205And each point has a bezier handle,
    00:37:55,158so you can kinda smooth out.
    00:37:59,558They need to update this effect though.
    00:38:00,874Boy is it a slow moving effect,
    00:38:05,100and it's kinda buggy.
    00:38:07,601There we go.
    00:38:11,768Okay, and I can adjust that and adjust that.
    00:38:14,760And I'm just trying to roughly get this waterfall
    00:38:19,341to look like it's coming over that ridge there.
    00:38:22,107There we go, cool.
    00:38:23,965And then, let me zoom out here.
    00:38:27,111And then you can also use it
    00:38:29,029to kind of add a little more variation.
    00:38:34,044And I know that I do want the water
    00:38:35,994to reach all the way down to where the ocean is,
    00:38:39,997so let's pull it down there a little bit.
    00:38:42,488Cool.
    00:38:43,338Alright, and then we'll turn this back up to 90.
    00:38:48,293Not 100, but 90.
    00:38:51,833Alright.
    00:38:53,213And now we'll do a quick little RAM Preview,
    00:38:55,511we'll take a look at this.
    00:38:56,463And so this is kinda the beginnings of your waterfall.
    00:39:03,105And it's actually not working too, too bad.
    00:39:05,268But there's not a ton of detail in it,
    00:39:06,830so then what I did was I duplicated this.
    00:39:09,955Let's delete the Mesh Warp on the copy
    00:39:13,164and scale this one down a little bit.
    00:39:15,800And actually, to get more variation in it,
    00:39:18,289maybe I'll flip it horizontally
    00:39:21,565and I'll kinda move this one over here
    00:39:25,940and maybe scale it so it's a little bit wider.
    00:39:29,993It's shorter, but it's a little bit wider.
    00:39:32,574And then I can play around with the Transfer Modes too,
    00:39:35,189maybe Lighter Color.
    00:39:39,070No, 'cause then you're seeing the mountain through it.
    00:39:42,465So let's just leave it on normal for now.
    00:39:44,292And then I probably do want a little bit
    00:39:46,125of a Mesh Warp on there
    00:39:47,365and we'll just keep this simple,
    00:39:48,793two and two,
    00:39:50,209just so I can get a little bit of a bend to it,
    00:39:52,224so it's not so perfect.
    00:39:59,451Cool.
    00:40:00,284And then I definitely wanna offset the timing of it,
    00:40:03,259so that it's not perfectly in sync with this top one.
    00:40:08,083And now what I might do is put a mask on it
    00:40:10,334because this top edge is like such a hard edge,
    00:40:14,658so I'm just gonna mask it out.
    00:40:16,599And I'm hitting the f key.
    00:40:17,907Once you draw a mask, if you hit f,
    00:40:19,867it brings up the Mask Feather property,
    00:40:21,903but it also lets you click this Inverted button.
    00:40:24,567So now I'm only seeing what is not masked
    00:40:27,539and now I can feather that in a little bit.
    00:40:31,559And with that mask on there and with the feather,
    00:40:34,345I can Mesh Warp it a little bit,
    00:40:36,147and I can even come back into this first one here
    00:40:40,336and Mesh Warp this one a little bit.
    00:40:42,262And I'm just trying to blend these two pieces together
    00:40:45,705and then, hey, why don't I duplicate this one
    00:40:50,510and make a really kind of small
    00:40:53,156little piece of a waterfall back here.
    00:40:56,990And I'm gonna copy and paste the mask from this layer
    00:41:00,384onto this new one I just did.
    00:41:03,993And then I'll just kinda maybe
    00:41:06,206just play with the scale a little bit,
    00:41:07,985just so it just looks like
    00:41:09,765there's something extra back there.
    00:41:11,674Let me stick that way in the back.
    00:41:13,356There we go.
    00:41:15,290And then let me offset it a little bit
    00:41:16,902so it's not perfectly in line with the other two.
    00:41:23,013Cool.
    00:41:24,080Alright, so this is sort of the workflow
    00:41:27,264and it kinda looks okay.
    00:41:32,008And really, the more detail you put into it, the better.
    00:41:37,220If you look at this example here,
    00:41:39,176there's a lot more turbulence to it
    00:41:42,865and so that's one thing that might be cool
    00:41:44,815to actually go back
    00:41:45,648and see if we can get more turbulence out of it.
    00:41:48,735And here I'll just show you
    00:41:49,876how quick and easy that is, actually,
    00:41:51,307if we just come back to--
    00:41:53,460Let's see, so it's not in this comp,
    00:41:55,614so it must be in the comp that's labeled 02.
    00:41:58,779Yep, there it is.
    00:41:59,733And why don't we just up the amount
    00:42:03,966of the displacement and we can play with the size and stuff.
    00:42:06,849Now, what I don't want to happen.
    00:42:09,043You see how we're getting all these little
    00:42:11,846kind of disconnected pieces here, right?
    00:42:15,541And so I'm gonna sort of play with the amount
    00:42:19,000until that doesn't happen too much.
    00:42:21,760The amount and the size.
    00:42:23,187Maybe a bigger size.
    00:42:24,750That's better.
    00:42:26,678Let me try something like that.
    00:42:28,335Alright, and then if we look in the comp, 03,
    00:42:31,120you can see now it's a lot more turbulent looking.
    00:42:33,743So now let me set this to Full,
    00:42:37,862Command + Option + S,
    00:42:40,212and we'll just save over that Photoshop file, replace it,
    00:42:45,821and then Reload.
    00:42:49,491And then we'll just go back here,
    00:42:52,071and now--
    00:42:52,904Oh boy, that is way better.
    00:42:55,081That's way better, right?
    00:42:56,939And you know, some of the things
    00:42:58,849that are kind of giving it away are like this hard edge here
    00:43:02,185and I don't know, it depends on kind of
    00:43:03,941what your background image is
    00:43:04,781and how transparent the water is and other things.
    00:43:07,147Maybe that's okay, but you can always--
    00:43:10,796That's actually kinda cool.
    00:43:11,797You can always come back into your Waterfall comp
    00:43:14,671and figure out which piece that is.
    00:43:17,678That looks like this piece here.
    00:43:21,724And you could do the same thing I just did.
    00:43:23,237You could grab a Mask,
    00:43:24,821mask out the top.
    00:43:27,055You can see the computer's starting to chug,
    00:43:29,989it's starting to hurt.
    00:43:31,862Hit f, Invert the Mask,
    00:43:33,874and then put like a 25 pixel feather on there.
    00:43:37,147Maybe a little more, maybe 50.
    00:43:41,234And something interesting is happening.
    00:43:42,990It's not actually feathering
    00:43:44,681and I'm guessing that's because--
    00:43:46,494Whoa, there's an extra Colorama effect on this guy.
    00:43:50,895We don't want that, let's get rid of that.
    00:43:53,989Oh boy, we've got extra Coloramas that we didn't need.
    00:44:00,383So this Mask doesn't seem to be working the way I'd hoped,
    00:44:03,701so let me troubleshoot that real quick.
    00:44:05,201Let's turn Colorama off.
    00:44:06,585Obviously, it works with that off
    00:44:08,601and I'm guessing it's because Modify Alpha is turned on.
    00:44:13,108If I turn it off, we're not gonna get the result we want.
    00:44:16,790Alright, so in this case,
    00:44:18,467because the Colorama is on this layer
    00:44:21,417and it's interacting with the Alpha Channel,
    00:44:24,436if I put a Mask on this, it kinda screws things up.
    00:44:26,591So an easy kind of solution is let's make a new layer,
    00:44:30,325just Command + Y, make a new layer.
    00:44:32,760Temporarily set it to Adjustment Layer
    00:44:35,011and then put the Mask on that layer.
    00:44:37,798And then, let's just rename this layer MATTE
    00:44:41,075and select the layer that you want the mask on
    00:44:44,019and just tell it to use this new layer you just made
    00:44:46,830as an Alpha Matte.
    00:44:48,766Now I can do the same thing.
    00:44:49,977Hit f on the MATTE, Invert it,
    00:44:53,254and blur it 30 pixels,
    00:44:56,088and now we can turn all those other layers back on.
    00:45:00,107You can see now it's blending in there.
    00:45:02,871So you can also do that
    00:45:04,195and kind of blend your pieces together.
    00:45:07,725And so you won't have these awful, hard edges.
    00:45:12,059And some of that is sort of okay,
    00:45:15,075especially if you're going for this 8-bit color cycling look
    00:45:17,888because all those little funky visual artifacts
    00:45:22,728kind of happened in those games a lot of the times.
    00:45:27,740One of the next steps I would do
    00:45:29,193is just pre-comp all of this.
    00:45:30,996Call it Waterfall.
    00:45:32,526And that way, you can do things like...
    00:45:38,221Here, let me show you.
    00:45:39,854I'll show you a little bit more.
    00:45:41,873Why not?
    00:45:42,706We've gone this far.
    00:45:43,566I'm gonna add an Adjustment Layer over this whole shebang
    00:45:47,268because now if I wanna start actually comping this in there
    00:45:51,572and trying to see how it's gonna look,
    00:45:53,180it'll be easier if I can get a better sense
    00:45:55,587of what the final thing's gonna look like.
    00:45:57,226So what I'm gonna do is add an Adjustment Layer
    00:45:59,640and because we're going for pixel art here,
    00:46:02,286there's a great effect called Mosaic in the Stylize group.
    00:46:06,443Mosaic.
    00:46:07,635And by default, it gives you this 10 by 10 mosaic.
    00:46:10,938I'm gonna make it--
    00:46:12,087Now, what I was gonna originally do was 320 by 240
    00:46:15,164because that was kind of the default resolution of games,
    00:46:18,048but computer monitors,
    00:46:19,486a lot of people, especially if you're my age...
    00:46:23,718Computer monitors, if you remember,
    00:46:25,225used to not be rectangular shaped,
    00:46:27,637they were more square shaped.
    00:46:28,662They were four by three, like old TVs.
    00:46:31,444So 320 by 240 would be a four by three ratio.
    00:46:34,668If we want 16 by 9,
    00:46:37,133I think it's more like 360 by 240 or something like that.
    00:46:40,799And then if you click Sharp Colors,
    00:46:44,234it basically--
    00:46:45,966If you don't have this on, it's a subtle difference, but--
    00:46:49,636Excuse me, I have a frog in my throat.
    00:46:52,864If you don't have this on,
    00:46:54,160it looks like it's doing some filtering to the image
    00:46:56,849and it sort of softens it.
    00:46:58,199If you turn that back on,
    00:46:59,196it makes it very crisp and hard, like an old computer game.
    00:47:02,686And you can see that, already,
    00:47:04,569it's sort of giving that waterfall a more computery look.
    00:47:07,790See, if I turn that Adjustment Layer off,
    00:47:09,765it's nice and smooth.
    00:47:10,752And if I turn it back on, it looks very pixely.
    00:47:13,201On top of that, what I'm gonna do
    00:47:15,464is I'm gonna go to Stylize and hit Posterize,
    00:47:19,098and that's gonna take away a lot of the color.
    00:47:23,615So right now, what it's doing,
    00:47:25,710it's only allowing seven colors to exist, basically,
    00:47:31,909and that's not enough.
    00:47:32,742Let's set that to 16.
    00:47:34,508And so that sort of 16,
    00:47:37,204I believe, is like Super Nintendo level.
    00:47:40,271And back in the day, I gotta tell you,
    00:47:41,908that was pretty cutting edge.
    00:47:42,811So then, now that the waterfall is all on one layer,
    00:47:47,964you can grab your Mask tool,
    00:47:49,422you can mask it out.
    00:47:51,517Oh boy, computer is starting to feel pain.
    00:47:55,040And in this situation,
    00:47:57,724part of the reason that it's chugging
    00:47:59,290is also because I'm screen recording at the same time,
    00:48:01,310but it's not a bad idea.
    00:48:04,072Once you get your waterfall exactly how you want it,
    00:48:06,309you can pre-render it.
    00:48:08,007And if you don't know how to do that,
    00:48:09,339maybe I'll show you guys how to do that in another tutorial.
    00:48:12,454So let me take the Mask I just drew now.
    00:48:14,850I'm gonna select it.
    00:48:15,794I'm just gonna hit Shift and the Down Arrow
    00:48:17,694and just nudge it down,
    00:48:18,922so it's kind of closer to the water there.
    00:48:21,732And I'll feather the edge a little bit,
    00:48:23,821but I'm not terribly concerned with it
    00:48:26,020because I knew going in I was gonna create some ripples,
    00:48:30,259I was gonna create some of that splash.
    00:48:32,189And I did all of that stuff
    00:48:34,241exactly the same way, and you can see.
    00:48:36,686It's so funny.
    00:48:37,543Whenever I make these tutorials,
    00:48:38,558I do it first and then I'll show you guys how to do it,
    00:48:42,533and it always looks better, I think,
    00:48:44,114when I show you 'cause it's the second time I've done it.
    00:48:46,592I think that looks way better.
    00:48:48,135So, yeah, there you go.
    00:48:51,041We're getting something now, people.
    00:48:53,288So, you can see though,
    00:48:54,348with the combination of the pixelization,
    00:48:56,837the Posterizing, layering these things,
    00:49:00,167and maybe feathering some of the layers into each other,
    00:49:02,247you're getting a pretty good result.
    00:49:04,934And this is just one layer of stuff happening,
    00:49:08,199this doesn't even have our little ripples down here
    00:49:13,513and kind of the steam coming off the water, the splash.
    00:49:17,875And of course, I did a lot of other things.
    00:49:19,784I color corrected the mountains
    00:49:22,709and I added a different sky
    00:49:25,256because this sky kinda looks like crap
    00:49:27,943when you Posterize it.
    00:49:29,595But this waterfall is way better.
    00:49:31,245So anyway, I hope through all of my rambling
    00:49:35,163and creating this sort of one-off,
    00:49:36,977almost useless in the real world effect,
    00:49:39,962I hope that you can kind of get a little glimpse
    00:49:43,627at at least the way my brain works
    00:49:45,905with how I approach creating an effect
    00:49:48,959I've never created before.
    00:49:51,344I swear to you I did not know how to do this before,
    00:49:53,772I did it today to come up with this tutorial.
    00:49:57,057And it's really just learning
    00:49:59,088how to observe other people's work
    00:50:01,842and breaking it down into small pieces
    00:50:04,457that you do know how to do.
    00:50:06,582If you look at this,
    00:50:09,431just all by itself, the first time you see it,
    00:50:12,786it's kind of overwhelming.
    00:50:13,783It's like I have no idea how you would even approach that,
    00:50:15,842but I slowed it way down.
    00:50:17,806Luckily, this artist was nice enough
    00:50:19,376to create these buttons so you could slow things down.
    00:50:21,859And I really looked at the palette
    00:50:23,988and I just stared at it.
    00:50:25,476I said, "Oh look, it's the same colors just cycling.
    00:50:27,500"Hey, what effect in After Effects would let me do that?
    00:50:30,870"Oh my gosh, there's a Colorama effect."
    00:50:32,872And I just built on it and built on it
    00:50:35,346until you get something like this.
    00:50:37,939And one other thing I completely forgot to mention,
    00:50:40,938which is just a quick thing.
    00:50:43,306Is let's go back to this comp here
    00:50:45,211and let's look at the Colorama effect here.
    00:50:47,604And one thing that's kind of cool--
    00:50:49,394So if I just RAM Preview this,
    00:50:51,661you'll notice that if you look at the white part,
    00:50:54,778which is sort of the foamy leading edge of the water
    00:50:57,182that shows you that it's moving,
    00:50:59,012there's only one on each piece at a time.
    00:51:02,769And that's because if you go to the Output Cycle,
    00:51:05,643the default setting for this Output Cycle
    00:51:07,719is there's one Repetition,
    00:51:09,523but you can increase that.
    00:51:11,936You can make that as many as you want.
    00:51:13,174I just increased it to five and that's too many.
    00:51:15,403Let's increase it to two.
    00:51:16,910And so what that's gonna do
    00:51:19,103is it's going to create more than one of these edges
    00:51:23,298and it's gonna kind of increase the speed of it,
    00:51:27,978but it's also gonna increase the frequency of those colors,
    00:51:30,532which could be interesting.
    00:51:32,122It might make it look a little bit more turbulent.
    00:51:33,989You can also set this to less than one.
    00:51:38,072And so then it sort of spreads the colors out more.
    00:51:43,480And so now it maybe slows down the animation a little bit.
    00:51:50,738And for a waterfall, who knows,
    00:51:52,157maybe that's what you want.
    00:51:53,520And the great thing is you can always just do that
    00:51:57,063and then come here and RAM Preview it
    00:51:58,900and see what it looks like.
    00:52:01,300And that's one of the things I love about After Effects,
    00:52:05,026is that it's pretty easy
    00:52:06,601to set up this complex chain of things
    00:52:09,679that you just go back a few comps,
    00:52:12,187change one thing and now you get something like this.
    00:52:15,288So anyway, I'll stop talking now.
    00:52:17,651Thank you guys so much for hanging out
    00:52:19,637and I hope this was cool.
    00:52:20,812I hope you learned some tricks
    00:52:22,278and maybe, I don't know,
    00:52:23,492I bet a bunch of you have never used Colorama before,
    00:52:25,344so hopefully now you know what it does
    00:52:27,778and you're not afraid of it.
    00:52:29,040And on top of that,
    00:52:30,638I wanna say that I hope you guys
    00:52:32,712experiment with After Effects
    00:52:34,473and try to figure out how to do things
    00:52:36,296you've never done before.
    00:52:37,604So thank you guys so much, I will see you next time.
    00:52:40,763Thank you so much for watching, I hope that was cool.
    00:52:42,946And maybe 8-bit color cycling will actually come in handy,
    00:52:46,044but hopefully what you'll really learn
    00:52:47,440are some strategies on how to troubleshoot
    00:52:49,617and figure out new things in After Effects.
    00:52:51,362If you have any questions or thoughts
    00:52:53,226about this lesson, definitely let us know.
    00:52:55,097And if you learned something valuable from this,
    00:52:57,391please share it around.
    00:52:58,531It really helps us spread the word about School of Motion
    00:53:01,003and we appreciate it more than words.
    00:53:03,977Don't forget to sign up for a free student account
    00:53:05,923to access the project files from the lesson you just watched
    00:53:08,878and I'll see you next time.
    00:53:10,400Peace!