Start learning with our library of video tutorials taught by experts. Get started

Animation Tips and Tricks with Flash Professional
Illustration by John Hersey

Lighting a 3D shot


From:

Animation Tips and Tricks with Flash Professional

with Dermot O' Connor

Video: Lighting a 3D shot

So now we have our scene with our little phony 3D camera move into the shot, and then the next step would be to just add a few details and things to bring it to life. To completely finish this scene obviously will take a bit of time. So what I'm going to do is, instead of showing you the entire procedure, I'll show you the general process of how I would go about finishing this. So let's click into the scene. I am going to actually delete the old layers just to make some room in here. So we are moving through.
Expand all | Collapse all
  1. 6m 35s
    1. Welcome
      1m 4s
    2. Using the exercise files
      51s
    3. Common keystrokes and shortcuts used in this course
      4m 40s
  2. 1h 24m
    1. Understanding video versus SWF
      2m 30s
    2. Overview of shortcuts, extensions, and setup
      6m 27s
    3. Understanding linear and radial gradients
      2m 39s
    4. Overlapping and animating the colors
      3m 53s
    5. Lighting a scene
      10m 24s
    6. Creating lens flares
      10m 40s
    7. Animating ripples
      7m 2s
    8. Creating a gradient globe
      11m 41s
    9. Creating a gradient bottle
      10m 26s
    10. Applying gradients to a character's eye
      10m 2s
    11. Applying gradients to a character's skull
      8m 49s
  3. 56m 53s
    1. Tweening a circle to a square
      10m 9s
    2. Using thumbnails
      4m 39s
    3. Animating a magic carpet jump
      10m 12s
    4. Setting up a magic carpet walk cycle
      7m 41s
    5. Animating a magic carpet walk cycle
      9m 33s
    6. Shape tweening hair
      3m 50s
    7. Intro to overlapping hair
      1m 57s
    8. Animating overlapping hair
      8m 52s
  4. 1h 8m
    1. Animating waves
      8m 7s
    2. Animating clouds
      7m 48s
    3. Animating a flame
      11m 38s
    4. Animating an explosion
      9m 1s
    5. Adding in-betweens to the explosion
      4m 36s
    6. Adding explosion clusters
      6m 43s
    7. Optimizing the explosion
      7m 30s
    8. Animating smoke with particles
      12m 45s
  5. 32m 18s
    1. Introduction to staggers
      1m 5s
    2. Animating a simple stagger
      5m 8s
    3. Animating a diving board
      6m 15s
    4. Animating a tremor
      5m 56s
    5. Animating a scream
      7m 12s
    6. Refining the scream
      6m 42s
  6. 47m 49s
    1. Introduction to Virtual Camera
      5m 4s
    2. Animating parallax
      6m 9s
    3. Animating a crane shot
      6m 26s
    4. Animating a zoom and rotate shot
      9m 30s
    5. Animating a track shot
      11m 0s
    6. Lighting a 3D shot
      9m 40s
  7. 19m 48s
    1. Animating a cross dissolve
      6m 10s
    2. Animating a wipe
      3m 34s
    3. Animating a fadeout
      10m 4s
  8. 20s
    1. Goodbye
      20s

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
Please wait...
Animation Tips and Tricks with Flash Professional
5h 16m Intermediate Aug 09, 2011

Viewers: in countries Watching now:

In this course, author Dermot O' Connor introduces a variety of real-world issues that animators commonly encounter and offers practical solutions to them in Flash. The course covers how to apply gradients to create subtle texture and light characters, reducing the flat look of most cartoons; how to simulate natural phenomenon such as wind, fire, and clouds; how to mimic 3D space; and how to add fades and transitions to create custom cuts between scenes. The course also includes a look at staggers, which can be used to create camera shake, tremor effects, and extreme character reactions.

