The Internet world exploded with the news of the Apple tablet launch last week. Named the iPad, it’s set to bring yet another revolution to the way people access and browse the web. An iPad icon would be a sensible addition to any web designer’s resources toolbox, so let’s fire up Photoshop and create our very own detailed iPad icon graphic.

The icon we’ll be creating features the typical front view of the iPad. Using the Apple website for reference, let’s get started.

Create a new document, and use the Rounded Rectangle Tool to draw a portrait shape onto a new layer. Set the corner radius to 20px and the fill to white.

CMD-click on the layer thumbnail to load the selection, then go to Select > Modify > Contract and enter 3px. Create a new layer and fill this new selection with black.

Double click the first layer, with the white rectangle to open up the Layer Style options. Add a grey Inner Glow just 3px in size, with the blend mode of Normal.

Next, double click the black rectangle’s layer. This time add an Outer Glow using a lighter grey, also set to 3px in size and a blend mode of normal.

Use the Rectangular Marquee Tool to draw a thin 1px buttons on the top edge and side of the body to represent the lock and mute switches. Fill these with a subtle grey gradient.

To create the volume button, draw a thicker rectangle to begin with, then use the Elliptical Marquee Tool to delete out a central portion.

The main screen of the iPad often features a vibrant background wallpaper graphic. An amazing Creative Commons photo from Flickr user Arnar Valdimarsson fits pefectly. Use the marquee tool to crop down the photograph to the screen dimensions.

Drag a guide to identify the centre of the iPad body, then draw a circle with the Elliptical Marquee Tool. Fill this circle with a black to grey gradient to simulate the depth of the button.

On a new layer, use the Pencil tool in 1px size to draw a square, then delete out the four corners using the Eraser. Lower the opacity to around 25% to blend in the icon.

No Apple product would be complete without it’s reflections and light casts. CMD-click on the thumbnail of the main body to load the selection, then fill this with a white gradient spanning from the top right. Reduce the opacity of this layer to suit and move it to the top of the layer stack so that any underlying elements are affected by the light cast.

Onto the main iPad interface. Draw a thin selection across the top of the screen and fill with black to recreate the status bar. Lower the opacity to allow the background to show through.

Use the pencil tool to draw a simple battery icon, then add a simple selection of text elements.

Fill a rectangular selection with grey at the bottom of the screen, then press CMD-T to transform. Right click and select the Perspective option, then move the top corners inwards to create the basic shape of the iPad dock.

Double click the dock layer to add new Layer Styles. Add a gradient spanning from dark grey to light grey, then back to the dark grey. Set this to run horizontally across the dock.

Add an Inner Shadow to represent the tiny edge of the dock. Set the options to a light grey with the blend mode of normal. Use a -90 degree angle, a distance of 1px, a choke of around 27% and a size of 2px.

Continue Learning…

In this tutorial, you’ll learn how you can easily add a retro feeling to your creations. We’ll also cover techniques such as using gradient mesh tool to add inner shadows to your objects, which gives them a subtle rounding while keeping your artwork scalable. Let’s learn how to make a character head of a retro circus bear, then you can apply these techniques in your own work!

Final Image Preview

Below is the final image we will be working towards. Want access to the full Vector Source files and downloadable copies of every tutorial, including this one? Join Vector Plus for just 9$ a month.

Tutorial Details

• Program: Adobe Illustrator CS4
• Difficulty: Intermediate
• Estimated Completion Time: 1 hour

Step 1

In order to create this simple illustration I started with a raw sketch. In fact my drawing is so simple that this step could easily be skipped. Open your scan in Illustrator and set it as a Template.

Step 2

Now we’ll outline the shapes of our teddy bear head. Create a new layer (you may use the shortcut Command + L). As you can see it is not a very faithful tracing of my initial sketch.

I decided not to use the Pen Tool. Instead I’ll use the Ellipse Tool (L) each time tweaking more or less my ellipse shapes with the Direct Selection Tool (A). To create the heart-shaped nose and the mouth part, use the Convert Anchor Point Tool (Shift + C). You can see some of the anchor points together with their handles in the image below.

