go to previous page

- discuss this tutorial -

go to next page

2. Drawing A Part of the Car in Detail

When it comes to detail, the right headlight was a piece of cake, but its shading was the hardest part to get right of the whole vector, so I’ll go trough the creation of this thing in detail.

2.1 Get familiar with the reference

(03 Headlight cutout) So this was the living hell for me. Doesn’t look all that intimidating, now does it? However, this part had some nasty reflections on it, so it wasn’t all that easy to recreate those.
So, before I do anything, I take a minute or two to just look at the reference. I do this, because to me, getting a photo realistic vector to look, well, photo realistic, you have to see ‘right’ i.e. you have to a) suck every detail in and b) you have to know where some parts blend together and fade into black, but at the same time, you have to treat them as being separate, even if two become one, so to speak. And this is what I did. I tried to visualize the reference as gradients, tried to see where colors change and stuff like that. The most important thing, though, is to estimate which shape lays on top and which at the bottom.

2.2 – The outlines

Now that I know how things could work out for me, I start outlining. First thing to do is to create a new layer and place it on top of the reference layer.By double clicking on the little square next to the layer’s name in the timeline (04 Switch to outline mode) the layer Properties panel pops up.

In this panel, I’ll change the outline color of every path on that layer to a flashy one, to make sure that I can still see them. (05 Layer Properties)

Now I grab the line tool and start ‘separating colors from each other. You can use the pen tool, too for this, but for me, the line tool works a lot faster. Using it is pretty simple, too. You draw a straight line from one point to another, then you select the selection tool and modify the line (i.e. making a curve of it etc.) until you got what you need.
These are my outlines on the base layer:

As you can see, I already made little sections inside the main outlines (08 Outline sections) these are for coloring later. At this stage, the main outlines are the most important ones.

2.3 Applying color

The next step is coloring. I do this always right away, even if I know that I’ll have more than just this single layer, because with the first basic colors/gradients applied, I know where I have to improve things on the other layers to get the photo realistic look.
The base layer usually only consists of simple gradient and radial gradients i.e. it’s actually a really rough approach to the vector.
Before I start coloring, though, I always clear all the swatches from the color swatches panel.

This is optional, but I like it better this way, because otherwise, I might lose track of my colors.
Next, I start applying gradient fills to the outlines. You have to options here:

you pick up all the colors for one gradient and adjust there spread in the color mixer panel or

you divide one shape into smaller sections like I did.

I always choose the latter, because the first way can get really messy, depending on how many colors I have to apply to a gradient. With the little sections, I only have to pick up to colors for each gradient and to keep them in the correct order.

So, why did I make the sections like I did? Well, that’s actually pretty simple: I look very closely at the reference and observe where the colors change: (10 Color Change) In the middle of this, I put down a line to separate the different sections.

With the eyedropper tool, I pick the first two colors for my first gradient and safe them in the color swatches panel. Then I switch to the color mixer panel, then I set up the gradient and finally fill the shape with the gradient.
The result is pretty much a ‘default’ gradient, but I need to transform it so that it fits the reference. The only way to do this is to use the gradient transform tool. Grab it from the tool box and click on the gradient you just applied: With this tool, you can resize and rotate the gradient. All I got to do now is to modify it till it fits, like I said before.

For the other sections, the first color will always be the one with which the preceding section ended, so I only have to pick the color with which the current section ended. This is pretty simple and straight forward and the only thing I really have to take care of is to keep track of the order of swatches in my color swatches palette. If I don’t, things can get messed up pretty badly. And by using the transformation tool I modify the gradients until they blend well together.

I color everything else the same way. Sometimes, always depending on the shape and the reference, I have to fill shapes with a radial gradient, but the technique stays the same. When everything’s filled with gradients, I select the outlines and delete them.

Up to this point, the base layer looks like this:

2.4 Complex Shading

What I have so far looks nothing like the reference picture, but for only having one layer so far, it doesn’t look too bad.

Anyway, to include the more complex shades and highlights into my vector, I need some more layers. But before we get to those, let me show you a nice trick Flash has to offer when it comes to gradients: In the color mixer palette you have the option to reduce the opacity of a color (or two in case you’re setting up a gradient). This way you can make complex gradients without overlaying the base colors .

The next thing is to determine where I need additional shading/highlighting:

Now back to the base layer. I outline some parts of the headlight again by clicking once on those parts. Then I select the new created lines, copy them and delete them right away. On the next layer, I right-click and select ‘paste in place’ from the drop down menu, to paste the copied lines at the exact same place.

From this point I can estimate how many layers I’ll need (3 including the second one) to get as close as possible to the reference picture. I lock the second layer, create two new ones, repeat the copy and paste procedure and delete outlines which I no longer need on the new layers.

To determine which outlines are needed and which aren’t, I try to think in layers while looking at the reference, i.e. I try to figure out which is the correct order for the shades/highlights.

The actual coloring process is nothing else than the one used for the basic gradient shapes, except the fact that I use only one solid color in the gradient and the other one with opacity set to 0% (I always set the second color to white, since it’s not important anymore). After I’ve applied all the gradients I start to transform them with the gradient transformation tool. While I’m at it, I always check back on the reference, just to see if I’m going into the right direction with the gradients.

After all outlines are deleted I’m finished with this part of the car. (18 Headlights final)

go to previous page

- discuss this tutorial -

go to next page