Topics include:
  • Overlapping and animating colors
  • Creating lens flares
  • Animating hair with shape tweens
  • Animating an explosion
  • Animating smoke with particles
  • Animating a scream
  • Using Virtual Cam
  • Lighting a 3D shot
  • Animating cross dissolves
Subjects:
3D + Animation Animation
Software:
Flash Professional
Author:
Dermot O' Connor

Lighting a 3D shot

So now we have our scene with our little phony 3D camera move into the shot, and then the next step would be to just add a few details and things to bring it to life. To completely finish this scene obviously will take a bit of time. So what I'm going to do is, instead of showing you the entire procedure, I'll show you the general process of how I would go about finishing this. So let's click into the scene. I am going to actually delete the old layers just to make some room in here. So we are moving through.

First things first: let's look at the background, and I want to see the entire area. So View>Pasteboard, or Workarea if you're in an older version of Flash, and here is our background; very minimal. I mean there are lots of things we can do to add lines and details to the background. Maybe some doors at the end, and windows and so forth, maybe some roof tiles, and whatnot. But for now I am going to do something a little more basic. I am going to make a new layer, hold down the Alt key, and drag the background, and just make it a full color.

Anything will do for now. And in our Color panel I'm going to go to radial gradient. And this is what we covered in chapter 1, if you're unfamiliar with this. The Gradient Transform tool over here, F; we click on that, and you'll see probably a different gradient depending on whatever last gradient you were playing with. But don't worry, over here we can control the number of colors we have, and where we put the different colors. So I am going to click on the center widget and just drag it roughly around to about here and you can then rotate this out.

Now I want the middle of the scene to be brighter. So I am going to pick a nice bright color, and let's make it a warmer color, something reddish maybe. I know you can't see much right now, because it's so transparent. So this second color here, let's drag that to somewhere. And again, make sure you have selected this H on your color, and let's make that a warm, maybe darker though. So we will bring it down. It's looking nice. And we will fade out to blue, a cooler color, on the outer side.

Let's make these a little more transparent. So I am clicking on the leftmost one, which corresponds to the center of the gradient. Let's bring it down to about 8% and we will bring down the middle one to about, let's try 40%. And look at the difference just with the addition of one simple gradient. It's, you know, with not much time or effort put into it; it's already getting us away from that flat, flashy look. So the next thing I'll show you is how to take one of these cubes, and approach the treatment of lining it.

So I'm going to double-click on that symbol to go into it, and let's make a layer on top. Actually, what I will do is I will duplicate the artwork. So hold down the Alt key and drag, and you will see little plus sign, and let's just padlock and guide out the layer beneath. So it's safely tucked away just in case anything goes wrong. Just go in closer. And I am going to use the Line tool, or N, to simply put some lines on the object. I am just taking care to watch the perspective.

So what I'm going to do here is refine the shape of the object, and it's nice if you can put some little tiny breaks in the silhouette. It will stop it from looking like that little empty cube. And there's going to be some vertical boards here breaking up the shape a little bit. We are not going to spend too long on this, but I will just do enough to give you the idea of the general process. It's pretty basic stuff really. This is the kind of the skill level that you learn in any of the introductory essentials courses at lynda.com.

We are just making lines, filling spaces, and we are going to paint them in. That should be most of them. Now what I want to do is find some different colors to paint inside these areas. So I am going to select, using the Dropper tool; that's this guy. Click that color. It appears here. I am going to pick a darker variant of that, and then just drop that in here. Oops! There is an open gap there somewhere. Let me close that. So what I am going to do instead is select the Fill tool, and tell it to close small gaps, and that took care of that.

Normally, I'd go in and zoom in and really fix that, but we are okay to do this. At the bottom, this, I would like it be a highlight. So again, Eye Dropper tool, select that color, pick a brighter version, and there we go. The same process here; Eye Dropper, select that color, pick a darker one, and drop the darker one in here. And we will put a slightly lighter version of that brown at the bottom. It might be too bright; bring it in. So that's it, and last step: get rid of this.