Step 3

The colors that we are going to use come from the yummy Adobe Illustrator built-in swatches palette: Foods > Ice Cream.

Step 4

We’ll start with the main part of the head. For the moment put it above all the other shapes. To do that select it, Right-click and choose Arrange > Bring to Front (Shift + Command + Right Bracket key.)

Fill the shape with the lightest color (vanilla) from the Banana Split group (R=244, G=236, B=206), and set the stroke to none. With the Gradient Mesh Tool (U) first click in about the center point of the head, next add four more mesh points by clicking about the points marked in the image. You do not have to be very exact.

Step 5

Choose the Direct Selection Tool (A), then hold down the Shift key and select all the sixteen border mesh points. Now fill them with the Chocolate Chip brown color (R=73, G=54, B=31).

Next adjust the positions of the four mesh points little bit, as marked in the image below. Do this by dragging them towards the center of the circle so that the mesh inner shadow has a round shape.

Step 6

Select the head shape and send it to the very back (Shift + Command + Left Bracket key). Select the outer parts of the ears and the eyes and bring them to front (Shift + Command + Right Bracket key). With these parts, we’ll proceed similarly as we did in the two previous steps.

Fill the outer parts of the ears with the same color we used for the main head and set the stroke to none. Now use the Gradient Mesh Tool (U) to add the mesh points as in the previous step, while skipping the bottom one.

With the Direct Selection Tool select the nine border mesh points situated above the blue line marked in the image below. Now fill them with the Chocolate Chip brown (R=73, G=54, B=31). Drag the two top corner mesh points slightly towards the center, as we did in the previous step.

Repeat the same for the outer parts of the eyes. The only difference is the fill color. Choose the vanilla color from the Neapolitan group (R=255, G=241, B=228).

Step 7

Send the outer parts of the ears to back (Shift + Command + Left Bracket key). Select and bring the inner parts to front (Shift + Command + Right Bracket key).

Fill them with the yellow color from the Banana Split group (R=252, G=221, B=124), and give them no stroke. Click in the center with the Mesh Tool (U). Next fill the top (above the blue line) five border mesh points with the Chocolate Chip dark brown color (R=73 G=54 B=31).

Send the inner ears to back (Shift + Command + Left Bracket key). Then immediately bring them forward (Shift + Command + Right Bracket key).

Step 8

Now we’ll create the iris parts of the eyes. Bring them to front, then fill them with the brown color from the Neapolitan group (R=107, G=78, B=56), and give them no stroke. Next use the Gradient Mesh Tool (U) to add the mesh points, then adjust their positions as shown below.

Select the border mesh points situated above the blue line and set them to black. Next change the color of two more mesh points as shown. The colors we use are light vanilla (R=255, G=241, B=228) and pink (R=238, G=156, B=176) from the Neapolitan group. This way we add some lighting and color.

Next try recreate this effect with the second eye. I wanted my teddy bear to have a bit of asymmetry.

Step 9

Bring the heart-shaped nose to front and fill it with the Neapolitan pink color (R=238, G=156, B=176), then set the stroke to none. Switch to the Gradient Mesh Tool (U) and add the mesh points as in the image – starting in the center of the heart. You can follow my order of adding the mesh points, but it is not obligatory.

Now adjust their positions as in the image. Set the color of all the border points as Chocolate Chip brown (R=73, G=54, B=31) and the color of the blue-marked point as Neapolitan vanilla (R=255, G=241, B=228).

Step 10

Having locked and set the heart to invisible, we’ll now work on the “mouth” part. Make sure it is placed above the eyes and below the nose. Fill it with the yellow from the Banana Split group (R=252, G=221, B=124), and give it no stroke.

Add five mesh points starting from the one marked with the blue arrow below. Change the color of all border mesh points to the Chocolate Chip brown (R=73, G=54, B=31). Next drag the four points marked with the dark brown arrows towards the center.

Step 11

Set the fill color back to the Banana Split yellow (R=252, G=221, B=124) and stroke to none. Add two more mesh points as marked with the dark arrows in the image below. Next change the color of the point marked with the blue arrow to Chocolate Chip brown (R=73, G=54, B=31).

Step 12

Turn the heart-shaped nose visible, but keep it still locked (it should be above the mouth). Adjust the shape of the mesh lines so that the mouth part has a more natural look. Move the handles a bit using the Convert Anchor Point Tool in the Pen Tool palette (or use the shortcut Shift + C).

Continue Learning…

Learn how to create a simple three-dimensional icon of a paint bucket, complete with paint splotches, with this colorful tutorial. Harnessing the power of paths, layer effects and consistent lighting we’ll obtain an effective, shiny icon.

Final Image Preview

Take a look at the image we’ll be creating. Want access to the full PSD files and downloadable copies of every tutorial, including this one? Join Psd Plus for just $9/month. You can view the final image preview below.

Tutorial Details

• Program: Adobe Photoshop CS4
• Difficulty: Intermediate
• Estimated Completion Time: 30 minutes

Step 1

Open a new blank document and choose 512px for both width and height. This is the maximum size required for icons (Mac OS X Leopard). Create an ellipse above the center and to the left and name it “outer rim” (1a). Make two copies and scale them down (1b). Name the first “inside.” Move the other copy down, naming it “bottom” (1c).

Step 2

Create a new copy of the smaller ellipse and make it yellow, which will make the paint’s surface (2a). Position it inside the bucket, erasing the unnecessary pixels (2b). Name this layer “paint.” Now make a rectangular selection with the Marquee Tool (M) on the “bottom” layer and fill it to complete the bucket (2c). With the “bottom” layer selected hit Command + T to invoke the Free Transform Tool. Right-click and choose Perspective. Now drag the bottom corners towards the center to apply the correct perspective deformation (2d).

Step 3

Let’s shade the bucket. Light will come from the right side. Apply a Gradient Overlay (3a) and an Inner Glow (3b) layer effect to the “bottom.” The base color is a medium gray with lighter bands that simulate reflections, as shown below.

Step 4

Double-click the “outer rim” layer to open the Layer Style window and apply Inner Glow (4a). On a new layer below, paint a shadow for the rim using a big, soft brush. Choose black and paint lightly with one single stroke, following the rim’s curve. Shadow layers are always set in Multiply mode with their opacity turned down (4b). Name this layer “rim shadow.”

Continue Learning…

Plunge with me on a vector ocean dive. In this tutorial, we’ll create a shell with pearls in a unique ocean scene. We’ll be using various effects, such as: mesh, blend, warp, clipping mask, opacity mask, depth of sharpness, editing of swatches, and pathfinder box. Have fun diving in and then surfacing!

Final Image Preview

Below is the final image we will be working towards. Want access to the full Vector Source files and downloadable copies of every tutorial, including this one? Join Vector Plus for just 9$ a month.

Tutorial Details

• Program: Adobe Illustrator CS3
• Difficulty: Intermediate
• Estimated Completion Time: 60 – 90 minutes

Step 1

Let’s start with the pearl creation. Open up a new document and select the Ellipse Tool (L), then use it to create an ellipse. Set the fill color to C=2, M=7, Y=24, and K=0, without a stroke.

Step 2

Select the ellipse you made and take Mesh Tool from the panel of tools. Put in the ellipse and center the first point.

Step 3

Now we deform a mesh line by using the Direct Selection Tool (A).

Step 4

Add mesh lines using the Mesh Tool (U).

Step 5

Let’s start to paint the pearl. Select points by using the Direct Selection Tool (A) and change the colors. Feel free to get creative and experiment here. Rename the layer to “pearles1.”

Step 6

Now we will create the shell. We’ll begin with the creation of the structure of our shell. We’ll use 9 colors. I used the CMYK color mode.

Step 7

Over the “pearles1″ layer create a “shell” layer. Select the Rectangle Tool (M), then use it to create rectangles, and fill them with sample shell colors. Experiment here. Note: Rectangles should not be crossed.

Step 8

Now we group all rectangles. Create above one rectangle of the same size as the group. Now align a rectangle horizontal and vertical by using the Align box. We then fill the rectangle with a linear gradient.

Step 9

Select the rectangle you made and change the Blending mode to Darken and Opacity to 50% in the Transparency palette.

Step 10

Select and group all the rectangles and go to Object > Transform > Move… Position it 12 px (width of group of rectangles) Horizontal and press Copy. Now press Ctrl + D forty times.

Step 11

Select all the textures and apply Divide from the Pathfinder palette. Ungroup all textures. Now displace the horizontal segments of a texture by using the Selection Tool (V).

Step 12

Select and group all textures. Duplicate and place a texture to the side. It is useful to us for working with the bottom part of the shell.

Step 13

Select a texture and go to Object > Envelope Distort > Make with Warp… Apply the settings you see below. Select this object and go to Object > Expand.

Step 14

Select the object you made and go to Object > Envelope Distort > Make with Warp… Apply the settings you see below. Select this object and go to Object > Expand.

Step 15

Select the object and go to Effect > Distort and Transform > ZigZag… Apply the settings you see below. Select this object and go to Object > Expand.

Step 16

Select the Pen Tool (P), then use it to create a shell shape. Now reduce to the size of a texture height.

Step 17

We duplicate a shell and click on Toggle Visibility in the Layers box. It is useful to us for work in following steps.

Step 18

Now select the form and texture of the shell, then make a Clipping Mask.

Step 19

Now we will add shade to the shell. Select the duplicate shape of the shell (see Step 17) and fill it with a radial gradient, and make the layer visible. Change the Blending mode to Multiply at 47% Opacity in the Transparency palette.

Step 20

Rotate the top part of the shell. Under the layer “pearles1,” create an “Internal shell” layer. Select the Ellipse Tool (L), then use it to create an ellipse. Select the Pen Tool (P), then use it to create the bottom part of the shell as shown.

Step 21

Duplicate an ellipse and select the bottom part of the shell. Now use this ellipse and apply Subtract From Shape Area in the Pathfinder palette, then press Expand.

Step 22

Take the texture, which was duplicated in a Step 12, and reduce its height.

Step 23

Select the texture you made and go to Object > Envelope Distort > Make with Warp… Apply the settings you see below. Select this object and go to Object > Expand.

Step 24

Rotate and place a texture under the bottom part of the shell.

Step 25

Repeat Step 18 to make the bottom part of a shell. Select the texture and go to Trim by using a Pathfinder palette or make a clipping mask.

Step 26

Now create the shadows on the bottom part of a shell. Repeat Step 19 for this.

Step 27

Now we’ll work on the internal part of the shell. Select the ellipse and add anchor points by using the Pen Tool (P). Then deform the shape a bit.

Step 28

Now create a new shape by using the Pen Tool (P).

Step 29

Fill the bottom shape with a linear gradient.

Step 30

We the top shape with a linear gradient.

Step 31

Now create a new shape by using the Pen Tool (P) and fill the shape with a linear gradient.

Step 32

Select both the top shapes and apply a Blend (Object > Blend > Make). Apply the settings you see below.

Step 33

Let’s create a pearl necklace. Go to the “pearles1″ layer. Select the pearl we created earlier, duplicate it and move it by using the Direct Selection Tool, while holding Alt.

Step 34

Add some more threads.

Step 35

Go to the “shell” layer. We create a shade from the top part of a shell. Go to Effect > Stylize > Drop Shadow… Apply the settings you see below.

continue learning…

Knowing how to animate objects in Photoshop can be very useful in web design, avatars , logos and much more. Here is a simple tutorial for beginners in the spirit of winter which will explain how to create an animation in Photoshop. Anyone can do this, so let’s begin!

Final Image Preview

Take a look at the image we’ll be creating. Want access to the full PSD files and downloadable copies of every tutorial, including this one? Join Psd Plus for just $9/month. You can view the final image preview below.

• Program: Photoshop
• Version: CS3
• Difficulty: Beginner
• Estimated Completion Time: 1 h

Step 1

First of all, you’ll need this texture: inthename-stock. Now open a new document. I usually work on really big documents because i can work on the details better and you can always decrease the image size later . So, as you can see in the picture below, the background is blue and the color code is #89defd. Fill the layer with this color.

