A huge collection of 3400+ free website templates JAR theme com WP themes and more at the biggest community-driven free web design site
honeyTextEffect0

How to Create a Detailed Honey Text Effect in Adobe Illustrator

In the following steps you will learn how to create a detailed honey text effect in Adobe Illustrator. You will learn how to create a subtle honeycomb background using basic tools, effects and blending techniques. You will learn how to create some simple brushes and how to add shading and highlights using basic blending and masking techniques. Finally, using basic vector shape building techniques, the Round Any Corner script and the Blend Tool you will learn how to create a simple spoon illustration.

Hit Command + N to create a new document. Enter 600 in the width box and 320 in the height box then click on the Advanced button. Select RGB, Screen (72ppi) and make sure that the Align New Objects to Pixel Grid box is unchecked before you click OK.

Enable the Grid (View > Show Grid) and the Snap to Grid (View > Snap to Grid). For starters you’ll need a grid every 5px. Simply go to Edit > Preferences > Guides > Grid, enter 5 in the Gridline every box and 1 in the Subdivisions box. You should also open the Info panel (Window > Info) for a live preview with the size and position of your shapes. Do not forget to set the unit of measurement to pixels from Edit > Preferences > Units > General. All these options will significantly increase your work speed.

honeyTextEffect1

Pick the Rectangle Tool (M), create a 610 by 330px shape, fill it with R=255, G=244, B=193 and place it as shown in the first image. Make sure that this shape stays selected, focus on the Appearance panel (Window > Appearance) and add a second fill using the Add New Fill button (pointed by the little, blue arrow in the following image). Select this new fill, lower its Opacity to 40% and add the radial gradient shown in the second image. Move to the Layers panel (Window > Layers) and simply lock this rectangle to make sure that you won’t accidentally select/move it.honeyTextEffect2

For the following step you will need a grid every 1px. So, go to Edit > Preferences > Guides & Grid and enter 1 in the Gridline every box. Focus on the top, left corner of your artboard. Pick the Rectangle Tool (M), create an 11 by 13px shape, fill it with white and place it as shown in the first image. Make sure that this new rectangle is selected and go to Object > Path > Add Anchor Points. Keep focusing on this white rectangle and grab the Direct Selection Tool (A). Select the top, left and right anchor points and drag them 3px down then select the bottom, left and right anchor points and drag them 3px up. In the end your white vector shape should look like in the third image. Make sure that it stays selected and focus on the Appearance panel. Select the fill and lower its Opacity to 35% then add a stroke. Select it, set the color at white, align it to inside and lower its Opacity to 60%.

honeyTextEffect3

Reselect the hexagonal shape, make sure that the entire Path is selected and go to Effect > Distort & Transform > Transform. Enter the properties shown in the top, left window (in the following image), click OK and go again to Effect > Distort & Transform > Transform. Enter the properties shown in the top, right window, click OK and go one more time to Effect > Distort & Transform > Transform. Enter the properties shown in the bottom window and click OK. Move to the Layers panel and lock this shape shape.

honeyTextEffect4

Pick the Ellipse Tool (L), create a 1px circle and fill it with white. Make sure that this tiny circle is selected, open the Brushes panel (Window > Brushes) and click on the New Brush button. Check the Scatter Brush box and click OK to open the Scatter Brush options window. Enter all the properties shown in the following image and click OK. Your new scatter brush should now show up in the Brushes panel.honeyTextEffect5

Return to the Brushes panel and click again on the New Brush button. Check the Calligraphic Brush box and click OK to open the Calligraphic Brush Options window. Name it “Calligraphic Brush 1″, set Angle at 0 degrees and the Roundness at 100% then drag the Diameter slider at 8pt and click OK. Return to the Brushes panel and hit again that New Brush button. Again, check the Calligraphic Brush box and click OK. Name it “Calligraphic Brush 2″, set Angle at 0 degrees and the Roundness at 100% then drag the Diameter slider at 10pt and click OK. In the end your new calligraphic brushes should show up in the Brushes panel.

honeyTextEffect6