Delete or Control+X. We don't need that. Double-click on the line to select it all, and this one to get rid of it. And now we have something that looks, like, a little more interesting than our primitive geometry. The next thing, well last thing, really, is to put some gradients on here. So I am going to make two layers. One layer will basically correspond to the front of the box, and I am just Shift+Clicking to select everything here. Control+C, Control+Shift+D in the top layer, and the same process for the shadow part. Control+C, and then in the empty layer Control+Shift+V. So let me padlock our art layer. And on this layer here, which you are seeing now in pink, I am going to make it just a solid color.

I will swap the colors just to do that, or you could just pick any color from the picker here. And now we will go to this area in the color palette and select radial gradient. And it will probably apply some other gradient; the last gradient that we were working on. Now it's just a question of positioning the radial gradient for maximum effect, and I am just going to use the various widgets And again, we covered this in greater detail in Chapter 1. So if you are having trouble following along with this, you might want to have a look in there and see how we did all this.

Now remember basic color theory. It's nice if you have a reddish, brownish color with a gradient that's maybe in a different color family. So I'm going to try to pick a darker blue to really contrast with the orange color, or the brown color, of the box. And maybe we will go with a warmer color for the top there, and this can be pretty subtle. I am going to bring the light of these three, this one now down to 5%; we will make this one a little lower, maybe about 20.

The back one can be pretty dark, falling off into shadow. I am going to actually make it a little darker too. So that's that, and now padlock that, and now go to the background layer. The same thing. I would like to paint this in a radial gradient as well, and the thing is painted with its controls off the edge of the Stage. So Gradient Transform tool, and let's just pull it in. And you might want to have this side illuminated as if it's been hit by a spotlight off the edge of the Stage or something.

So we can play with these positions as well to soften that. And you can, of course, play with the opacity. I am moving pretty fast now. I am just going in, and really no point in calling out colors and opacities anymore. It's really just to give you an idea about how you proceed through creating the colors for this. So there we go! Already somewhat more interesting than the for default. So that's the process of how I would go in and apply the gradient skills previously covered, and some of the lighting issues to creating a scene that's a little more dynamic.

And as you can see, they still move fine. And the only other thing I would probably suggest would be maybe a slightly bolder gradient, maybe with some other lights, maybe behind these boxes. But once you apply more and more of the line work, let me show you the finished result. And here we have the scene completely polished. It's doing exactly the same thing that we have just being seeing in the previous one. All I have done is I have added a lot more line work to the crates. I have repeated the process that you just witnessed with the crate on all five of them.

If you look inside the scene, it's actually surprisingly simple. So I will just very quickly take you through it. There is our lined background. And we have our boxes; I just added a slightly transparent shadow beneath them, but they all have the same gradient trick. There is a, I call it, air. It's really the light level that gives us the dropoff, and creates the illusion of a shadow towards the end of the screen. And then the various crates are deployed on top of that so that they pop out against that layer. If I wanted to, for example, darken them, I would just move that layer up, and then we could darken the layer, or even add a second layer if we think we can get away with it, for different effects.

So, for example, if I wanted to make it stronger, select that layer, and I would simply change the opacity settings of the different parts of the gradient, and do some really drastic alterations to the scene. So it's great fun to have the ability to light scenes, and I think too many of us, when we use Flash, we resign to this very flat, everything is evenly colored, which is after a while that does get a bit boring. So I have been having a lot of fun just messing around with these gradient effects, trying to bring another level to the scenes.

So even though this technically isn't a part of teaching you how to do a tracking shot, I think it's a very important component of making the tracking shots look cool. So I think, with that, we are done with moving the camera around our little fake 3D Flash space.

There are currently no FAQs about Animation Tips and Tricks with Flash Professional.

Share a link to this course
Please wait... Please wait...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

Upgrade now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Animation Tips and Tricks with Flash Professional.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Welcome to the redesigned course page.

We’ve moved some things around, and now you can



Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked