Get found on the web
Quality Web Design for Small
to Medium Businesses in New Hampshire
An article I was reading about jquery
Today we will learn a new drawing tool for Adobe Illustrator called the Dynamic Sketch Tool — one of the tools of the new DrawScribe plugin. The Dynamic Sketch Tool has many convenient features that makes your daily creative work much easier. Mastering the new tool should not take you much time as it’s easy to manage and its user-friendly features are quite understandable.
An article I was reading about photoshop
I honestly think this is one of the most interesting and creative eras for advertisement; some ads are really memorable and funny.
So, inspired by that I decided to make a tutorial on how make a retro poster for a web designer.
After reading the tutorial, you can download the Illustrator source file at the end of the post for reference.
I hope you guys like it and please be sure to share your results and questions with us in the comments….
Here’s a full preview of the poster that we will be creating:
Let’s start by opening Adobe Illustrator. Create a 21 x 27 cm (8,27 x 10,73 inches) canvas in CMYK mode with 300 dpi resolution.
When designing a poster/flyer, I like to place some guides on the edges. You can make then visible by pressing command + R / Ctrl + R. Just grab them and place. I used a 1 cm distance on each border.
So, first you should download this texture we’re going to use on the background, you can get it at
The next thing you should do is to download the Flyboy BB font; you can get it
Make an individual text box for the word “The” and use a blue color on the fill. The CMYK values can be viewed in the second screenshot bellow.
Let’s start by creating a rectangular shape with spiked ends that will be used as background to the secondary text. You can create it using either the rectangle tool (M) or the pen tool (M).
Using the selection tool (V) + alt you can copy the original shape. Then go to Transform > Reflect, and choose to reflect on the vertical Axis.
In order to unite the shapes, place both as shown below, then go to the pathfinder panel, and choose the option called Unite.
Here’s another font you should download, Bazar Medium; get it
Using the pen tool (P) I made these little shapes to stylize the text a bit. You can copy and reflect these, so they are symmetrical.
I always liked those rounded rectangles used as a sort of ad plate. So, using the rounded rectangle tool, create the basic shape and then using the direct selection tool (A), adjust each point until it looks like the shape below.
Let’s add a linear blue to white gradient. Go to the gradient panel to set the colors as below. Using the gradient tool (G), you can adjust the amount and direction of the gradient.
Halftone is a really stylish effect that can bring that old fashion aesthetic to your layout. Go to Effect > Pixelate > Halftone. Set maximum radius to 10 pixels and make sure all the channels are at 0. This will make the gradient monochromatic.
Using the text tool (T) write the headline “Webdesigner Depot proudly presents” using the Bazar Medium font.
Next, let’s draw a retro ribbon shape, use the pen tool (P) and add the previous blue color. It may look a bit like tooth paste, but let’s add some folded edges on it next.
Draw the folded border using the pen tool (P). Duplicate, reflect, and place it on the top.
Add some little stylized lines on each side. This may take some time, but if you duplicate and simply adjust each using the direct selection tool (A) it will be quicker.
Copy and paste it twice, and then let’s add some characteristics like “Strong,” “Smart,” and “Fast.” Again, use the Bazar Medium font.
Let’s make a simple arabesque using the pen tool (P), you can also try to do it using the brush tool (B). Then just duplicate and place it below.
Use the line segment tool (\) to create these lines, then duplicate them like this. Use an italic font to write the following text; I used Gotham Bold Italic on this sample. Using the text tool (T), fill each line with one part of the sentence.
Those old promotional splashes can be really funny, let’s draw one. First use the crystallize tool, set the parameters of the tool by just clicking once on it’s icon; you can see them below. Now what you do is create a circle using the ellipse tool (L) and then use the crystallize tool above it. Just make sure you made the circle on the right scale.
Lets add the previous linear blue gradient. Use the gradient tool (G) to place it in the right direction.
Let’s use the halftone effect again. This time let’s use a maximum radius of 16 pixels.
Copy this splash and change its fill to the previous red color. Send it to front.
Use the text tool (T) to write “HIRE NOW” using Bazar Medium. Duplicate the text, pick a black fill and send it to back.
This is the last font you will need to download, this one is called Headline. As the name says, it’s really useful for headlines. Get it
I also added a few slashes below it, just to make a bit more dynamic.
I wanted to draw a light bulb to make things a bit more obvious. So first use the ellipse tool (L). Then make the light effects using the pen tool (P).
Let’s not forget to add the base of the light bulb. Drawing is about abstraction so don’t worry if it’s a bit abstract. Distance will tell what it looks like.
Don’t forget to draw the core and a few lines outside the circle. Make it a bit messy, so it look likes an error on the printing for a more vintage feeling.
Our character is the hardest part of this tutorial, but follow my instructions and everything will be a piece of cake. I wanted to make a character similar to those men on the 50s ads, with an “ice cream” hair.
Let’s begin with the eyes. First draw an ellipse using the ellipse tool (L). Draw another ellipse in the border of it, then go to the pathfinder panel and choose the option called Minus Front.
We’re going to use only the pen tool (P) from now on. It’s easy, you will see. So, draw this eye shape, then duplicate and resize it using the the selection tool (V).
Now draw a really simple round nose. The mouth, as you can see, is basically two lines.
Let’s add some wrinkles around the mouth. Add a line in the mouth to represent the teeth.
Add a few lines in each side to shape the tongue and a wrinkle in the middle.
I call this kind of chin by “butt chin,” I think I don’t have to explain why, do I? Just kidding guys. Draw his cheeks using the pen tool (P).
I decided to make a head without the body, so you just draw these lines representing the neck.
The ear is quite simple, just add a small detail to represent the cartilage.
Back to the mouth, make a shape over the tongue using a red fill, then use the blending mode called Multiply. Also take out one of his teeth to add some humor.
While drawing him, I though that a redhead guy would be cool, but he needs a special haircut.
But, first let’s take care of the eyebrows. Just draw the first one, copy, reflect, and place it on the other side.
Let’s add some cool side burns on each side, the left one is thinner, don’t forget it.
The old fashioned “Ice Cream” hair, some may dislike, but it fits perfectly here. Draw it in two parts, like it was combed.
Using the ellipse tool (L) I added some tiny circles on each eye.
You may say the hair is too flat, so let’s add some white highlights to represent reflections.
Draw all around his face, watch for making some holes on parts like the eyes and mouth. Add a yellow to white gradient (the same yellow used all over the tutorial). Adjust the direction using the gradient tool (G). Then go again to Effect > Pixelate > Halftone. Set the maximum radius to 8 pixels.
First of all, you got to use the Multiply blending mode on each of the previous elements. Then use the rectangle tool (M) to create this beige radial gradient over the illustration. Then go to the blending modes and choose the one called Multiply.
Another paper texture to download, get it
And here’s the last texture, get it
Now you can show the background texture from the beginning and it’s done.
Well guys, I hope you had fun designing it, go on and experiment more often with type, also research about 50′s design, you may find some really interesting samples. You can download the illustrator file
Marcos Torres is a Brazilian freelance illustrator/art director and also a contributor for Abduzeedo as a tutorial designer. You can get in touch with more of his work by accessing his
Have you followed this tutorial? Share your results and experience below…
An article I was reading about jquery
In this tutorial we will learn how to create a complex 3D object. The creation of complex shapes is the job of the VectorScribe plugin. In addition to learning the features of its tools, we will study the basics of 3D modeling and a few basic techniques, such as blend, work with gradients, color and gradient mesh objects.
An article I was reading about jquery
Vector artists often use raster images in their works as a reference. To create a color palette based on a raster image is always a laborious process; it is necessary to use the Eyedropper Tool and rely on your "sense of color” in order to feel whether that was the right pixel that you got with this tool. In this tutorial, I’m suggesting a method that will make this job automatic.
An article I was reading about photoshop
Just in case you’re not familiar with this character, so here’s
Most of the techniques taught in this tutorial are pretty basic, so if you’re a beginner you shouldn’t have problems following it.
By the time this tutorial is finished, you’ll have a better understanding of how to work with shapes and gradients in Illustrator, as well as plenty of experience using the Pen Tool.
You should, of course, have a basic familiarity with the Illustrator interface and tools before you begin.
As always, let’s first make a sketch of the scene we’re going to render later. My concept art is of a Minion cleaning your monitor using a squeegee and a bucket.
So let’s open Adobe Illustrator and create (the shortcut is ctrl + N/command + N) an A4 canvas (29,7 x 21 cm / 11,69 x 8,27 inches), 300 DPI, RGB.
Create a rectangle using the rectangle tool (M) on the bottom of the canvas.
Add a grey radial gradient using the gradient tool (G) . Use a 0 % opacity on the white color.
You can access each color panel by double-clicking on each one. Refer to the color values on the images bellow.
Access the rounded rectangle tool panel (it’s an icon next to the rectangle tool icon) by selecting the tool, then clicking once in the canvas. Set the width, height and radius as the picture bellow:
Add a yellow radial gradient to it using the gradient tool (G). Use colors similar to the ones showed on the panel bellow.
Using the direct selection tool (A), adjust the bottom vector point to make it more fat.
Let’s draw the shoe using a cool trick: using the ellipse tool (L) create two spheres. They should overlap on one edge, as shown below.
Access the pathfinder panel and choose the option called Unite.
With a little help from the pencil tool (N) , adjust the shape until you get this shoe shape:
Add a black radial gradient by using the gradient tool (G).
Duplicate the shape using the selection tool (V) + alt, then right click on it and go to Transform > Reflect.
Choose to reflect the Vertical Axis. Then just resize and place it bellow the body using the selection tool (V).
Using the pen tool (P), create this half moon shape on the bottom of the body shape.
Create two rectangles for legs above each shoe using the rectangle tool (M).
And make a big rectangle on the center of the half moon, just like this:
Select all these shapes, then access the pathfinder panel and choose the option called Unite.
Use the direct selection tool (A) to adjust the shape to look more like overalls.
Add a linear blue gradient using the gradient tool (G).
Using the pen tool (P), create a little pocket. Use the eyedropper tool (I) to add the same gradient used on the overall.
Use the pen tool (P) to create each overall shoulder strap.
Add two buttons by creating them with the ellipse tool (L), add a black radial gradient to it after.
Using the pen tool (P) make this “stroke only” shape.
Then access the stroke panel and add a 3 pt dashed line. It gives a stitched effect to the overalls, in the shape of pockets.
Finally add a rounded circular shape using the rounded rectangle tool.
Let’s make a quick design of the Gru logo. First make a perfect circle using the ellipse tool (L) + shift. Make a square over the center of the circle using the rectangle tool (M) and rotate it 45 degrees.
On the pathfinder panel, find the option called Minus Front. This option is quite useful when you need to make some specific holes on a shape.
Make another circle on the center of the squared hole using the ellipse tool (L).
Add a thin rectangle using the rectangle tool (M). Duplicate it and use the Minus Front option on the two shapes (big and little circles).
Finally add another thin rectangle using the rectangle tool (M) like the sample bellow. Then place it on the chest of the Minion body.
Using the pen tool (P), draw a little mouth on the head of the Minion.
Now using again the pen tool (P) draw a little tongue inside the mouth, give a pink linear gradient to it.
Using the rounded rectangle tool, create his teeth. Align them a bit randomly to look funny and weird.
Add a light grey radial gradient on all of them.
Duplicate the mouth shape, send it to front, now select all the teeth and make a clipping mask (ctrl + 7 / command + 7).
The Minions wear some big and funny glasses. So, first create a big circle using the ellipse tool (L) + shift.
Use the pen tool (P) to create the grabber and the strap pieces.
Add a metallic linear gradient to the big circle and the grabber, also add a black gradient to the strap shape.
Make a circle inside the bigger circle using the ellipse tool (L).
Make the iris and the pupil using again the ellipse tool (L).
Now, just add the correct gradient and colors to the shapes to get the effect we want.
Add with the pen tool (P) these half moon shapes on the bottom and top of the eye, to look like he’s laughing at something.
To create the other eye, just duplicate and re-size the eye shape using the selection tool (V).
Make the stripe and grabber with the pen tool (P) and use the eyedropper tool (I) to copy the same gradients.
He’s not totally bald so we can add a few hair using the brush tool (B) with an Oval brush, add them randomly, just make a division on the middle.
Using the pen tool (P) create this arm shape.
Use the ellipse tool (L) to create the hand, first make a big circle, then three smaller ellipses.
Add a cuff to the glove using the pen tool (P).
Add the same gradient used on the stripe of the glasses, just make sure it’s adjusted like the picture bellow. Make this adjustment using the gradient tool (G).
Add the same radial yellow gradient used on the body on the arm, use the eyedropper tool (I) to copy.
We’re going to repeat the procedures, first create the shape of the arm using the pen tool (P).
Use the eyedropper tool (I) to add the same gradient used on the body.
Make these two shapes using the pen tool (P). We’re going to draw the fingers later; you’ll understand why soon.
Add the same black gradient on these glove shapes.
Using the rounded rectangle shape create this shape, like a broomstick.
Add this support shape using the pen tool (P).
The squeegee part is basically just a rectangle created using the rectangle tool (M) and then adjusted using the direct selection tool (A) to give it a 3D appearance.
One more shape using the rounded rectangle tool and time to add some color to it.
Pretty simple: copy the black gradient and add to the squeegee. The rest is just a brown linear gradient. Adjust the ranges using the gradient tool (G).
Using a blue gradient, I also added little water drops using the pen tool (P).
Now that we have the broomstick shape over the hand shape, let’s create three ellipses using the ellipse tool (L), this will be the fingers.
Use the eyedropper tool (I) to add the same gradient used on the other glove.
Using the pen tool (P), create this bucket shape, then using the ellipse tool (L) create this on the top of the shape.
Add a grey radial gradient on it.
And add a linear metallic gradient to the bucket body.
Create a little circle using the ellipse tool (L), add a grey radial gradient to it.
Make another ellipse inside the bucket and add the same gradient used on the drops by using the eyedropper tool (I).
Add a handle using the pen tool (P) and add a metallic gradient to it.
Create an ellipse with the ellipse tool (L), then add a white to black gradient. Go to the transparency panel and choose the blending mode called Multiply. Set the opacity to 50%.
Almost done, now we just need to simulate a blurred monitor. Create a new layer (ctrl + L/command +L) for this part.
First make a rectangle that fits over the canvas using the rectangle tool (M).
Add a light grey radial gradient and set the opacity to 50%.
Now create some rectangles using the rectangle tool (M).
Select all the paths. Access the pathfinder panel and choose the option called Minus Front.
We just need to add some blur, so go to Effect > Blur > Gaussian Blur.
Well, I hope you got a deeper understanding about gradients and other tools used in this exercise. If you have any questions or tips, please share it with us in the comments.
Download the illustration and final Illustrator files
About the author: Marcos Torres is a brazilian freelance illustrator/art director and also a contributor for Abduzeedo as a tutorial designer. You can get in touch with more of his work by accessing his
An article I was reading about jquery
Throughout this tutorial you will be taught step-by-step to create a green pig from the well known game, Angry Birds.
An article I was reading about jquery
In this vector tutorial we will learn how to create a seamless pattern in the style of Russian Khokhloma. We will learn the techniques of creating the basic elements and steps of creating an ornament. Seamless pattern is very high in demand, as they are used in the textile industry and for creating of the backgrounds. After studying this lesson, you learn how to create these ornaments on a professional level.
An article I was reading about jquery
Simple tutorial for Adobe Illustrator – how to draw a plasma fibers, neon lights and abstract light effects
An article I was reading about jquery
Looking to learn the basics of Adobe Illustrator? In this tutorial we’ll use various tools and techniques to create a simple vector robot character. With this robot being made of lots of basic shapes it makes for a great tutorial for beginners to get to grips with the Illustrator application.
An article I was reading about photoshop
It’s got a 3-D feel, but it’s done using only gradients. So, stick with us; we’re going to use and see some really nice easy tips for creating this little monster. The tutorial is intended for beginners.
We’ve included the Illustrator file at the bottom of this post, so you can download it to learn more from it.
If you followed this tutorial to create your own little monster, please share your results and experience with us in the comments.
First of all, open Illustrator and make a 40 × 40 cm canvas. Now, using the Rectangle tool (the shortcut is M), create a square that fits over the canvas.
Using the Gradient tool (G), create the following radial brown gradient. You can set it exactly by opening the Gradient panel and using the colors below. Copy the RGB values to get them exact.
Place the gradient at the top of the square using the Gradient tool (G), just like the picture below. Then, create another rectangle at the bottom of the canvas using the Rectangle tool (M). Copy the same gradient using the Eyedropper tool (I), then place it at the bottom again using the Gradient tool (G).
Using the Ellipse tool (L), draw this oval. Rotate it using the Selection tool (V), and then adjust it a bit using the pencil tool (N).
Let’s add a nice gradient to it. Go to the Gradient panel, and set the colors to what is shown below.
Adjust the range of the gradient using the Gradient tool (G). Now create another circle using the Ellipse tool (L); it will be one of the eyes.
Open the Gradient panel, and create this radial orange gradient. Use the screenshots below to match the colors.
Duplicate it using the Selection tool (V), and drop the layer to the back.
Repeat the process of making the oval, and then just copy the gradient using the Eyedropper tool (I).
Using the Ellipse tool (L), create this ellipse that looks like a fly wing; you can adjust it using the Pencil tool (N). Open the Gradient panel and create this radial gray gradient, using the screenshots below to match the colors.
Select the wing, and then open the Transparency panel and choose the blending mode called “Multiply.”
Now, duplicate the wing using the Selection tool (V) + Alt, and distribute it along the body.
Now let’s create a mohawk. Using the Pen tool (P), draw this spiky shape and place it behind the first eye.
Using the Gradient tool (G), create this purple-pink radial gradient, open the Gradient panel, and set the color as seen below.
Again using the Pen tool (P), create triangles along the hair. And using the Eyedropper tool (I), copy the same gradient, being careful with its range.
Let’s work on the other parts of the body now. Using the Pen tool (P), draw the shape below, which will be the neck of the creature. Add some gradient using the Gradient tool (G), and then open the Gradient panel to set the color as seen below.
Repeat the same procedure of drawing the shape with the Pen tool, but this time use the Pencil tool (N), which will make drawing the fingers a little easier. Then just copy the same gradient for the neck, body and head using the Eyedropper tool (I).
Duplicate the arm using the Selection tool (V) + Alt, and then reflect and resize it on the other side.
Repeat the process for the legs. Don’t forget: our little monster has three legs!
Draw the rounded shape below using the Pen tool (P). Then add an orange radial gradient using the Gradient tool (G). Set the colors according to the screenshots below.
Doing the rest of the chest is really about drawing a round shape using the Pen tool (P), duplicating it with the Selection tool (V) + Alt, and then adjusting them with the Direct Selection tool (A). This will take some time.
Using the Ellipse tool (L), draw a circle on the first eyeball. Then, using the Eyedropper tool (I), copy the radial gradient from the hair, and place it as seen below.
Copy the circle using the Selection tool (V) + Alt, and select a radial gradient, going from white to transparent, to lay over top.
Using the Ellipse tool (L), draw a little circle, and add a black radial gradient to it.
Using the Ellipse tool (L), draw a little white circle, and place it as seen below. Now, repeat the same process, but smaller this time.
Copy this pupil, and resize it on the other side.
Shading the monster isn’t so easy. If you are a beginner, you’ll need some skill with the Pen tool (P). Basically, you have to draw the shape, add a gray gradient and then set the blending mode to “Multiply.”
For the feet, we’re going to use a smoother shadow. First, draw circles using the Ellipse tool (L), and then go to Effect → Blur → Gaussian Blur, and set the radius to 25 pixels.
Marcos Torres is a Brazilian illustrator and art director who works for a marketing agency and for Abduzeedo as a tutorial designer. You can see more of his work on his
If you followed this tutorial to create your own little monster, please share your results and experience with us!
If you find an exclusive RSS freebie on this feed or on the live WDD website, please use the following code to download it: O1Rs1S
Portsmouth Media is on the web.
