Posts Tagged ‘Illustration’
Create a Vivid Themed Illustration Using Simple Hand-Drawn Elements – Part II
|
Drawn elements are certainly something that can enhance an illustration. Even if you’re not very good at drawing, you can still create a quality piece. All you need is a good idea and some Photoshop skills. And if you don’t believe me, you will definitely change your mind after reading this Part II of his two part tutorial series. So let’s take a look inside!
Final Image PreviewTake 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.  Part II Tutorial Details
Introduction and PreparationIt’s a themed illustration about "No Beauty," this hides an idea that no beauty lasts forever. Suddenly all that’s great and beautiful falls apart. All the happiness is gone with the colorful pieces. The final outcome has its own mood, even thou it’s colorful, it’s still kinda frightening. And as I said this is kinda simple but you may be wondering why this tutorial is labeled as advanced level. Well everything is fine as long as you have some base to work on. Here we have absolutely nothing, we will create this piece from scratch. So what’s hard, is all the illustration depth, shading and colorization. Beside that, there are some things you just need to feel. Ok, now let’s take a look what we’re going to use here:
Step 1Just to remind you of what we created in the Tutorial Part I, the first image below shows our final outcome. Remember that you need to work now below all adjustment layers (which affect the whole illustration) and also below the overall room shading that we added. OK, so pay attention to the second image below. I drew something like that in the first tutorial part, this is the sketch of how I pictured the splashes. And I decided not to cover the whole face with splashes.  Step 2I found three nice splashes (1,2,3) from istockphoto, which you can view in the first image below. There are few ways to do the extraction, and because the background is white it’s quite an easy task. You can do this using Color Range, however we don’t need the full splashes here, and a more accurate job need the Pen Tool. Look at the third splash below and the green rectangle. It’s a good part to fit our face. Let’s zoom into this part and use the Pen Tool to cut it out. Using this technique is reasonably fast (and the color range technique sometimes leaves a little bit of the background color, which we don’t want). So check the last image below (the black one) and you can see it’s very precise. I compared the background with a black color and yes, it’s full red, no white edges.  Step 3Now as I said we just need a little bit of this splash, so make it fit into the face and use a soft eraser or a layer mask to get rid of the square edge of the splash (first image below). Then apply Image > Adjustments > Selective Color and brighten all the tones in this dark red splash. To do this we need to use Reds, Yellows, Neutrals, and Blacks (second image below). Now this looks over saturated, so let’s take the saturation down (third image below). Then it’s good to give a little more brightness (forth image).  Step 4I’ll show you now what to do in points:
 Step 5Now duplicate the face layer and place it above the splash. Flip it horizontally to make the dark skin cover our splash (first image below). Go to Layer > Layer Mask > Hide All (second image below). Then use a soft, black brush and paint on the layer mask while having the “splash” selection activated (third image below). This may look a little confusing. Let’s review what this does? Well, basically we’re revealing the skin from the copied face. And we’re doing this on the splash to make it look more skin textured. It’s a tiny difference, but believe me, if you zoom in, you will see the difference. The splash will look like real skin.  Step 6OK, let’s bring up another splash. Again use the Pen Tool to make a precise cut out. Now turn it in the right direction (first image below). Then use a hard eraser (or layer mask with a hard, black brush) to make a perfect match to the skin (second image below). Then soft-erase the squared top part of the splash.  Step 7As when we were applying the previous splash, use Image > Adjustments > Selective Color and adjust the same colors. Play around with the values starting from Reds, Yellow, Neutrals, and Blacks. Try to make the splash color brighter (first image below). Then turn down the saturation (third image below) and finally give a touch of brightness (forth image below).  Step 8
 Step 9OK, when it comes to adding lighter splashes, the job is much easier.
Note: The lights may sometimes come a bit sharp and bright, so you can always get rid of them using the Patch Tool or just by erasing some parts of the splash.  Step 10As you see now, the shadow below the face will be a little bit different because we changed the shape. Find the same color as you used previously, while painting the shadow. Grab a very soft brush and add more shadow where objects are getting closer to the ground (as you see in the fist and second images below).  Step 11Now to add more skin-splash touches, we need to use another image of paint. It’s a good to have it in the same color, then the adjustment values will not change much. So bring up this Splatter image to Photoshop and start extracting using the Pen Tool. As you see in the first image below, you do not have to cut out the whole piece, just the bottom part. And also the extraction needs to give you a nice rounded stain without dark shadows. Everything is shown in the images below. You just need to repeat what you did previously with the splashes, but yeh, with each new splash you must search new adjustment values (as they are not the same). So the values will be quite similar, but not exactly the same.  Step 12Grab the Brush Tool with soft settings (Flow at 2% and Hardness set to 0%). Create a new layer below these skin parts, and use a dark color (that fits to the surface) to add a tiny shadow. I used the color: #2f1d0e. Then look at second image below and create two new layers above the skin parts. We will make a small touch up to one of them. As shown in the image – change these layer Blending Options: one to Overlay and the second to Multiply. Then using the same soft brush, change your color as shown in the second image below and paint in the indicated spots to make this skin look more realistic.  Step 13It’s the right time to add some hand-drawn pieces. My drawing skills are pretty lame and I’m aware of that, but since I have some basics I was able to create several very simple elements that look good enough for this purpose. And with good Photoshop skills you can turn your simple drawings into something really cool. So take a piece of paper, a pencil and use your imagination to create some nice shapes (or you can use mine as well). Now shoot a photo of each one (it’s good to have natural daylight while taking a picture). Then open each one and if they are too dark, use Layer > Adjustments > Brightness/Contrast and then Layer > Adjustments > Levels to get a nice contrast between the edges and the background. Next use the Pen Tool to extract. While extracting, work on a big canvas (don’t resize the photos).  Step 14As you see my drawn element is quite big and that’s a good thing. Now you can use Command + T and click Warp in the top menu bar. Work on bending this shape to get various results. Obviously the warping will get our element a little blurry, but after we resize it down it will not be noticeable (second image below). Next I wanted to add some depth to this piece by making it less plane. To do this you need the Burn Tool and Dodge Tool. In the third image below, the green arrows indicate the lower spots (that need to get painted using the Burn Tool set to Midtones) and the red arrows indicate the upper spots (that need to get painted with the Dodge Tool set to Highlights). And after adding depth, you may color this element using Hue/Saturation. |
Create a Vivid Themed Illustration Using Simple Hand-Drawn Elements – Part I
|
Drawn elements are certainly something that can enhance an illustration. Even if you’re not very good at drawing, you can still create a quality piece. All you need is a good idea and some Photoshop skills. And if you don’t believe me, you will definitely change your mind after reading this tutorial. So let’s take a look inside!
Final Image PreviewTake 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.  Part I – Tutorial Details
Introduction and PreparationIt’s a themed illustration about "No Beauty," this hides an idea that no beauty lasts forever. Suddenly all that’s great and beautiful falls apart. All the happiness is gone with the colorful pieces. The final outcome has its own mood, even thou it’s colorful, it’s still kinda frightening. And as I said this is kinda simple but you may be wondering why this tutorial is labeled as advanced level. Well everything is fine as long as you have some base to work on. Here we have absolutely nothing, we will create this piece from scratch. So what’s hard, is all the illustration depth, shading and colorization. Beside that, there are some things you just need to feel. Ok, now let’s take a look what we’re going to use:
Step 1I always try to work on a big canvas, but for the tutorial purposes I will go use a document that is 815 px by 1050 px. Just to save you some money from buying large pictures. Anyway, drag the paper texture to our document, duplicate it twice and to each copy hit Command + T (Free Transform) and then select Distort. Refer to the second image below and look how to transform these two paper copies, they need to create a perspective as shown. Now in the same image – two green frames show you where to cut the main paper to get a good connection. Finally, grab the Patch Tool and get rid of the bad looking textures (third image below).  Step 2Next use Command + U and lower the Saturation of this background paper texture a bit. If the texture still needs some work (first image below), then use the Patch Tool or Clone Stamp Tool to cover some imperfections. Then, let’s say that the paper background is some kind of a room, so I thought these walls need some more contrast. To make the texture look better, use the Burn Tool (Range – Midtones), and burn in the connection lines to make it look more like a room.  Step 3Now, while you still have the Burn Tool selected, make the diameter very small and paint in the top and bottom edges (first image below – where the arrows indicate). This should help to keep the walls, floor and ceiling separated. OK, look at the second image below. From my experience I knew I’d give this image more contrast in the final product so for now I kinda lowered the overall contrast giving the feeling that all these walls are very light. To do this use levels as shown in the second image below.  Step 4I assume you have merged all your wall layers together for easier work. If you didn’t, let’s do it now. Then duplicate (Command + J) the “walls” layer and change its Opacity to Overlay. Now go to Filter > Other > High Pass and add the value of 1 or 2. You should immediately get the result shown in the first picture below. Now hit Command + Shift + A to select the whole canvas, then Command + Shift + C (Copy merged), and Command + V (Paste). Turn the previous “walls” layer off. Leave only the white background layer visible and the new merged layer. Create a new layer above all, change its Opacity to Multiply, grab the Eyedropper Tool and sample some dark brown color. Then use the Brush Tool with 0% Hardness and around 3% Flow, and then paint as shown in the second picture below to create some irregular shading. Notice how the floor and ceiling is being created by doing this.  Step 5Select the merged layer (the one with the whole canvas) and use the Rectangular Marquee Tool to select the top part of the image, then hold Command and drag this part down. This will help us repair the perspective, because in the beginning we made it pretty much random (if you can imagine this, the diagonal wall lines should cross in the center of the image). Next, look at the second image below and use the Patch Tool to get rid of the straight line indicated by the arrows (which is a result of repairing perspective).  Step 6Let’s open the scratchy texture (link in introduction) and hit Command + Shift + U to Desaturate it. Then you can add Levels (Command + L) and enhance the whites, just to make these tiny scratch lines more visible. Take a look at the second image below, what we need to do is place this texture in the floor spot. There is also alternative way to do this step by stretching the texture (as you see in the third image below) to get the right perspective (using Command + T > Distort), but well, as not everyone has the correct eye to make this right, we can stick to the position in the second image below.  Step 7As you have positioned this texture, go to Layer > Layer Mask > Hide All. This will make the texture totally invisible. So then grab the Brush Tool, make your brush setting very soft (Flow at around 4% and Hardness at 0%). Then use white for the color and paint on the layer mask of the texture. The first image below shows the full mask view, and it’s shown where I painted to reveal the texture. Now look at the second image below, and notice how nicely this texture blends with the white background.  Step 8Use the same technique from the previous step to create the ceiling surface. Now open the face picture. Now grab the Eraser Tool set to 100% Hardness and 100% Flow, and get rid of the surrounding skin flowers. An accurate cut out is not necessary, as we will work the face shape in the following steps. For now we also need to resize down this face to make it more suitable to the illustration (third image below). Everything needs its own place in a quality piece, let your own eye be the judge of proportions.  Step 9Now let’s shape up this face. Grab the Pen Tool and draw a curvy path around the whole face. Pay attention to make lots of cavity shapes (absolutely no squares). After you’re done, turn the path into a selection and hit Command + Shift + I to inverse the selection (first image below), then hit Delete. Now you should get something similar to the second image below. When you work on an illustration like this you need to do a lot of work and planning. In the third image below I wanted to show you how I pictured in my head – what the next steps might look like. I sketched the face falling apart, and basically I wanted to do this by smudging the skin, but ultimately this turned out as splashes.  Step 10I made some further corrections to the face, as I didn’t like the face center (first image below). So if you want you can use the Pen Tool to cut more of the face. Pay attention to her nose, the holes are looking kinda weird (like the right one is barely noticeable). To correct this use the Burn Tool (with Range set to Midtones) and a small diameter. Burn the right nose hole (second image below). Be careful, the Burn Tool can affect the nose skin also, so that’s why we need a small diameter to make it with precision. If you still have the Burn Tool selected, make your diameter bigger and paint where the green arrows indicate (third image below). I wanted to enhance some shadows and also the bottom of the face. Soon we will drop some shadow below this face, and to make everything work properly it’s good to add shade to the bottom part of this skin.  Step 11The face seems kinda pale so let’s warm it up a little. Select the “face” layer, hold Alt and go to the Layers Palette, and pick Gradient Map (check option Use Previous Layer To Create Clipping Mask). Look at the first image below and use similar colors as mine. Select the Gradient Map layer, change its Blending Mode to Soft Light and lower its Opacity to around 20-30% (not to overload the face with color). Then using Alt again, add another Adjustment Layer, which is Curves and adjust it just a little bit to get the similar look as in the third image below.  Step 12OK, now make sure you no longer need to change anything in the color of the face and then select these two adjustment layers (Curves and Gradient Map) and also our “face” layer. Then hit Command + E to merge them. Next use Command + J to duplicate the “face” layer, drag the copy below original one and move it a little to the top left (first image below). You can achieve even more variety and less plane results if you rotate this face (second image below). Then grab the Lasso Tool and make a selection around the indicated part above the nose, hit Command + Shift + I to inverse the selection (third image below) and use delete to get rid of all the unwanted parts.  Step 13And what is this all about? This face looked very flat to me. To avoid that look it’s good to add some depth. As you can see, the first image below is the view that we get after deleting all the unwanted parts from the previous step, and the face cut is barely visible. We’re going to use the Burn Tool (with Range set to Midtones) to add the skin depth by giving some shade to the duplicated “face” layer lying below the original one (second image below). |
Creating a Surrealistic Hand-Drawn Illustration
|
In this tutorial, you’ll learn how to create a surrealistic illustration using fine liners, marker, an economic all in one printer, Illustrator and Photoshop. I’m going to explain how to draw the figures that we need even without having great drawing skills. Then vectorize the drawings in Illustrator where we do the most part of positioning and coloring the illustration. After we’ll import into Photoshop to apply a texture, some filters, india ink splashes and some tonal adjustments. This is a great way to create illustrations with a hand-drawn feel!
Final Image PreviewBelow 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
 ResourcesIn order to create this illustration you’ll need some photos from Stock Exchange. I would like to thank all the photographers for the images they created: Bird, Tree, Desert tree, Sunflower and Skull. Then you need some brushes, a marker, some pigment liners pens, china ink and an economic all in one printer. Step 1First of all prepare all the things you need to draw and keep them handy.  Step 2Let’s prepare all the images needed to create a library of hand-drawn useful vectors for the illustration. Let’s begin with the skull image, your aim is to boost up the contrast while preserving details. Open it in Photoshop, and go to Image > Adjustment > Black and White. From the Preset menu choose High Contrast Blue Filter. Now open the Level menu (Command + L), and drag the input levels arrows toward the center to boost up the contrast, like in the image below.  Step 3Then you have to repeat the previous step for all the images. Open up the spring robin image and use the Crop Tool (C) to delete the unwanted portion of the image for the printout version (there is no need to waste ink and color printing the entire images). This time the Green Filter will do the job, apply Image > Adjustments > Black and White, then from Preset menu choose Green Filter.  Step 4Open the desert tree image and after Crop (C) it like in the previous step, use the maximum white Preset this time from Image > Adjustments > Black and White.  Step 5Repeat the previous operation for the sunflower image, this time the yellow preset with a little tweak does the job. See the image below for the values. Once finished save all those edited images into a folder.  Step 6Print each image on a single A4 sheet of paper in black and white. The printout should be as big as possible. Take each printout and put a sheet of tracing paper on the top with some tape or some glue-stick for paper. Now, grab your pens and marker and let’s begin to draw.  Step 7While drawing, use the print as a guide, try to see the image divided into shadows, lights and midtones. With the black marker trace the thicker lines and create some solid black areas where needed, try to choose where those solid black areas should be and draw them. For the shadows create thick to thin parallel lines until the lighter point. Experiment, using various pens and your style of linework and don’t be limited by the printout below your tracing paper, just draw freely! You should have something like this, but feel free to experiment.  Step 8Continue with this method until you have traced all the printout. Keep experimenting using different combination of pens, markers and felt pens to give personality to your drawings. Try to varying angles within your lines and create irregular stroke but don’t over do with black areas. There should be a balance between lights and shadows. Your final drawings should be something like this.  Step 9You notice that in the previous picture there are two images that don’t have a photo reference, the heart on the left, and the other flower in the center. This is because I drew them tracing on two of my old sketches. If you want, you can try to produce your own sketches and than use the same technique of the previous steps for inking your drawings, or use those provided in the tutorial files.  Step 10The next task is to take each sheet of tracing paper drawn and scan them into Photoshop at a resolution of 600 dpi or 300 dpi at least, in grayscale mode. In order to do this go to File > Import > your printer model Twain… once finished you use Levels to brighten up the whites and darken the blacks. Go to Image > Adjustments > Levels and bring the arrows toward the center. Your aim is to enhance your blacks and whites and remove any gray smudges. Notice how the images below are only in black and white, without grays. Do it for all the images except for the big tree one, and save them in TIFF format.  Step 11Now you need to create the tree, so open the big tree image in Photoshop. You need only about half of the tree. Use a guide to help you, and place it in the image as shown. Duplicate or unlock the background. Use the Rectangular Marque Tool (M) to make a rectangular selection on the guide, then hit Command + J to duplicate the selection into a new layer. Duplicate this layer too, then use Command + T and go to Edit > Transform > Flip Horizontal to flip the last layer and drag it from the left to the right with the Selection Tool (V) until you recreate a new entire tree.  Step 12With a selection exclude the unwanted part of the image, such as soil and trees in the background. Don’t worry about the sky for the moment. Use the tool you feel most comfortable with, I used the Pen Tool (P) for example. Once finished click on the Add Vector Mask button at the bottom of the layer Palette to generate a mask from the selection. Target the mask thumbnail, and with a small brush adjust the tree. If you need, switch between black and white for hiding and revealing part of the image within the mask. Don’t be too precise for the lower part because it will be hidden later.  Step 13Your next aim is to remove midtones from the image, without losing too many details. Create two adjustment layers, respectively, Black and White then Levels and insert the values reported in the image below. Once finished, flatten the image via Layer > Flatten Image and save as “tree.tiff.” Put it in the same folder as the other finished images. Your result should be similar to mine.  Step 14Now we’ll work for a while with Illustrator, vectorizing one by one the drawings we’ve created. So let’s open Illustrator, create a new document and place an image in, for example the skull one. Go to File > Place and navigate to the folder where you saved your “skull.tiff.” After the image appears, make sure it’s selected, and go to Object > Live Trace > Tracing Option and here choose Detailed Illustration from the Preset menu. Leave the default option and click Trace. If the result is a little too dark, set the Threshold to 138. Once finished go to Object > Expand in order to end this phase. Name this layer “lineswork.” Now you have your lines, but you could also have the fill. Let’s create it!.  Step 15In order to easily create a base fill color, it is important not to have gaps in the outline area but it is solid black. In order to get it, hit Command + A to select all the “lineswork,” then create another layer below called fill. target this layer and hit Command + F to paste in the same position. Now target the little circle in the fill layer just created, and with the selection active apply to Object > Compound Path> Release. In the Pathfinder Palette, Click on Unite. Now you have a solid shape area below your lines, change the color to a light gray to see it under your lines.  Step 16Repeat the action performed for Step 15 for all the images until you reach a vector version of all the drawings, vectorize the big tree done in Step 13 too, and save all of them as EPS or AI files and put all the stuff in a folder called “vector” for example. For convenience you can enter all the drawings in a single file.  Step 17Create a new file in Illustrator, I personally created a vertical A2, because I ‘m going to print a big canvas, but feel free to choose your own dimensions. Import the big tree vector file, and place it in the center of the document. Now change the colors to a bright yellow for the “fill” area, and a purple for the “line” area (feel free to use your own colors). Then, with the selection still active on both the fills and the lines, change their shape to match approximately the one shown below.  Step 18Then, begin to create the branches, since this design is a false symmetry, it is important that the elements that compose it, appear symmetrical at first sight. Indeed there is a way to get a similar effect, that is to compose only half the image and flip it horizontally, but the result is much less spontaneous, (you’ll never find a symmetric tree in nature). So import the “desert tree” vector into another layer above (remember for each drawing to group the fill and lines). Place it on the left, change its color, than duplicate ti by hitting Command + C followed by Command + F to paste in front. Select the copied version and go to Object > Transform > Reflect, then in the pop-up choose Vertical > 90 Degrees. Repeat this step four times until your tree is similar to the mine below.  Step 19The next step is to add the four skulls, like before. Import the skull vector drawing, use the same purple for the fills and a light yellow for the lines, then repeat the actions performed on step 18 to scale and place the four objects properly. Notice that this is one of the focus points of the entire image. To scale easily use the Scale Tool (S) on one of the skulls, adjust it to the desired size, duplicate until you have four skulls like below.  Step 20Import the vector bird too, duplicate it and place it in separate layers, immediately below the branches created in Step 18, refer to the image below for positioning. Now create another series of branches placing them in a layer at the base of your stack in the layer palette. Reflect and place them as you have already done in Step 18.
|
Create a Rolling Stones Inspired Tongue Illustration
|
The bright red Rolling Stones tongue and lips logo is a graphic design icon, and has been a pop culture fav for years! I don’t think you can beat it, so we’ll not create a direct copy of the original in this tut. Instead, let’s take a look at drawing our own Stones inspired tongue graphic, starting with a quick pencil sketch and finishing with a vector based graphic in Adobe Illustrator.
Start work with pencil and paper, use the original Rolling Stones logo as inspiration and follow the rough lines and shapes to produce a similar drawing.
Warm up your scanner and digitise your sketch. Save the scan to your desktop.
Open up Adobe Illustrator and go to File > Place. Position the sketch on the artboard, lower the transparency then press CMD+2 to lock the item in place.
Begin tracing each element of the sketch with the Pen tool. Use just a black stroke to visualise the paths on screen. Aim to use large Bezier curves to maintain a smooth outline without any harsh angles. When the path moves onto a different element, such as the tongue, simply close the path with a few rough lines. Once the tongue shape is filled with colour, this rough line won’t be seen.
Trace around the outlines of every other element to give separate shapes for the lips, tongue, mouth opening and each tooth.
Fill each shape with a relevant colour, so use red for the lips and tongue, black for the mouth opening and white for the teeth.
Notice how the teeth use rough outlines on the upper edges? These will need cropping down to fit under the lips. Duplicate the mouth opening shape, and press CMD+Shift+] to send it to the top. Group all the teeth together then use the Intersect Shape Area option from the Pathfinder palette to trim the teeth to size.
Select all the objects and add a black stroke. The original doesn’t make use of outlines, but we’re going a style of our own!
Duplicate the lips and tongue and send them to the top of the stack using the CMD+Shift+] shortcut. Use the Add to Shape Area option from the Pathfinder palette to merge them together.
Next, add a large black 11pt stroke to the shape. Align the stroke to the outside using the tiny icons in the Stroke palette. Press CMD+Shift+[ to send the shape back to the bottom of the stack.
Select the tongue and mouth graphics and increase their stroke size to 6pt. Also align these to the outside.
Then, select all the teeth graphics and increase the stoke to 3pt. This variation of stroke weights is a popular technique in Illustration.
Begin creating a variation of tone by adding a Linear Gradient across the lips, select a bright red and a slightly darker red swatch.
Add the same gradient fill to the tongue, adjust the direction to flow diagonally across the tongue, ranging from the shadows inside the mouth to the lighter tip.
Add a subtle white to grey gradient on each tooth. A radial gradient works well to give a rounded appearance.
Grab the pen tool and draw the outlines of some shading on the teeth. Pay close attention to the smooth curves across the teeth, then roughly complete the path while keeping within the black stroke line.
Change the blending mode of the black shading to Multiply and drop the opacity right down to 10%.
Next use the Pen tool to draw a shape representing the centre line of the tongue. Fill this with a dark red, change the blending mode to Multiply and adjust to 45% transparency. Use the shortcut CMD+[ repeatedly to alter the stacking order so that it sits below the teeth. |
Learn to Create a Financial Crisis, Vector Illustration
|
Fitting for these tough financial times, learn step by step how to create this turbulent vector illustrations. Numerous Illustrator tools are used to create this illustration. We’ll use Symbols to add texture to the land are, the Mesh Tool for the sky, 3D effect to compose the skyscrapers, the Twirl Tool for the tornado, and Warp effect for the dollars. We’ll cover alot of ground in this tutorial, faster than a businessman escaping to the bahamans!
Final Image PreviewBelow 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
 Step 1First let’s create a new “Land” layer. Create a new shape of the Earth, and fill it with the linear gradient.  Create a “BG” layer under the “land” layer. Let’s work on that background (layer “BG”). Create a rectangle 800px by 600px in the “BG” layer using the Rectangle Tool. Create it at a size of 400px wide by 300px height, and fill it with a blue color. Close the “BG” layer. Now we’ll create the soil texture on the land layer. Select Artistic Textures > Stipple from the Symbols library and pour it over the soil surface. Then apply Object > Expand. Apply a linear gradient to the soil shapes.  Copy the form of the surface of the soil and set it above the texture. Select the upper figure and texture, use Crop from the palette Pathfinder, cutting the texture out of the outlining figure as shown.  Step 2Now we’ll design and color the background sky. Use the Mesh Tool to create a mesh and then color a sector as shown below.  Let’s create the clouds next. First make new “cloud” layer, which goes above the “BG” layer. On this new layer, create ellipses, setting them one above another in order to compose a cloud. Now Select All, Add to Shape Area, and click Expand in the Pathfinder palette.  Place these clouds over the gradient sky, change the transparency so some look a bit off in the distance. Place them one above another as your imagination sees fit. We won’t fill in the center because the whirlwind will be set there.  Step 3Now let’s design the skyscrapers. First create, a new “Skyscraper” layer, set above the “cloud” layer. Create a rectangle 50px by 200px, then apply Effect > 3D > Extrude & Bevel, and the settings are shown below.  Make a few more rectangles in the same way and set one above the other.  Let’s make the windows of the front of a house. Create the square 5px by 5px, duplicating it we create a row of windows. Select and group the windows. Use Effect > 3D > Rotate.  The same action will be done with the windows of the second façade of a skyscraper. The picture of facades on the edges of a shape can be set in another way. Create a façade with the same size as the edge of the 3D shape your working with, move a façade into the Symbols palette, select a 3D shape and then click 3D Extrude & Bevel in the Appearance palette. Then select Map Art in the open dialogue window, find the needed side and add the symbol.  Select all the objects of a skyscraper and go to Object > Expand > Appearance. Now we’ll create the effect of a sagging skyscraper under the wind of a tornado. Group all the elements of a skyscraper, and apply Effect > Warp > Arc, with the parameters shown in the picture below.  Now move a skyscraper clockwise a bit. Ungroup the objects of a skyscraper and fill the windows with a linear gradient.  Create and place the skyscrapers so that the street area is formed.  Now the effect of a house trembling will be created. Duplicate the house and move it around its bearing point of the foundation a bit and then change the Opacity to 25%.  Step 4Now we’ll create a tornado. First, make a new “tornado” layer and set it under the “land” layer. Create a five pointed star in the upper are of the illustration. Now pour over it with a radial gradient. Now turn the star into a twister with the Twirl Tool.  Duplicate it, turn it, change the scale, transparency, direction and colors to create the tornado.
|
How to Create a Crafts Inspired Vector Kids Illustration
|
Learn how to create a couple of cute and simple kids illustrations of a car and airplane using Adobe Illustrator’s basic shapes. Take inspiration from hand crafted artwork to give each graphic a plaid effect fabric texture and stitching effect.
Start work by opening up Adobe Illustrator. Grab the ellipse tool and draw a large oval on the artboard.
With the direct selection tool, select and move the lower most point vertically. Hold Shift to constrain the axis.
Next, select each of the two Bezier curves from the bottom point, and extend them outwards to create a tighter curve on the two lower corners.
Draw another oval, this time smaller and size. Position it to the front of the car body.
Use the direct selection tool to manipulate the shape to blend into the main body.
With both shapes selected, merge them together with the Add to Shape Area option from the Pathfinder tool.
Elsewhere on the artboard, draw a small square and fill with a light green.
Copy (CMD+C) and paste in front (CMD+F) the square and fill the duplicate with a darker green. Go to Object > Transform > Scale, and enter 50% in the horizontal option under the Non-Uniform section.
Copy and paste a copy of this new graphic, then rotate it by 90 degrees. Lower the transparency of both pieces to 20%. This gives us the basic repeating swatch to create the plaid pattern effect.
If the pattern is too large or small in size, go to Object > Transform > Scale, and deselect the Objects checkbox. Adjust the scale percentage to alter the size of the pattern.
Add a 2pt stroke to the shape and give it a green colouring picked from the green tones of the pattern.
Draw another oval onto the artboard, and begin manipulating the shape to form the window.
Move the Bezier curves of each of the two side points upwards to reduce the size of the corners. Aim to leave a straight edge along the bottom.
Fill the window with a light blue, and give it a stroke of white.
Grab the ellipse tool once more and draw a range of concentric circles. The accuracy doesn’t matter too much, as the odd misalignment adds to the ‘craft’ theme of the design. Give each circle a fill, and add a dashed stroke to the centre circle by selecting the ‘Dashed Line’ option in the Stroke palette. Adjust the dash and gap options to suit.
Make two copies of these groups of circles, then position them as wheels on the car body.
Draw another oval onto the artboard and position at the front of the car. Make a copy of the overall body shape and use it as a tool along with the Intersect Shape Area option from the Pathfinder palette to crop out the excess, leaving a simple headlamp graphic.
At the rear, use the Pen tool to draw some wavy shapes. Make sure the Bezier curves are smooth enough to avoid any sharp angles. Add the dark grey dashed stroke used on the wheels.
Select the window graphic, then go to Object > Path > Offset Path. Enter -2mm in the options to create a duplicate path running parallel to the original.
Give this new path a dark blue dashed stroke. Use the line tool to draw a centre line, also with the same dashed stroke.
Repeat the process with the overall body graphic, creating another -2mm offset path. Add another dashed stroke, this time with the dark grey colouring.
There we have a cute little car, inspired by the simple styles as dreamed up by kids. The mix of textures gives the craft like feel, as if it has been cut and stitched together with fabrics and thread. Next up, we’ll use similar steps to create a super duper airplane!
The airplane also starts off with a plain old oval. Use one large oval to form the main plane body, and a smaller oval as the tail fin.
Draw another repeating pattern to form the plaid style texture. This time start with a small blue square, then copy and paste in a duplicate. Fill the duplicate with a darker shade of blue, then scale horizontally by 50%. Duplicate this new graphic, set to 20% transparency and rotate by 90 degrees. Drag the whole graphic into the Swatches palette. |
How to Create a Contemporary Style Illustration Without Drawing Skills
|
There are many ways to illustrate and be creative even if you can’t draw so well. If you’ve got an imagination and some Photoshop skills, then you can create illustrations that are bang on trend. I’ll take you through the necessary steps to get you on your way to creating artworks of your own. The aim of this tutorial though, is not to teach you how to rip off the style, but to show you how to create illustrations without needing to outdraw Da Vinvi. The hope is that you’ll follow and use these techniques to work within your own style!
Final Image PreviewTake 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
 Video TutorialOur video editor Gavin Steele has created this video tutorial to compliment this text + image tutorial. AssetsHere are the assets you’ll need for this tutorial: Step 1Create a new canvas. For all the settings outlined in the tutorial to be accurate you should create a canvas at 300dpi and at roughly the same size.  Step 2Open the Dinosaur image and drag it into your working document. Use the Free Transform Tool to resize (holding the Shift key will constrain the aspect ratio) the Dinosaur image to about 150% of its original size. Then go to Edit > Transform > Flip Horizontal. Then desaturate the image by going to Image > Adjustments > Desaturate.  Step 3Select the Polygonal Lasso Tool and roughly draw around the Dinosaurs head. Copy the head and then press delete with the selection still active so it removes the head from the Dinosaur layer. Paste the head and use the Free Transform Tool to rotate the head -22 degrees and resize to 135%. Use the Eraser Tool to remove any areas where the background overlaps the Dinosaur layer. Select both layers in the Layers Palette and merge them (Layer > Merge Layers). Rename the layer “DINOSAUR.” At this point it’s worth mentioning that I deleted most of the background on “DINOSAUR” using the Polygonal Lasso Tool, but you don’t have to do a particularly good job.     Step 4Drop the “DINOSAUR” layer Opacity down to 50%. Then select the Pen Tool and set it to Shape Layers in the Options bar (Window > Options will bring it up if it’s not already visible). Select any color at this stage and start to draw a smooth shape around the head. Once you’ve plotted your first couple of points, go to the Layers Palette and drop the Fill value to 0% so that you can see the underlying layer. Some of the Anchor Points require splitting, which enables moving the Point Handles independently of each other. To do this, draw the point and then hold the Alt key whilst clicking the point with the Pen Tool and drawing out from it. Once you’ve closed the Path, put the Fill back up to 100% and rename the layer “DINO_HEAD.”    Step 5Use the Pen Tool (set to Shape Layers) to draw in the rest of the limbs minus the tail. Simplify the shapes of things and be creative while doing this. I elongated the fingers for example.    Step 6Draw in a big fat body, The overall shape of the Dinosaur should be cartoon-like. Change the Layer order in the Layers palette as shown. You should be renaming Layers as you go along, this is good practice and will cut down the wasted minutes trawling through umpteen unnamed Layers looking for something specific.  Step 7Change the color of the Shape Layers to #7e9221 by double-clicking the color thumbnail next to the corresponding Shape Layer. Draw in the tail, it’s best to draw in a basic tail shape, then add the spikes to the same Shape Layer. Do this by selecting your Shape Layer and clicking Add To Shape Area in the Options Bar.   Step 8Move “DINOSAUR” to the top of Layers Palette, change it’s Layer Blend mode to Multiply and it’s Opacity to 100% if it’s not already. Run a Smart Sharpen filter (Filter > Sharpen > Smart Sharpen)as in screen grab and then adjust the Levels (Image > Adjustments > Levels). Unlink the “DINOSAUR” Layer Mask by clicking the chain-link icon in between the Layer thumbnail and the Layer Mask thumbnail, then select the image thumbnail to edit and or transform. I used the Free Transform Tool to resize and rotate the Dinosaur image to fit it better within its Mask. I then used the Brush Tool loaded with black to fill in any parts of the texture I wasn’t happy with. The Red arrows on the 3rd screen grab indicates where those points were,    Step 9Open the Fish image and desaturate it. Use the same Smart Sharpen settings as in Step 8 to sharpen and use the same Levels as well. Copy and paste (I used the Elliptical Marquee Tool) the Fish’s eye into the working document. Use the Free Transform Tool to resize the eye to fit the face.   Step 10Make a selection from the eye by Command-clicking its Layer Thumbnail, then delete the selection from “DINO_HEAD” texture mask by selecting the Mask and pressing delete. Turn the “EYE” Blend mode to Multiply. Create a selection from the “EYE” layer, create a new layer and fill it with yellow. You may need to adjust the levels of the “EYE” to match with the dino texture. Rename “DINOSAUR” to “TEXTURE_HEAD.”   Step 11Go back to the edited fish image (the original that you sharpened and tweaked the levels, etc.) and use the Magic Wand Tool to select the white background, inverse the selection (Select > Inverse) and copy and paste it into the working document. Put it into the layer hierarchy as shown. Set the Blend mode to Multiply. Use the Free Transform Tool to rotate it -112.3 degrees, then (without applying the transform) go to Edit > Transform Warp and manipulate the grid to fit the body shape. Rename this “TEXTURE_BODY,” create a selection from “BODY” by Command-clicking its Layer Thumbnail, and use the selection to create a Layer Mask for “TEXTURE_BODY.” Again, unlink the Mask, resize, rotate and/or warp if you need to, or use the Brush Tool to draw any missing bits in. It should now look like the last image below.    Step 12Duplicate “TEXTURE_HEAD” and delete the Mask. Then use the Polygonal Lasso Tool to systematically select, cut and paste each limb. You can be fairly rough with this. Rename the new layers accordingly. Starting with “TEXTURE_RLEG” turn all new layers to Multiply and position them both over their relative Shape Layers on the canvas and in the Layers Palette. Create Layer masks for each as you did for the head and body, then use the Warp Grid to manipulate so they fill the space. You’ll need to Smart Sharpen the “TEXTURE” layers as the Warp Grid softens the pixels. You may also need to draw in some bits using the Brush Tool.      Step 13Copy “TEXTURE_BODY” and delete its Layer Mask. Rotate, resize, and Warp as before, then paint in any details with the Brush. This obviously works best with a Graphics Tablet. Rename this layer “TEXTURE_TAIL.”    Step 14Select color #f4f2ad as your Foreground color and use the Pen Tool set to Shape Layers to draw in some teeth. Group all the teeth layers and call the group “TEETH.” Drawing in the “TEETH” has thrown up some minor changes I want to make to the mouth. Select the “TEXTURE_HEAD” layer (not it’s Mask) and use the Brush Tool to draw a black (#1f1f1f) line around the teeth so they don’t border any green.   Step 15Open the Red Car image and cut it out by drawing a path around it or using the Magic Wand Tool. Copy and paste it into the working document. Desaturate the car and then adjust the Levels as shown below. Run a Smart Sharpen filter (with the same settings as in Step Create a selection from the car by Command-clicking its layer thumbnail, then create a new layer directly below it and fill with #d23e3e. Set the “RED_CAR” layer to Multiply. Create another layer between the “RED” and the “RED_CAR” layers and use the Brush Tool to draw in some lighter parts with the color #d9d9d9. Finally, select all three car layers and go to Layer > Group Layers. Call the Group “CAR” and give it a final tweak with the Free Transform Tool. To get the car to fit in with the Dinosaur you’ll need to do some creative reshuffling of the Layers in the Layers palette. Check out the final screen grab to see how the top of your Layers Palette should look.     Step 16The following step might be pretty tricky to follow. Remember these selection shortcuts and you should do alright though. To make a selection from any layer containing pixels you simply Command-click the layer thumbnail. In order to create a selection from one of your Shape Layers you must Command-click the Path thumbnail next to the color thumbnail. You don’t need to have this layer selected to create a selection from it. In order to create multiple selections you must hold SHIFT + Command-click. This will add to the current selection, to then subtract you must hold Alt + Command-click. Look at the image below to see what happens when I make a selection from “BODY” and then subtract the “RIGHT_ARM,” “DINO_HEAD,” “RIGHT_LEG,” and “CAR.” |
and then use the Free Transform Tool to rotate and resize it to fit in the Dinosaurs hand.Create a Rolling Stones Inspired Tongue Illustration
|
The bright red Rolling Stones tongue and lips logo is a graphic design icon, and has been a pop culture fav for years! I don’t think you can beat it, so we’ll not create a direct copy of the original in this tut. Instead, let’s take a look at drawing our own Stones inspired tongue graphic, starting with a quick pencil sketch and finishing with a vector based graphic in Adobe Illustrator.
Start work with pencil and paper, use the original Rolling Stones logo as inspiration and follow the rough lines and shapes to produce a similar drawing.
Warm up your scanner and digitise your sketch. Save the scan to your desktop.
Open up Adobe Illustrator and go to File > Place. Position the sketch on the artboard, lower the transparency then press CMD+2 to lock the item in place.
Begin tracing each element of the sketch with the Pen tool. Use just a black stroke to visualise the paths on screen. Aim to use large Bezier curves to maintain a smooth outline without any harsh angles. When the path moves onto a different element, such as the tongue, simply close the path with a few rough lines. Once the tongue shape is filled with colour, this rough line won’t be seen.
Trace around the outlines of every other element to give separate shapes for the lips, tongue, mouth opening and each tooth.
Fill each shape with a relevant colour, so use red for the lips and tongue, black for the mouth opening and white for the teeth.
Notice how the teeth use rough outlines on the upper edges? These will need cropping down to fit under the lips. Duplicate the mouth opening shape, and press CMD+Shift+] to send it to the top. Group all the teeth together then use the Intersect Shape Area option from the Pathfinder palette to trim the teeth to size.
Select all the objects and add a black stroke. The original doesn’t make use of outlines, but we’re going a style of our own!
Duplicate the lips and tongue and send them to the top of the stack using the CMD+Shift+] shortcut. Use the Add to Shape Area option from the Pathfinder palette to merge them together.
Next, add a large black 11pt stroke to the shape. Align the stroke to the outside using the tiny icons in the Stroke palette. Press CMD+Shift+[ to send the shape back to the bottom of the stack.
Select the tongue and mouth graphics and increase their stroke size to 6pt. Also align these to the outside.
Then, select all the teeth graphics and increase the stoke to 3pt. This variation of stroke weights is a popular technique in Illustration.
Begin creating a variation of tone by adding a Linear Gradient across the lips, select a bright red and a slightly darker red swatch.
Add the same gradient fill to the tongue, adjust the direction to flow diagonally across the tongue, ranging from the shadows inside the mouth to the lighter tip. |
GoMedia Arsenal is Going Ape – Comment to Win One Complete Vector Set
 Win GoMedia Arsenal – Set 16GoMedia Arsenal entire Set 16 Package includes 7 individual packs). You get 225 high quality and detailed vector pieces. Included in the set are Primates, Color Radials, Serpents, Winged Scrolls, Maps of the USA, Web 2.0 Badges, and Vintage Elements. One lucky commenter will win this set!  For the chance to win this set all you need to do is comment. Make sure to include your correct email address with your comment so that we can contact you. This giveaway is open worldwide, but make sure to get your comment in before midnight this Friday October 30th, 2009, Pacific Eastern Standard Time. Please note: Envato staff and people who have written more than two tutorials/articles for a Tuts+ site are not eligible to enter. Download Free Set SamplesJust click on the image below to download two free Vector Ape graphics, which are available free to everybody! Enjoy!  Subscribe to the Vectortuts+ RSS Feed to stay up to date with the latest vector tutorials and articles. |