Step 2

Create a new layer. Select the Ellipse tool and create a big circle. Create a new layer and make a new circle, only smaller this time. The circles don’t need to be perfectly round . Fill them with white. Put the small circle on top of the big one.

Step 3

Create a new layer between the two existing ones with the circles. Select the Brush Tool, with sharp edges, and make a big circle like in the image below. This will be the head’s shadow. The code for the color is: #CCCCCC. Now go to the body’s layer, press Command + Click on the layer to select it and Command + J on the shadow’s layer . This new layer is the one we are going to use so you can delete the other one . Now go to Filter > Blur > Gaussian Blur and add some blur (3-4%) . Now you have the shadow of the head.

Step 4

Go to the body’s layer and select it. Pick the Gradient Tool (radial gradient) and drag from the center of the circle outward. Your image should look like in the small image . Now set the Opacity to about 20%. Now your image should look like in the large picture. Do the same for the small circle.

Step 5

The next step is to create a texture for the snowman. For this select the brush tool with sharp edges and make the following presets for the Shape Dynamics (all to 0% ) , Scattering (372% , 1%, 0% ) , Other Dynamics (100% , 0% ). Now fill the 2 circles with a small brush, add more points to the edges and fewer in the middle. Next you have to set the blending mode to Multiply and the Opacity to about 35-40%.

Step 6

Select the brush tool with sharp edges without the previous presets and draw two black eyes.
Go to the layer style and make the following presets:

Step 7

With the Pen Tool, draw a shape that looks like a carrot and fill it with orange. The color code is: # e37b19. Now let’s make some light with the Dodge Tool on the right part of the nose and some shadows on the left side of the carrot.

Step 8

In this step we’re going to do the shadow of the nose so pick a round basic brush with sharp edges and black color and make a circle like you see in the image, then press Command +J . Make a mask for this layer and with a smooth round brush, erase some parts of the mask. If it’s still too dark, you can change the layer’s opacity.

Step 9

Let’s make the mouth now. Select the Ellipse tool and create a circle on a new layer. Now stroke it. Make the presets like you see in the image and erase the top part of the mask. The small lines are created with a brush.

Step 10

With the Pen Tool make a shape like you se in the image. This shape should look like a fur from a hat. Fill it with white. Make the left part a bit darker with a brush.

Step 10

Next we’ll make the hat’s shape with the pen tool on a different layer, just below the one with the fur. Fill the shape with red .The code for this color is # a90505.
Now drag in the texture and place it on top of the hat . Set the blending mode to Luminosity and the Opacity to about 20-25%.

Step 12

Give it some depth with the Burn Tool for the shadows and Dodge Tool for the light.

Step 13

Let’s make the buttons . It’s the same technique as we used to make the eyes. Select the brush tool with rough edges and draw a few buttons . Make the adjustments on the layer style like in the image below

Step 14

Select the Ellipse tool and create a small circle under the hat. Fill it with white and give it some shadow. Now select the basic brush with the presets that we did for the snowman’s texture and paint some fur with white.

Step 15

This is the part were we create the scarf. Create a shape, like in this image, with the pen tool . Fill it with red (#8b0404).

With the pen tool make some shapes like I did in the image and fill them with green. The code for this color is #0b6a16. Use the Burn and Dodge Tool for the light and shadows.

Create a new layer under the scarf layer and, with a brush, add a shadow.

Step 16

Add as much snow as you like with a simple brush.

Continue Learning…

The gradient mesh is one of the most powerful tools in your Illustrator toolbox, but it’s also one of the trickiest to get the hang of. This year I’m determined to master this amazing tool, so I’ve searched the web far and wide to pull together the best free training materials. This collection of tutorials covers everything from basic gradient mesh tool to some full on photorealistic vector designs. If, like me you have a mission to get to grips with gradient mesh, look no further than this collection of resources.

Gradient mesh capabilities

You only have to glance at amazing artwork such as this motorcycle rendering by Yukio Miyamoto to realise how powerful the gradient mesh tool can be. It allows the most minute control over colour gradients, enabling you to recreate highlights and shadows that help produce photorealistic images.

I like to think of the gradient mesh like the great Nunchaku, it’s a weapon of awesome capabilities that when used to its full potential by masters like Bruce Lee or Michelangelo the turtle looks insanely awesome. However it takes years of practice to become a true ninja. The same goes with the gradient mesh, when in the hands of a veteran, it can be used to create some unbelieveable photorealistic artwork, but it takes time, dedication and mental power to become a true master. Wrap a scarf around your head Karate Kid style and let’s get down to some serious training with these tutorials!

Gradient mesh tutorials

Tips for Working with the Gradient Mesh Tool In Illustrator

How to Make a Vector Military Cap Icon

Illustrator Tutorial: Gradient Mesh Flower

Create a Yummy Ice Cream Icon with Mesh Objects and Blends

Create realistic illustrations using Illustrator’s Gradient Mesh

Vectors Imitate Life with Gradient Mesh

Gradient Mesh Tutorial

Illustrate a Pair of Sweet Gradient Mesh Cherries

Gradient Mesh Bell Pepper Tutorial

Master the gradient mesh tool

Make a Shiny Gum Ball Machine with Mesh Gradients

Gradient Mesh Editing Tutorial

How to Create an Energy Saving Bulb in Illustrator

Mastering Mesh

Make an Aurora Borealis Design in Illustrator

Illustrator Tutorial: Realistic Curtain

Video Tutorials

Sometimes it’s handy to get that extra level of help from a video screencast. These tutorials help you understand the actual workflow and see the techniques in action.

Read More…

In this tutorial, we’ll explain how to create magical Celtic knots. Ornaments accompanied Celts in life and in death. Ornaments decorated clothes, books, furniture, ware, weapons, and gravestones. I’ll show you three ways to create Celtic knots in vector – from simple to the difficult. The last techniques allows one to create knots of any complexity. Intrigued? Read more!

Final Image Preview

Below are the Celtic knots we will be working towards in this tutorial. Want access to the full Vector Source files and downloadable copies of every tutorial, including this one? Join Vector Plus for just 9$ a month.

Tutorial Details

• Program: Adobe Illustrator CS3
• Difficulty: Intermediate
• Estimated Completion Time: 60 minutes

Step 1

Let’s open a new document in Illustrator (File > New) and enter the size 600 px by 600 px (but you can choose any size you want). I used the CMYK color mode to use it for printing.

Now select the Rounded Rectangle Tool, and create a rounded rectangle without fill, and with a black stroke. The radius can be changed by pressing the arrows up or down button, while keeping the left button of the mouse held down.

Step 2

Open the Appearance and Stroke palettes and create multiple strokes as shown.

Step 3

Select a Rounded Rectangle and go to Object > Transform > Rotate, then enter the angle 90 and press the Copy button.

Step 4

Select both rounded rectangles and apply Object > Expand Appearance, and then Object > Expand.

Step 5

Select the Live Paint Bucket (K), then fill a few areas with white as shown below

Step 6

Change the fill to black and fill in areas as shown.

To convert the Live Paint group into individual paths press Expand on the top tool panel. Now group (Command + G) all the objects.

Step 7

Select the Ellipse Tool and create an ellipse without a fill and a black stroke. Align them along the vertical and horizontal as shown.

Step 8

Select the ellipse and create multiple strokes (see Step 2).

Step 9

Select the ellipses, go to Object > Expand Appearance, Object > Expand. Select all objects and apply a Live Paint Bucket (K) (see steps 5 and 6).

Step 10

Select the Live Paint Bucket (K), set the fill to black and fill in areas as shown below.

I congratulate you! The first simple ornament is ready!

Step 11

The second way. Now we start weaving the ornament from three simple elements. For convenience of work go to View > Show Grid. Create the first element. Select the Rounded Rectangle Tool and create a rounded rectangle without fill and a black stroke.

Step 12

Select a path and add two points as shown. Select the Scissors Tool (C), cut the left and right new anchor points and delete the right bottom part of the path.

Step 13

Create multiple strokes.

Continue Learning…

In this tutorial, we will learn how to make a funny boy character in Adobe Photoshop. After drawing the sketch, we’ll use shapes, layer styles, the brush tool, and other effects to add some dimension to and life to our character.

Final Image Preview

Take a look at the image we’ll be creating. Want access to the full PSD files and downloadable copies of every tutorial, including this one? Join Psd Plus for just $9/month. You can view the final image preview below.

Tutorial Details

• Program: Photoshop CS3
• Difficulty: Beginner
• Estimated Completion Time: About 40 minutes

Step 1

First create a new 2000 pixel by 2000 pixel document with a white background.

Step 2

Then lets make a quick sketch. Use the Brush tool and turn on the Shape Dynamics feature in the Brushes window.

Step 3

After that we are going to make a color sketch, so turn off Shape Dynamics for a harder Brush, and color the boy in the new “Colors” Layer.

Step 4

Now, let’s begin to add some details to our character, starting from the head. Make a circle with the Ellipse Tool, be sure to choose the Shape Layer feature. Then Command-click on the shape’s contour to make the object editable.

Choose the Pen Tool. Now you can add a new vertex by clicking anywhere on the contour. Command-click on a vertex if you want to move it or Alt-click on it if you want to change the sharpness of the angle. So let’s add the ears.

Step 5

Double-click on the right side of the Layer in the Layers window to open the Layer Styles window and add the following Layer Styles.

Step 6

Create a new layer and draw the blush areas using the Brush Tool. Then blur it with Filter > Blur > Gaussian Blur.

Step 7

Now we need to turn off layer visibility for a while, so we can draw the eyes. In order to do that just Click on the eye-icon near the layer shown below. Draw a circle and transform it with Edit > Free Transform (Command + T).

Step 8

Add the following Layer Styles.

Step 9

Draw the pupil and the shadow above the eye.

Step 10

Now select the three layers related to the eye in the Layer window and group them (Command + G). Then drag the group to the New Layer icon to copy the group and thus create a second eye. Use the Edit > Transform > Flip Horizontal and move the second eye to the right position.

Step 11

To draw the glasses, start with a circle using the Ellipse Tool. Then select the Subtract from Shape Area (-) feature and draw another circle inside the first one. To change circle position Command-click on the contour and use Free Transform (Command + T).

Step 12

Copy this layer and place it above the second eye. Draw all the other elements with the Pen Tool.

Step 13

Merge all layers related to the glasses by selecting them and then pressing Command + E. Add the following Layer Styles.

Step 14

Draw the mouth with a Pen Tool and add an Inner Shadow to the layer.

Step 15

Now we are going to draw the teeth and add the Inner Shadow to them. To copy the Layer Style from one tooth to another drag the icon of the Layer Style while holding Alt + Command. Then clip the unwanted part of the teeth by selecting them in the Layers Window and pressing Alt + Command + G. This will create a Clipping Mask.

Step 16

Now draw the nose and add the following Layer Styles. Be sure to turn off the Use Global Light.

Step 17

Now add some freckles onto the face using the Ellipse Tool.

Continue Learning…

We have another great Vector Plus tutorial available exclusively for Plus members today. If you want to learn how to create retro typographic illustrations, then we have an awesome tutorial for you. This one will teach you to control color and add subtle effects, after tracing your custom lettering sketches.

This Tutorial is Filled with Creative Techniques

Illustrative typography has become an increasingly popular direction for creating dynamic and personal designs, using words and letterforms instead of more common pictorial elements. Over the past 18 months, I have explored this approach in my own work, often using popular quotes as a starting point for the design. The letterforms, shapes, patterns and choice of colors have developed over this time to reflect my own style, but this tutorial can be used with a variety of hand-drawn typefaces of your own.

Tutorial Details

• Program: Illustrator CS4
• Difficulty: Intermediate to Advanced
• Estimated Completion Time: 5 hours

A preview of the final image is below.

Plus members can Log in and Download! If you’re not a member, you can of course join today! You can view the final illustration below.

This is a Detailed and Professional Tutorial

Plus members can Log in and Download! Otherwise, Join Now! Below are sample images, which show some of the development of this tutorial.

Vector Plus Membership

As you know, we run a premium membership system here called Plus that costs $9 a month (or $22 for 3 months!) which gives members access to the Source files for tutorials as well as periodic extra tutorials, like this one! If you’re a Plus member you can log in and download the tutorial. If you’re not a member, you can of course join today!

From opening a 3D file to rotating, scaling and moving it, working with meshes, creating textures or even materials, adding lights, and more, this tutorial covers most of the secrets of the useful feature 3D Tools of Photoshop CS4 Extended. If you have it, why don’t you try? I can assure you that you will discover a brand new world of infinite possibilities.

Before Getting Started

We are living on the golden age of 3D technology, we can see art pieces, architectural models, biological simulations, fantasy creatures, futuristic machines, and almost realistic objects everywhere. Most of those graphics have been through Photoshop, from texture editing to final mock-ups; making it a must know tool for anyone interested in 3D design.

Photoshop CS3 Extended allowed users to open their 3D files and edit directly some features like textures and lights, but CS4 takes 3D editing into another level where you can actually work with the 3D file just like most of the commercial 3D editing software. Even though Photoshop can’t edit the model itself, it works absolutely well with textures, materials and lights allowing you to even paint directly over a surface using the Brush Tool. This is a very basic guide but some elemental knowledge of 3D geometry is needed.

Tutorial Details

• Program: Photoshop CS4 Extended
• Difficulty: Basic
• Estimated Completion Time: 2 – 3 Hours

You will need some 3D models to play with, I’m using a boat from telias.free.fr and a free-to-use model of a space shuttle that I’ve downloaded from the NASA website. Feel free to use any model that you want. Let’s get started!

Part I – Creating and Editing 3D Layers

Photoshop handle 3D files through 3D layers, which work just like Smart Objects. Each 3D layer contains a unique 3D scene that can be created five different ways: from a 3D file, from a layer working as a Postcard (Plane), from a layer making it a 3D basic Object, from a grayscale layer and as a Volume combining two or more layers.

This tutorial will cover the first four, since Volume based on layers is a little bit different than the others and we will leave it for another occasion.

New Layer from 3D File

The first way and maybe the most known way to work with a 3D layer in Photoshop is creating a 3D layer from an existing file. For this go to 3D > New Layer from 3D File, then chose a file on your file system and open it. Photoshop allows you to open .3DS, .DAE, .KMZ, .U3D and .OBJ files. A new Layer with the object’s name will appear in the Layers Panel. You can add as many 3D layers as you want.

Working with the Basic 3D Tools

In the Tools Panel click on the active 3D Tool (K) and then on top, in the Options Panel, you will see several different options for you to edit the 3D layer. At any time you can go back to the default values by clicking on the tiny House Icon in the Options Panel.

Rotate

The default tool and the first one in the list is Rotate, Click on the 3D model and Drag up or down to rotate it around its X axis, or side to side to rotate it around its Y axis. A diagonal Drag will rotate the model on both the X and Y axis. You can control the rotation by setting numerical values in the Orientation fields over the Options Panel, by default all of them are set to 0.

Roll

Drag side to side or up and down to Roll the model around its Z axis. You can do the same by using the previous tool, but holding the Option key on a Mac or the Alt key on the PC. You can control the rotation by setting numerical values on the Orientation fields.

Drag

This tool moves the model in the 3D space. Drag side to side to move the model horizontally, or up or down to move it vertically. Hold the Alt key to move it in the X/Z direction. This tool is very different than the standard Move Tool (V) because this works over a 3D environment meanwhile the Move Tool works only in 2D. You can control the position by setting numerical values on the Position fields over the Options Panel all values are set in 0 by default.

Slide

Drag side to side to move the model horizontally, or up or down to move it closer or farther away from your perspective. You can control the position by setting numerical values on the Position fields, which is 0 by default.

Scale

This change the model’s size. Drag up or down to scale the model larger or smaller. By setting the Scale values in a numeric format you can scale the model over any of its 3 axis, stretching it up or enlarging it. By default the numeric values are set to 1.

 

Continue Learning…