g Text Version
Beauty & Self
Books & Music
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
News & Politics
Religion & Spirituality
Travel & Culture
TV & Movies

Bored? Games!
Take a Quiz
Rate My Photo

Women's Fashion
Small Office/Home Office
Holiday/Seasonal Cooking
Crafts for Kids

All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g Digital Art and Design Site

BellaOnline's Digital Art and Design Editor


Photoshop Text Tool

In this tutorial, we will use the PhotoshopR Text tool to create four images that we will use as place holder images in a FlashR template. For those of you who are interested in Flash, you might want to follow the rest of the tutorials listed at the bottom to create a Flash slideshow template. For the others, you will learn how to make a group of images that can be used as sample images in demos for your clients.

For our example demo, our client wants a simple Flash slideshow on the front page of his website. We will make four images to demonstrate our slideshow with the dimensions 580 px x 200 px. This is a good size for a slideshow placed above the fold on a website.

  1. Open Photoshop CS5 and start a new image (File New) that is 580 px by 200 px at 72 resolution.

    We want these images to have all the same white background but the text will be different for each.

  2. Still working in our first image, select the Text tool. Set the Foreground color to bea3c3 or any color of your choice.

  3. Click in the center of the image with the Text tool and type "image 1". If we check the Options panel, we can see which Font Family and Style is set for the Text tool. In the example, we have the Myriad Pro font set to Regular style. Select the text and set the Font Size menu to 48. Also, let's center the text by selecting the Center Alignment icon. Click the Checkmark to set the text.

  4. From the Menubar, click Layer Flatten Image.

  5. Save this image as image1.psd.

    Now we can go back a few steps to unflatten the text layer.

  6. From the History panel, click on the Type Tool layer to reverse the Flatten Image command.

    To create our next image, we will change the font attributes and the text to "image 2".

  7. Select the text and change it to "image 2". While still selected, set the Text Color box to 729273. We can also change the Font Family and Style from the menus in the Options panel. Have fun experimenting with different fonts and styles.

  8. Click the Checkmark to set. Flatten the image and save as image2.psd.

    Repeat these steps to create the orange (color ed620f) image 3 and blue (5473b3) image 4 images.

We now have four placeholder images for any project. Because the background is a solid white color and the text is centered, we can change the size of the placeholder images to our project's requirements as explained below.

In the Tools panel, set the Background color to white. From the Menubar, click Image Canvas Size. Set the Width and Height as needed for your project.

Join us in the Digital Art and Design forum.

Add Photoshop+Text+Tool to Twitter Add Photoshop+Text+Tool to Facebook Add Photoshop+Text+Tool to MySpace Add Photoshop+Text+Tool to Del.icio.us Digg Photoshop+Text+Tool Add Photoshop+Text+Tool to Yahoo My Web Add Photoshop+Text+Tool to Google Bookmarks Add Photoshop+Text+Tool to Stumbleupon Add Photoshop+Text+Tool to Reddit


RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map

For FREE email updates, subscribe to the Digital Art and Design Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2015 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.


g features
iBooks Author Quick Answers

iBooks Author Resource List

iBA Template - Story Page Layouts

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2015 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor