Web Design Tutorials osCommerce Template Tutorials
New osCommerce Templates osCommerce Specials osCommerce Forums Search Our Site Contact Us Resources Web Design Tutorials
Web Designers Library- Tutorials and Articles
Tutorial Search
  Advanced Search
 
Tutorial Menu
 
 Video Tutorials
  · Dreamweaver
  · osCommerce
  · Installations
 
 Photoshop
  · Tutorials
  Photoshop Basics
  Special Effects
  Text Effects
  3D Effects
  Textures & Patterns
  Web Layout
  Drawing Techniques
  Color Management
  Photo Editing
  ImageReady Animation
  Miscellaneous
  · Articles
 
 Web Design Basics
  · Design Principles
  · Website Usability
  · Color Theory
  · Templates & Tuning
 
 osCommerce
  · osCommerce Knowledgebase
  Catalog Area
  Installation and Upgrades
  Administration Tool
  General Information
  Developers Section
What's New
Latest Tutorials and Articles
Video Tutorials
osCommerce Tutorials
Template installation with cPanel and Ipswitch
Photoshop
Photoshop CS3: Output Sharpening
Change Color on an Object
Sunlight Effect
Autumn Effect
Eyes in Green Pea Pod
Web Design Basics
A To Z About RSS
Elements of Great Websites
The Next Generation Website Model
Why Use a Web Design Template?
Web Site Templates and Their Benefits
osCommerce
SSL - This page contains secure and non secure items
Post-Installation
Security - .htaccess
SSL - This page contains secure and non secure items
Tax Proposal
Photoshop : Tutorials : 3D Effects Last Updated: Apr 15th, 2008 - 18:38:37


Recreate Aquafina Ads
Author: Tommy Maloney
Authors Website: www.photoshoplab.com
Sep 4, 2006, 18:54

Email this article
 Printer friendly page

You may have noticed the new AquafinaŠ ad spots, but if not, go here www.aquafina.com to see what we're doing here.

First step is going to be to open a new file File > New setting the dimensions small (this determines how many "light rays" you're going to have). Make sure the width is twice the height and set the Background to Transparent.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Use the Marquee Select Tool M and fill have your image with whatever color you want your rays to be.

Press Ctrl + A to select all, then go under Edit > Define Pattern. Rename the pattern to something you're going to remember. Create another new file Ctrl + N and make it nearly twice the size of what you want your final image to be; ie. if I want a 500x400 image in the end, I'm going to make this new file 800x700. Create a new Layer and go under Edit > Fill. Select Use:Pattern and select your new Pattern from the Custom Pattern dropdown. You should get a bunch of vertical lines like this:
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Now go under Filter > Distort > Polar Coordinates. Select Rectangular to Polar and press OK. Now, use the Crop Tool C and crop from the top-right corner to a little past your center.


You may want to apply a small Gaussian Blur to get rid of some the jagged edges Filter > Blur > Gaussian Blur. I used a Radius of 0.6.

Create a New Layer underneath your "light ray" layer. Select the Gradient Tool G and set the foreground color to white, background to the color of your "light ray" pattern. In your Options Bar, set the Gradient Mode to Radial. Click and drag from the center of your pattern out.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


You now have your background. The next step is going to be creating the text. I suggest using a thick bold font. Select the Type Tool T and click-and-drag a box with the approximate size of the text you want. Enter your text. Open the Paragraph Palette and Window > Paragraph and select the Justify All button.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads

Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Now, the trick here is in the text formatting. Open up your Character Palette Window > Character and select the text in the middle. You're going to adjust the Leading and the Vertical Scale. You want to make it slightly taller than the text above it and close up the spacing.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Adjust the bottom text in the same fashion, making it taller than the text above it. With the Type Tool, select your text and adjust the bounding box to fit perfectly around your text. You may have to adjust the Tracking in your Character palette to lessen the room between characters.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Rasterize your Type Layer by going Layer > Rasterize > Type. Press Ctrl + T to bring up the Free Transform. Use the adjustment points to transform your type layer to something like this:
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Now, find the center of your image. You can do this by selecting the background layer, pressing Ctrl + A to Select All, and dragging some guides towards the center. When they find the center, they should snap-to. Drag your text layer to the center of your image. Create a new layer underneath and fill it with white.

Hold Ctrl and click on the text layer, making sure you have the new white layer selected. Fill your selection with black. You might see a little black outline like this:
 
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Now we're going to go under Filter > Blur > Radial Blur. Set the Blur Method to zoom, Quality to Best, and Amount to somewhere between 60 and 80. Press OK.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Bring up the Levels dialog box by pressing Ctrl + L. Drag 2 of the 3 sliders towards the right slider. You should see your blur become solid.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Press OK. Go Filter > Blur > Gaussian Blur and adjust it until the edges aren't jagged. Bring up the Levels again Ctrl + L and adjust the sliders towards each other until the edges sharpen.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads

 


Press Ctrl + T to bring up the Free Transform. Scale the layer down until the outside edges are slightly hidden by the text above.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


Set the Layer Mode to Multiply and the white should disappear. Link the text layer and the shadow layer, and drag them to cover the center of your background.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


The final steps are to create a new layer above your text layer, and press Ctrl + G. Select the Gradient Tool G and a light foreground color with a white background color. Drag the Gradient across your new layer until you get the effect you want.
Web Designers Library- Tutorials and Articles
Recreate Aquafina Ads


It's not EXACTLY like the AquafinaŠ ad, but they probably cheated and used a 3-D program.



Top of Page

 
Level Ten Hosting