Disable the Grid (View > Hide Grid) and the Snap to Grid (View > Snap to Grid). Pick the Type Tool (T) and add your piece of text. Use the GoodDEog font, set the size at 100pt and the color at R=254, G=186,, B=2. Make sure that your piece of text is selected and hit Shift + CTRL + O (or go to Type > Create Outlines). Move to the Layers panel and select the resulting group of shapes. Open the Pathfinder panel (Window > Pathfinder), click on the Unite button then hit CTRL + 8 (or go to Object > Compound Path > Make). Return to the Layers panel, double click on this orange compound path and simply name it “text”. Naming this shape will make it easier for you to find it later.

honeyTextEffect7

Pick the Brush Tool (B) and focus on the Brushes panel. Use “Calligraphic Brush 1″ and “Calligraphic Brush 2″ to add the paths that will make the honey drips. Make sure that all these new paths are selected and go to Object > Path > Outline Stroke. Select the resulting group of shapes, click on the Unite button from the Pathfinder panel then hit CTRL + 8 to turn them in to a Compound Path. .

honeyTextEffect8

Select the black compound path along with “text”, click on the Unite button from the Pathfinder panel then hit CTRL + 8. Make sure that this new compound path has the fill color set at R=254, G=186, B=2 then move to the Layers panel and name it “text”.

honeyTextEffect9

Go to Edit > Preferences > General and make sure that the Keyboard Increment is set at 1px. Select “text” and go to Object > Path > Offset Path. Enter a -3px Offset and click OK. Select the resulting shape, fill it with R=237, G=28, B=36 and move it 2px up and to the left using the arrow button from your keyboard.

honeyTextEffect10

Reselect the red compound path and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px up and to the left using the arrow buttons from your keyboard. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Make sure that the resulting group of shapes is selected and fill it with white.honeyTextEffect11

Focus on the Layers panel, open the existing group and select one of those thin shapes. Fill it with the linear gradient shown below and change the Blending Mode to Overlay. Make sure that this thin shapes stays selected, open the Graphic Styles panel (Window > Graphic Styles) and simply click on the New Graphic Style button.honeyTextEffect12

Reselect that entire group of thin shapes and simply click on the saved graphic style. Select the red compound path, replace the red with white and change its Blending Mode to Soft Light. Reselect both, the group and the compound path edited in this step and Group them (CTRL + G). Move to the Layers panel, double click on this new group, name it “frontHighlights” then lock it.

 

honeyTextEffect13

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px down and 3px to the left. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and lower its Opacity to 50%.

honeyTextEffect14

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px up and 3px to the right. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=179, G=71, B=54 and lower its Opacity to 50%.

honeyTextEffect15

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px up and to the left. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with white and change the Blending Mode to Overlay.

honeyTextEffect16

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px up and 2px to the left. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and change the Blending Mode to Darken.

honeyTextEffect17

Select “text” and go to Object > Path > Offset Path. Enter a -4px Offset and click OK. Fill the resulting shape with R=255, G=131, B=0 and lower its Opacity to 75%.

honeyTextEffect17

Select the five compound paths made in the last five steps and Group them (CTRL + G). Focus on the Layers panel, make sure that this new group is selected and lower its Opacity to 75%. Name it “highlights” then lock it.

honeyTextEffect19

Pick the Paintbrush Tool (B), select your scatter brush and draw some brushes over your text as shown in the following image.

honeyTextEffect20

Select all those scatter brushes and Group them (CTRL + G). Make sure that this new group is selected, change its Blending Mode to Soft Light and go to Effect > Stylize > Drop Shadow. Enter the properties shown in the following image and click OK. Move to the Layers panel, name this group “scatterBrushes”, drag it between the “frontHighlights” and “highlights” groups then lock it.

honeyTextEffect21

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Focus on the Layers panel, select the bottom copy and move it 1px up and to the right. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and lower its Opacity to 80%.

honeyTextEffect22

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Focus on the Layers panel, select the bottom copy and move it 3px up and to the right. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and lower its Opacity to 30%.

honeyTextEffect23

Duplicate the compound path made in the previous step (CTRL + C > CTR + F). Select this copy and go to Effect > Blur > Gaussian Blur. Enter a 3px radius and click OK.

honeyTextEffect24

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Focus on the Layers panel, select the bottom copy and move it 6px up and to the right. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and lower its Opacity to 10%.

honeyTextEffect25

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Focus on the Layers panel, select the bottom copy and move it 1px down and to the left. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Turn the resulting group of shapes into a Compound Path (CTRL + 8), fill it with R=255, G=131, B=0 and lower its Opacity to 30%.

honeyTextEffect26

Select the five compound paths made in the last five steps and Group them (CTRL + G). Move to the Layers panel, name this new group “shadows” and drag it below your “text” compound path.

honeyTextEffect27

Pick the Brush Tool (B), select the “Calligraphic Brush 1″ and draw some simple path along the right edge of your text. Once you’re done select all these paths and Group them (CTRL + G). Select “text”, make a copy in front (CTRL + C > CTRL + F), bring it to front (Shift + CTRL + ] ) and fill it with white.

honeyTextEffect28

Reselect the white compound path along with the group of brushes and go to the Transparency panel (Window > Transparency). Open the fly-out menu and simply go to Make Opacity Mask. In the end your masked group should look like in the second image. Select it, change the Blending Mode to Soft Light and lower its Opacity to 30%. Move to the Layers panel and lock this masked group

honeyTextEffect29

Select “text” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Open the fly-out menu of the Brushes panel and go to Open Brush Library > Artistic > Artistic_Ink to open a new window with a bunch of art brushes. You will only need the one named “Fire Ash”. Now, select one of those copies made in the beginning of the step, bring it to front (Shift + CTRL + ] ) and focus on the Appearance. First, remove the color from the fill then select the stroke and add the “Fire Ash” brush.

honeyTextEffect30

Select the other copy of “text”, fill it with white and bring it to front (Shift + CTRL + ] ). Select this white compound path along with the one with the art brush, open the fly-out menu of the Transparency panel and go to Make Opacity Mask. Make sure that this masked compound path is selected, change its Blending Mode to Soft Light then move to the Layers panel and lock it.

honeyTextEffect31

Select “text”, lower its Opacity to 75% and go to Effect > Stylize > Inner Glow. Enter the properties shown in the following image and click OK.

honeyTextEffect32

Enable the Grid (View > Hide Grid) and the Snap to Grid (View > Snap to Grid) and make sure that you have a grid every 1px. Pick the Ellipse Tool (L), create an 18px circle and fill it with R=237, G=28, B=36. Select this red circle and go to Object > Transform > Move. Enter “74” in the Horizontal box and hit the Copy button. Select this new circle and open the Transform panel (Window > Transform). Make sure that the “Constrain Width and Height Proportions” options is active and enter 6 in the width (W:) box.

honeyTextEffect33

Using the Rectangle Tool (M), create a 74 by 18px shape, fill it with R=111, G=130, B=140 and place it as shown in the first image. Switch to the Direct Selection Tool (A) and focus on the right side of this new rectangle. Select the top anchor point and drag it 6px down then select the bottom anchor point and drag it 6px up. In the end your shape should look like in the second image. Select it along with the red circles and click on the Unite button from the Pathfinder panel. Select the resulting shape and go to Effect > Warp > Bulge. Enter the properties shown in the following image, click OK and go to Object > Expand Appearance.

honeyTextEffect34

Using the Ellipse Tool (L), create a 51 by 32px shape, fill it with R=111, G=130, B=140 and place it as shown in the first image. Select it along with the other grey shape and click on the Unite button from the Pathfinder panel.

honeyTextEffect35

For this step you’ll need the Round Any Corner script. You can find it in the Vectortuts+ article 20 Free and Useful Adobe Illustrator Scripts. Save it to your hard drive, return to Illustrator and grab the Direct Selection Tool (A). Select the two anchor points highlighted in the first image and go to File > Scripts > Other Script. Open the Round Any Corner Script, enter a 5px Radius and click OK. Make sure that this grey shape is still selected, focus on the Appearance panel and replace the flat color used for the fill with the linear gradient shown in the following image. Move to the Layers panel and simply name this shape “spoon”.

honeyTextEffect36

Disable the Snap to Grid (View > Snap to Grid). Select “spoon” and go to Object > Path > Offset Path. Enter a -1px Offset and click OK. Select the resulting shape and make a copy in front (CTRL + C > CTRL + F). Select this copy and move it 1px down. Reselect both shapes made in this step and click on the Minus Front button from the Pathfinder panel. Fill the resulting shape with R=228, G=230, B=232.

honeyTextEffect37

Select “spoon” and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 5px down and 3px to the right. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Fill the resulting shape with R=154, G=169, B=176, lower its Opacity to 60% and change the Blending Mode to Color Burn.

