?
Solved

Text that appears cut out of an image

Posted on 2000-04-20
9
Medium Priority
?
187 Views
Last Modified: 2010-04-03
Surfing the web, I've seen text images (ie text in the form of an image) where the text appears to be a cutout of an image.  I would like to be able to do that. I have basic Photoshop experience. I would think that Photoshop can create that kind of an effect but I don't know how to do it. I would appreciate it if someone can help me by showing me the steps to create text that is cutout of an image.
0
Comment
Question by:daluu
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
9 Comments
 

Expert Comment

by:kkirt1
ID: 2736887
Do you have an address where I can see what you are asking about?
0
 
LVL 30

Expert Comment

by:weed
ID: 2736904
Heres the steps, very simple in photoshop.

Create a new layer above your image and put some text on it in white.
Select the text then either control click (mac) on the far right side of the layer or use your contextual mouse button (windows) in the same spot to access the "Effects" menu.
From the resulting options box select "Inner Shadow".
Make the adjustments accordingly.
0
 
LVL 1

Accepted Solution

by:
snapdragon030500 earned 200 total points
ID: 2761181
i tried what weed just said, and that method looks very cool when you are done.  however, i'm interpreting the question a little differently.  daluu, here's what i THINK you are asking:  you want the letters to look like they are made out of a picture?  and the letters to be freestanding?  both ways are shown at www.ellipsisweb.com/textcut.  the top image is using weed's idea, i think it looks good.  the bottom image is the way i described above.
here are the instructions for the bottom image:  using the type mask tool (the T with a dotted outline), type your text.  then choose layer/new/layer via cut.  turn off the eyeball (visibility) on the original layer.  voila!  crop it, then export it as a transparent gif if you want to use it on the web.  (keep in mind that gifs don't always look so great when they are photos.  if you want it to be a jpeg, paste it onto the background you will be using on the web, then crop it.  the final quality may be nicer.)
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 1

Expert Comment

by:cevr
ID: 2786990
Here's the easiest way I've found to do this:

1. Type your text.

2. Put the picture on the layer ABOVE the text.

3. ALT-Click on the line between the two layers in the layers pallet to create a layer mask. (The picture will cover only the areas of text underneath.)

     The good thing about doing it this way is that everything remains totally editable, including the text.
0
 
LVL 1

Expert Comment

by:snapdragon030500
ID: 2787025
That is true, cevr's way of creating the image will leave the text editable.  If you use cevr's method, use the regular Type tool instead of the Type Mask tool.  Are you still out there, daluu?
0
 
LVL 4

Author Comment

by:daluu
ID: 2787130
Sorry for the delay, but I don't have Photoshop at home so I have to try it out at school which takes some time.

Sorry weed, your method is good but sadly, that's not what I wanted. Apparently, I wasn't clear enough in describing what I wanted.

Snapdragon, your interpretation of my question is correct. Yes, I want my text to appear as if they are made by cutting a picture. However, I am having trouble trying the method you described, I will try it again soon.
0
 
LVL 4

Author Comment

by:daluu
ID: 2789012
Thanks, snapdragon. Your method will be very useful to me.
0
 
LVL 4

Author Comment

by:daluu
ID: 2789038
Cevr,

Its too bad I can accept an answer from one person only. Your method will be useful too.
0
 
LVL 1

Expert Comment

by:snapdragon030500
ID: 2789397
Cevr, thank you for that method!  I excitedly emailed it to another friend - very cool.  Daluu, thank you for the points, I really appreciate it.  It is hard to get things done when you don't have your own computer!  I remember it well, using the school's pods, often waiting in line, very frustrating.  I would suggest that you try both my method and cevr's, it sounds like that is what you plan to do.  Learning faster ways to get to the same end is always worth it.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

HOW TO CREATE A WEB 2.0 IMAGE WITH A REFLECTION I would like to start by saying I know Web 2.0 isn't a style. It is actually the practice of information sharing or  collaboration on the Web. It is also associated with the technology that is used …
Read about why website design really matters in today's demanding market.
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.
Suggested Courses

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question