|
Halloween Horror Fest of Over 50 Scary Vector Illustrations Posted: 28 Oct 2009 05:03 AM PDT To get in the Halloween evil spirit we’ve looked at loads of creepy vector illustrations. In the last two parts of this series we looked at over 100 vector illustrations of both Brain-Sucking Zombies and Bone-Crunching Skulls. If you need some quick inspiration for some super-evil, vector Halloween work, then don’t worry because we’ve got you covered! Today we’ve let the evil, vector hoards loose. Now it’s time to burn your eyes with this assortment of vector Halloween horrors! Whoooahaha!
                       |
How to Make Super-Sharp, Vector Swords
In this tutorial I’ll show you how to draw a sword in Illustrator, using the Rectangle Tool, gradients, and other Illustrator tools. Actually the tutorial isn’t very hard, let’s see the final result that is our goal first!
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
Here is the illustration we’ll be creating.
Step 1
Open a new document, pick the Rectangle Tool (M), create a rectangle like the one shown below, and fill it with a linear gradient with colors from R=213, G=237, B=254 to R=142, G=158, B=171.
Step 2
Now pick the Add Anchor Point Tool (+) and add two points in the bottom part of the rectangle. Now use the Convert Anchor Point Tool (Shift + C) to edit the two key points that you added, as showed below. Select the bottom two points and go to Object > Path > Average (Alt + Command + J) and in the new open window turn on Both, and click OK.
Step 3
Pick the Rectangle tool (M), create a rectangle in the bottom part of the first rectangle as shown.
Step 4
With the rectangle you created earlier selected, pick the Add Anchor Point Tool (+), add two points in the positions as shown and edit them as indicated below. Fill them with the same gradient from Step 2, open the Pathfinder panel and click on Add to Shape Area.
Step 5
Now copy the newly created shape from Step 4 using Command + C followed by Command + F to paste in front. Decrease the copy’s size from the right and the left side. To do this, pick the Selection Tool (V), click on one of the side points, then press and hold the Alt key and slide it a little bit inwards.
Step 6
With the shape whose size you just decreased still selected, pick the Direct Selection Tool (A) and delete the points on the right side. To do this, click on the point which has to be removed and press the Delete key. Then pick the Pen Tool (P), click on the top point in the top part in the middle, and then on the point at the bottom, and fill with a Linear Gradient.
Add three more Gradient sliders, for the first one from left to right select this color: R=30, G=73, B=123, for the second one R=54, G=102, B=162, for the third one R=0, G=97, B=148, for the fourth one R=91, G=127, B=173 and for the last fifth slider R=124, G=156, B=189.
Step 7
Copy the shape you filled with a linear gradient and apply Command + C followed by Command + F, flip it horizontally, and then fill it with the color R=100, G=136, B=168.
Step 8
Now copy the shape you filled with a linear gradient using Command + C followed by Command + F. Now turn off the fill color, delete the top-right point of the shape using the Direct Selection Tool (A), and apply a white Stroke with a weight of 1pt.
Step 9
Copy the shape you created in Step 4 using Command + C followed by Command + F. Remove the top points of the copy using the Direct Selection Tool (A), also remove the right point. Use the Add Anchor Point Tool (+) to add one point as shown below, then using the Direct Selection tool (A) edit the top key point as indicated. Now use the Pen Tool (P) to close the path like we did in the previous steps. Fill with color R=121, G=134, B=158 and reduce the Opacity to 70%.
Step 10
Copy the last shape you created using Command + C followed by Command + F, flip it horizontally, change the Fill color to white and reduce the Opacity to 50%.
Step 11
Copy the shape from Step 4 once more using Command + C followed by Command + F. Now we need to move the shape on top of all the other shapes. With the copy still selected, go to Object > Arrange > Bring to Front.
Step 12
As the shape is still selected, pick the Direct Selection Tool (A) and this time delete the bottom points of the shape and fill with a linear gradient as shown.
Step 13
Create a rectangle using the Rectangle Tool (M) on top of all the other shapes and position as shown, then fill it with a linear gradient. To do this, open the Gradient panel and select Type: Linear. You need 3 Stop color sliders all together. For the first one from left to right select color R=84, G=110, B=114, for the second one R=12, G=20, B=39, for the third one R=21, G=27, B=48 and reduce the Opacity to 75%.
Step 14
Copy the shape from Step 4 using Command + C followed by Command + F. And now we need to move it on top of all the other shapes. To do this, go to Object > Arrange > Bring to Front.
Continue Learning…