Create a Rolling Stones Tongue

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.

Continue with the Pen tool and draw a large area of shading around the inside of the mouth and down the underside of the tongue. Follow the contour of the tongue when near the centre line to give the impression of a shaped surface. Once again, fill with black, switch to Multiply and drop to 10% transparency.

Add some final shading to the lips, following the underside of the top lip and creating a shadow from the tongue. Remember with all shading to pay attention to the visible lines across the graphics, but quickly close out the paths by roughly clicking within the black stroke lines.

On the top lip, draw a couple of round highlights with the Pen tool. Fill with white and scale into place.

Select the whole outline shape and duplicate. Send the copy to the top and clear out the stroke. Go to Object > Path > Offset Path and enter 5mm in the options.

With the new expanded shape selected, add a white fill and subtle grey outline. Send this object to the bottom of the stack (CMD+Shift+[).

Add a finishing touch by generating a Drop Shadow on the white outline. Go to Effect > Stylize > Drop Shadow. Alter the opacity to 14% and click Ok.

The final graphic has plenty of impact and depth with the varied outline widths, the gradient fills and the shadows and highlights. All techniques that can also be used on any illustration project, whether it’s an icon, a character or a recreation of a famous rock band’s logo!

A detailed ipad tutorial

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 theApple 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.

Use the Pen Tool to draw a smooth flowing shape across the dock. Complete the shape with rough points back to the start. Fill this with white and drop the opacity to around 13%.

CMD-click the dock layer to load the selection. Press CMD-Shift-I to inverse the selection, then delete out the excess from the dock reflection layer.

All the iPad interface now needs is a collection of icons. I found this fantastic set of Apple style icons from Deviant Art designer Ikon. Download a selection and begin laying out the icon grid on the iPad screen.

Add a Drop Shadow to one of the icons, using settings of around 50% opacity, 2px distance and 9px size. Right click the layer and Copy Layer Style, then Paste this style on the following icon layers.

Select the four dock icons and duplicate the layers. Press CMD-E to merge these layers together, then press CMD-T to transform. Right click and selection the option to flip vertically, then position into place as reflections. Add a layer mask and fade out the reflections with a soft brush or a gradient, then reduce the opacity to suit.

That’s the iPad icon complete. Don’t forget to add the obligatory surface reflection by copying the whole selection, then flip and position on the underside of the iPad body.

via blogspoongraphics