Adobe OpenType Tutorial: Simple Wine Bottle Text Wrap

6

Heres’ a quick and easy tutorial on using Adobe OpenType fonts. I never knew how awesome these fonts are until I used them and discovered their features. OpenType® is a cross-platform font file format developed jointly by Adobe and Microsoft. They are superset of the existing TrueType and Adobe PostScript Type 1 font formats. Aside from their cross-platform portability feature, they also provide rich linguistic support, powerful typographic capabilities, and simplified font-management requirements.

Ok, enough of those claptrap, let’s get on with the show. They say that typography is as sophisticated as the finest bottle of wine. So we will try to demonstrate OpenType by starting off with a bottle of wine and wrap some text around it using one of my favorite font, the Bickham Script Pro, which incidentally is an Adobe OpenType font. We will work on our text and enhance it using some of the typographic features of OpenType to produce our final image shown below.

text-wrap-around-bottle-opentype-photoshop-illustrator

Let’s start it off with a regular looking bottle of wine shown below.

wine-bottle-original

We open it up in Adobe Photoshop. Then we type our sample text using our OpenType font, the Bickham Script Pro. Let me also tell you that Adobe OpenType fonts can be distinguished by the word “Pro” which normally appears as part of the font name. The bottle text in normal Bickham Script Pro appears similarly like the one shown below.

wine-bottle-text-orig

From within Photoshop, you can use all these OpenType special characters by selecting your text and opening the “Character Palette” and clicking the fly-out arrow to open the fly-out menu. From the fly-out menu, click “OpenType” to reveal the OpenType settings as shown below.photoshop-opentype-settings.

The problem with using OpenType in Photoshop is that we cannot preview what characters are available for a particular font. So it’s going to be a hit and miss thing. What we are going to do is switch to Adobe Illustrator so that we can use the “Glyphs” palette of Illustrator which is not available in Photoshop.

So what we do is select all our text, open Adobe Illustrator, create a new document, and paste our text from Photoshop. Now this is where our creativity begins. From Illustrator, go over “Window” menu, select “Type” > “Glyphs” to open the Glyphs palette.

illustrator-glyphs-menu

Now let’s select our first character “S” of the word “Special”. While selected, click the “Entire Font” from the Glyphs drop down menu and select “Alternates for Current Selection“.

illustrator-glyphs-menu-alternates

Now you will see from the Glyphs palette all available alternates for the currently selected glyph (S). All we have to do is double-click the glyph that we want to replace the current selection. Selecting the middle one for the letter S will make our word “Special” looking really special (see below).

illustrator-glyphs-changed-s

Select the other letters (C, h, L, F, A, O) and repeat the entire process. After changing all those letters, we will have something like the one shown below. You can select and try with as many characters as you want until you are satisfied and created a more balanced design.

opentype-special-glyphs-1

Another cool feature aside from Alternate Character is the “Discretionary Ligatures”. These are alternate special characters for a group of glyphs. Let us select “st” from the word “August”. While selected, scroll down again the Glyphs drop down menu and select “Discretionary Ligatures” and select something similar to the alternate “st” of the word August shown below.

opentype-discretionary-ligatures

Cool. Now we can go back to Photoshop and wrap those text around our bottle. Simply select the new text from Illustrator and replace the old text in Photoshop.

wine-bottle-text-2

We will add a little distortion effect on our text so that it will look like wrapping around our bottle. Go to the “Layer Palette“, right click on the text layer and select “Warp Text“. The Warp Text menu will pop-up. Click the “Style” drop down menu to select “Arc Upper” because we want the curvatures more on the upper part and straight towards the middle of the bottle.

photoshop-warp-tool-1

Adjust the curvature settings so it will appear accurately wrapped around the bottle’s contour. My settings were 15% Bend, O% Horizontal Distortion, and 10% Vertical Distortion.

photoshop-warp-tool-2

As a final touch, copy the bottle highlight color shown below as the text color using the “Eye Dropper” tool to realistically match the white text with the white highlight of the entire photo.

highlight-color

That’s it. Once more shown below is our final wine bottle with text wrapped around using and harnessing the cool features of Adobe OpenType fonts. Please be reminded that you’ll also find OpenType support in Adobe InDesign, so everything that you’ve learned here will also work and apply across the entire Adobe Creative Suite.

text-wrap-around-bottle-opentype-photoshop-illustrator

Here’s something for everyone to learn more about Adobe OpenType:
Adobe OpenType resource page

6 comments

  1. Wine Bottle Coolers 21 June, 2010 at 06:57

    On the Adobe OpenType Tutorial: Simple Wine Bottle Text Wrap | Graphic Design Free Resources subject, Champagne and sparkling wine ought to very best be served at forty five°F. With that mentioned, probably the greatest methods to produce sure correct wine storage temperature is through a household cellar, but this really is unattainable for even the most significant oenophile due to cost or area constraints. Thus, wine coolers and refrigerators are an economical choice to serve your best vintages.

Post a new comment

Recommended for you

15 Best Free Responsive WordPress Themes

2012 collection of the best free responsive WordPress themes. These responsive, fluid, or adaptive WordPress themes, automatically adjust according to media display sizes.