View Full Version : Need some help in creating this...
summero
May 28, 2007, 12:06 AM
Hello everybody. Just wondering how I can create this, with the whole text being cut out so you can see the background image:
http://img153.imageshack.us/img153/497/welcomesr7.jpg
Thanks in advance! :)
macaddict23
May 28, 2007, 12:25 AM
In Photoshop:
1) Place the textured layer in layer one. Make sure this layer is not locked. If it is, double click this layer and click OK to unlock it.
2) Next, select the Type tool in the Toolbox palette. Type away on top of the image. This automatically creates a type layer on the Layers palette.
3) With the Type layer still selected, Go to Layer>Rasterize>Type. Finally, position your cursor between the Textured layer and the Type layer until the cursor turns into what looks like an "8" icon. Then, do an Option+Click. You're done.
summero
May 28, 2007, 12:36 AM
In Photoshop:
1) Place the textured layer in layer one. Make sure this layer is not locked. If it is, double click this layer and click OK to unlock it.
2) Next, select the Type tool in the Toolbox palette. Type away on top of the image. This automatically creates a type layer on the layers pallette.
3) With the type layer still selected, Go to Layer>Rasterize>Type. Finally, position your cursor right between the Textured layer and the Type layer, and press the Option Key on your keyboard. You're done.
Awesome! :) Thank you so much for your help. I will try this out tonight.
summero
May 28, 2007, 01:02 AM
I don't understand when you say to position your cursor between the Textured layer and the Type layer until the cursor turns into what looks like an "8" icon. Then, do an Option+Click.
Please help!
janitorC7
May 28, 2007, 01:04 AM
This can also be done in Fireworks, by copying the background image and pasting in inside the text using the edit menu.
if you are interested I can give you step by step, just ask.
summero
May 28, 2007, 01:05 AM
This can also be done in Fireworks, by copying the background image and pasting in inside the text using the edit menu.
if you are interested I can give you step by step, just ask.
Unfortunately I do not have Fireworks :( I only have Photoshop.
iMeowbot
May 28, 2007, 01:30 AM
See this help page (http://livedocs.adobe.com/en_US/Photoshop/10.0/help.html?content=WSfd1234e1c4b69f30ea53e41001031ab64-7853.html) for a clearer explanation (it's in the Photoshop built-in help too).
macaddict23
May 28, 2007, 06:22 AM
1) Make sure the Type layer is above the Image layer.
2) Make sure you Rasterize your live type.
Then . . .
In your Layers Palette, you should have two layers, your Image layer, and your Type Layer. When you mouse over the Layers Palette, your cursor becomes a hand icon. Position this hand icon right between the two layers. Press Option on your keyboard (the hand icon now becomes what looks like an "8"), then click your mouse.
Mydriasis
May 28, 2007, 09:35 AM
The option-click-thingy between layers is called: creating a clipping mask!
You can also do it via the menu bar: Layers>Create Clipping Mask. Or hit command + option + g.
Mydriasis
May 28, 2007, 09:46 AM
BTW you don't have to rasterize the type!
Here is a really small PS file showing you the layers you need for get this effect with 'live' type.
The key once again in a clipping mask.
wheezy
May 28, 2007, 11:27 AM
Step 1. Using the Rectangle Tool (U) draw your vector rectangle where you want it, adjust the size color etc (I'm guessing you can do that).
Step 2. Using the Type Tool, add your text to where you want, size it up to the right size, position it and pick the font you want, color does not matter.
Step 3. Now that your text is exactly how you want it to look, other than being transparent, go to your Menu bar and choose Layer > Type > Convert to Shape. This now turns your editable text into a Vector Shape, in Photoshop you can no longer edit the actual type (change the font, add words etc).
Step 4. Using your Path Selection Tool (A) (Solid Black Arrow), select all the characters in your text. I just click and drag around the lot of it so it selects them all.
**Note - I don't know the tech terms for this, but you need to have the Vector Shape selected so there is a 1pt line wrapped around each of the shapes. If you click in the Layers Tab on the Vector area, you can click this feature on and off.
http://www.unculturedswine.net/myspace/001.png
Notice the black line around the text
http://www.unculturedswine.net/myspace/002.png
This is how it looks in your Layers tab, both layers are vectors, but one has the vector area selected.
Once you have that figured out and you use your Path Selection Tool, this is what you will see:
http://www.unculturedswine.net/myspace/003.png
Notice that all the points in the vector shape are selected.
Step 4. Now that you have the text selected, you will need to do a Copy/Cut of the selection. So, Apple + C, then Apple + X. When you do this you will get a popup dialogue asking which to delete, the top selection is default and this is what you want. Now your text is gone.
Step 5. Using the same selection process as Step 3, Path Select the rectangle that you created in step 1. Now Paste (Apple + V) You will now see the point paths of your text appear over your rectangle, but will all be the same color. Don't unselect or anything, leave it be.
http://www.unculturedswine.net/myspace/004.png
Step 6. Now go to the Menu bar and select the option below. I don't know the terms for it. You will click on the 'Subtract from Shape Area' button, 2nd from the left.
http://www.unculturedswine.net/myspace/005.png
When you select this, if you had your text paths selected, you will now have a transparency where the text is, allowing you to see the image below.
http://www.unculturedswine.net/myspace/006.jpg
I hope this wasn't too muddy for ya to understand, it's a simple process once you learn how to work with Vectors in Photoshop.
wheezy
May 28, 2007, 11:30 AM
Don't Rasterize your type, don't rasterize anything unless you have to. When you rasterize your type, you can no longer adjust the size of what your doing. Keep everything as a Vector as much as you can.
DON'T RASTERIZE.
wheezy
May 28, 2007, 11:53 AM
BTW you don't have to rasterize the type!
Here is a really small PS file showing you the layers you need for get this effect with 'live' type.
The key once again in a clipping mask.
This is another good way! Just don't do any of the Rasterize Type ways...
Mydriasis
May 28, 2007, 01:06 PM
Don't Rasterize your type, don't rasterize anything unless you have to. When you rasterize your type, you can no longer adjust the size of what your doing. Keep everything as a Vector as much as you can.
DON'T RASTERIZE.
Well, if your not going to change the size you might as well rasterize! But if I didn't care about live type, I'd just add a mask to the color rectangle layer in the shape of the text. I think its far easier than your subtract from shape method and the rasterize methode, but maybe not as 'flexible'.
Just command click your text layer icon (to make into selection), drop the fill opacity to 0%, highlight the color rectangle layer and option click the 'add layer mask' icon.
But I guess the beauty of PS is that there are a million ways to get the same effect, all of them with dis/advantages.:)
Jopling
May 28, 2007, 03:28 PM
Thanks, I just learned something new. I always use to just merge the layers and use magic erase to get rid of the font color. It didn't look very good.
macaddict23
May 28, 2007, 04:41 PM
BTW you don't have to rasterize the type!
Here is a really small PS file showing you the layers you need for get this effect with 'live' type.
The key once again in a clipping mask.
That's great. But what if one does not want the yellow bar? How do you make it work then?
wheezy
May 28, 2007, 05:11 PM
But I guess the beauty of PS is that there are a million ways to get the same effect, all of them with dis/advantages.:)
How true this is! There are so many ways to go about doing the same thing. I prefer to never rasterize, I don't see any advantages to it but if you need to do something quick and not worry about future changes etc then to each his own.
summero
May 28, 2007, 05:58 PM
Thank you to everyone who helped! :) Especially wheezy!
Mydriasis
May 29, 2007, 02:13 AM
That's great. But what if one does not want the yellow bar? How do you make it work then?
What exactly do you mean?
Something like this... or that...?
summero
May 29, 2007, 02:32 AM
What exactly do you mean?
Something like this... or that...?
Hey! I'd like to know how to do the first one in your example where the picture is in the text :) Thanks!
Mydriasis
May 29, 2007, 02:48 AM
The key, once again, is a clipping mask.
MagicWok
May 29, 2007, 05:44 AM
Is there a way to do this preferably in Illustrator? I had a quick 5 min go converting the text to outlines and playing around with that.
But I didn't get too far.
iMeowbot
May 29, 2007, 06:02 AM
Is there a way to do this preferably in Illustrator? I had a quick 5 min go converting the text to outlines and playing around with that.
But I didn't get too far.
Yeah. One way: Make a text layer, higher up than the object/group/whatever, select both, and pick Object->Clipping Mask->Make. There is no need to turn the text into paths.
Another similar effect you can try: pick the two objects again, and from the Transparency palette's flyout menu, pick Make Opacity Mask. The result will depend on the ordering of the objects, try experimenting to see how they work. You can use this one in conjunction with gradients etc. to get fades and the like.
vBulletin® v3.6.10, Copyright ©2000-2009, Jelsoft Enterprises Ltd.