honeyTextEffect38

Select “spoon”, focus on the Appearance panel, add a second fill and use the linear gradient shown in the following image.

honeyTextEffect39Remember that the yellow zeros from the Gradient image stand for Opacity percentage while the white numbers stand for Location percentage.

Select “spoon”, focus on the Appearance panel, add a 1pt Stroke Weight, align it to inside and set the color at R=111, G=130, B=140. Keep focusing on the Appearance panel, select the bottom fill and go to Effect > Stylize > Drop Shadow. Enter the properties shown in the top, left window, click OK then add the other three Drop Shadow effects.

honeyTextEffect40

Focus on the right side of your “spoon” and enable the Snap to Grid (View > Snap to Grid). Using the Ellipse Tool (L), create a 46 by 29px shape, fill it with R=111, G=130, B=140 and place it as shown in the first image. Continue with the Ellipse Tool (L), create a 30 by 16px shape, fill it with R=137, G=153, B=163 and place it as shown in the second image

honeyTextEffect41

Select the large squeezed circle and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 1px up. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Fill the resulting shape with R=228, G=230, B=232.

honeyTextEffect42

Select the large squeezed circle and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 2px down. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Fill the resulting shape with R=97, G=117, B=128

honeyTextEffect43

Select the large squeezed circle and make two copies in front (CTRL + C > CTRL + F > CTRL + F). Select the top copy and move it 5px down. Reselect both copies and click on the Minus Front button from the Pathfinder panel. Fill the resulting shape with R=97, G=117, B=128 and lower ts Opacity to 30%.

honeyTextEffect44

Select both squeezed circles, hit Alt + CTRL + B then go to Object > Blend > Blend Options. Select Specified Steps from the Spacing drop-down menu, enter “5” in that white box and click OK. In the end things should look like in the second image.

honeyTextEffect45

Focus on the left side of your “spoon”. Using the Ellipse Tool (L), create a 14px circle, fill it with R=111, G=130, B=140 and place it as shown in the first image. Continue with the Ellipse Tool (L), create a 16px circle, fill it with the same color and place it as shown in the second image. Select both circles and click on the Minus Front button from the Pathfinder panel.honeyTextEffect46

Make sure that your thin, sharp shape is selected and go to Object > Transform > Move. Enter 2 in the Position-Horizontal box and hit the Copy button.

honeyTextEffect47

Using the Ellipse Tool (L), create a 12px circle, fill it with R=111, G=130, B=140 and place it as shown in the first image. Continue with the Ellipse Tool (L), create a 14px circle, fill it with the same color and place it as shown in the second image. Select both circles and click on the Minus Front button from the Pathfinder panel.

honeyTextEffect48

Select all three sharp shapes and turn them into a Compound Path (CTRL + 8). Select it and go to File > Scripts > Other Script. Open the Round Any Corner Script, enter a 3px Radius, click OK and go to Effect > Stylize > Drop Shadow. Enter the properties shown in the following image and click OK.

honeyTextEffect49

Select that “spoon” shape, make a copy in front (CTRL + C > CTRL + F) and bring it to front (Shift + CTRL + ] ). Make sure that this copy stays selected and focus on the Appearance panel. Remove the stroke and the bottom fill then focus on the remaining fill. Make it black, lower its Opacity to 4%, change the Blending Mode to Multiply and go to Effect > Path > Offset Path. Enter a -1px Offset, click OK and go to Effect > Artistic > Film Grain. Enter the properties shown in the following image and click OK. Select all the shapes that make up your spoon and Group them (CTRL + G).

honeyTextEffect50

Select your spoon group, rotate it a little and place it as shown in the first image. Finally, you can add a bit more honey. Use the Paintbrush Tool (B) along with our calligraphic brushes, expand and unite the resulting shapes then repeat most of the techniques used for the honey text.

honeyTextEffect51

Here is how it should look. I hope you’ve enjoyed this tutorial and can apply these techniques in your future projects.honeyTextEffect0

 

Check Also

207183_1

গোসলের সময় চুলের ক্ষতি করে যে ১০ অভ্যাস

গোসলের সময় চুলের ক্ষতি করে যে ১০ অভ্যাস   চুলকে পরিষ্কার ও ভালো রাখতে ধুতে …

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>