Text Bubbles?

[SNAFU]

For the life of me, I cannot figure out how to make a quality text bubble like the ones that Brian uses. All I have are MSPaint ellipses with a hand drawn ">" thing. I have recently gotten my photoshop working again. How does he do it?

[CHICAGO¤lollie]

For the life of me, I cannot figure out how to make a quality text bubble like the ones that Brian uses. All I have are MSPaint ellipses with a hand drawn ">" thing. I have recently gotten my photoshop working again. How does he do it?

Ok! Bubble tutorial!

First off, type the text first.

Second, create a new layer, choose the Elliptical Marquee Tool (making sure "Anti-aliased" is ticked), select an area around the text, and fill it white.

After that, create another layer, choose the Rectangular Marquee Tool, then hold down shift and drag down a small boxed selection (About 24×24 pixels, if you wanna get all numbery). Fill that white too.
This box is the point for the bubble.

Move the bubble point box to where it has to go, goto Edit > Transform > Rotate, and rotate it so that one of the points is pointing in the right direction.
Eg: If the bubble is to the right of the character, have the point on the left, and vice versa.

Merge the bubble point and the bubble circle together (CTRL+E).

Now, the outline. Eeeeeeeeeeasy :cool:

If you're using Photoshop 5, make a new layer, CTRL+Click the compiled bubble layer, choose the Lasso tool, right-click on the selection and go to "Stroke...", set the width to 3 px, location to "Outside", click ok, merge the bubble layer and the outline, and viola! Bubble complete!

If you're using Photoshop 7 or up, however (Photoshop 6 too, maybe, if it had layer effects), just double-click on the bubble layer, go to "Stroke", 3 px, choose the color of outlining, and click ok.

That's how I've done them anyway. I'm sure King Brian's method is similar, unless he has some kind of bubble-making machine that us fellow readers will NEVER get to see the likes of. All hail King Brian. *hails*

Hope that helped. ;)

[Viper Daimao]

excellent tutorial chicago lollie.

and yes that is just about exactly how brian does tham
Word bubbles are quite easy with Photoshop. It may sound complex, but it takes less than a minute. First, you type out your text, usually centered and arrange it how you want it to look. Then draw a white oval around the text on a layer under it. Merge these two layers. Make another layer under the oval-text and draw a little white square. Rotate/move it to sort of "point" at the talking character. Merge this layer with the oval-text one. Now, with PS 6.0 anyway, apply a 4 pixel wide black "stroke" effect for the border. You're done. If you're using an earlier version of Photoshop, then you'll want to use the magic wand selector to click outside the bubble, select inverse (to actually select the bubble), and go to Selection->Modify->Expand and select 3 or 4 pixels. From there, it's easiest to make a new layer under the bubble, fill the selection black, and merge it with the bubble to give it a snazzy border. Done.

[SNAFU]

Awesome. I got a text bubble coming out pretty well using that technique. I hadn't used photoshop for a while since I upgraded from an *Early* version to 7.0 and became too lazy to learn how to use it all over it again. I can get the bubbles to turn out well, but I don't know how to combine layers. How do you do that?
Also, Brian used an effect in this comic (http://www.nuklearpower.com/daily.php?date=030729), and I am curious what effect it is. Did he just pixelize and blur the background, or did he put it behind "glass?"
Thanks for the help. :p

[Lockeownzj00]

Damn! You beat me to it! Just so I can feel useful, here's my version of the text bubble.

Personally, I believe my method is easier. I took the eliptical marquee tool and made it the correct size. I then chose the polygonal marquee tool (the one where you can make your own shape). I held down "shift," so it would add to the current selection and added the little 'tail.' I filled the whole thing in with white, then went to blending options and set the stroke. Then made another layer with text!

The whole thing done with two layers! :D

The tail I made is pretty big, but you get the idea; you can do any size you want.

[SNAFU]

No, I think making the text first is the best way because it is hard to eyeball how much room you will need. Unless you feel like having inconsistent text font or making bubble after bubble to get it right, the text should go first. Do whatever you like.
Another quick question(s): how do you make a thought bubble?
how do you make the curved ">" thing like the one Black mage has one in today's (http://www.nuklearpower.com/latest.php) (401) episode where Black Mage is sitting at the table.

[CHICAGO¤lollie]

Ok! Bubble-link tutorial! (no, it's not Groundhog Day.. :rolleyes: )

Follow the bubble tutorial, but stop at the outlining.

Make a new layer and select the Pen Tool (you can press "P" to use it). We want to use the Normal Pen Tool, not the Freeform Pen Tool.

Then, on the edge that you want the link to appear, click on the inner rim of the first bubble, click in the middle of the two bubbles and drag until the two curve guide points are about [-] that far away from the sides of the bubbles, then click on the inner rim of the second bubble.

From there, just follow your way back. (point on inner rim of second bubble [-] that far away from the point, click-and-drag point inbetween bubbles, point on inner rim on first bubble, click on the starting point to finish)

Then, select the Path Selection Tool (or press "A"), and right-click on the link path. Select "Make Selection..." > Set "Feather Radius" to 0, make sure Anti-aliased is ticked > Press Ok.

Then fill and merge, and finish the bubble off, and tada! Bubble with a link!

[CHICAGO¤lollie]

And, as for the background, just goto Filter > Noise > Median...
Set the radius to 2, click ok, and <musical noise>! Background!


I'm pretty sure Brian may do this one differently, but it works just the same. ;)

(Excuse the double posting. I've only done it to separate the bubble-link tutorial and the background post :) )

The preview on the left is the original. The preview on the right is the "Median" version.

[Lockeownzj00]

I still think the selection method is better. The text, you could've put on first, but it doesnt matter anyway. Even if you put the text on second, you can expand the text bubble with free transform after.

In this case, the pen tool is the better choice, but no need to go through so many steps for the first one.

[Element_man]

Guy guys rox0rs my box0rs.

[Katzedecimal]

Guy guys rox0rs my box0rs.

What he said. Thanks guys; I'm still on the Photoshop "Everest" learning curve and this helps lots.

.... now is there some way to save the entire thread......... :p

Le meas
-==- Katzedecimal

[Grandmaster_Skweeb]

heres something i just thought up spur of the moment for thought bubbles from my vast photoshop experience:

1.type up text
2. make new layer for bubble (easier to tweak with this way)
3. use eliptical selection tool
3. Alt-Delete to completely fill in (or ctrl-delete depending on what the background color is)
4. Selection> Modify> Contract> X amount of pixels depending on image size. 2 to 3 pixels for a good thick bubble.
5. Delete and Deselect.
6. Copy selection and Ctrl-T to change size for quick smaller thought bubbles.
7. link layers

voila, easy thought bubbles.

[CHICAGO¤lollie]

I still think the selection method is better. The text, you could've put on first, but it doesnt matter anyway. Even if you put the text on second, you can expand the text bubble with free transform after.

Actually, free transform isn't good to use for expanding.
It's only really good if you want to have a bad-n-blurry edge that's even worse to outline :rolleyes:

In this case, the pen tool is the better choice, but no need to go through so many steps for the first one.

Well, like Viper quoted Brian on before (I should've checked the FAQ, just incase.. Now I know :rolleyes: ), it may seem like a hell of a lot to do, but it really does take less than a minute.

Like, after two or three times of doing it. ;)



.... now is there some way to save the entire thread.........

Le meas
-==- Katzedecimal

Why, yes there is.
Just go to thread tools (Just above where the thread posts start), click on "Show Printable Version", then copy and save it into a word document or something.

Alternatively, you can go right ahead and print it. ;)

[Yousabugger]

or u could add this thread on your subscribed threads and just use that to find the thread

u do this by clicking on quick links scrolling down to the miscalenious section and clicking on subscribed threads to find a collection of your subscribed threads

[SNAFU]

I know I'm asking a lot of questions, but I want to know so I can get better (gosh darn it!). How would one make a good fire effect? I would like to add rain and snow if possible. Also, photshop has an intersting way of enlarging my sprites. What do you guys like better, the orginal expansion or the photoshop version (see attached file).
Thanks for the help everyone!

[Lockeownzj00]

Actually, free transform isn't good to use for expanding.
It's only really good if you want to have a bad-n-blurry edge that's even worse to outline

For normal PS objects it works well, like circles. If you want to fix the bluriness, at least for sprites (which I wasn't talking about), look below.

Acolyte: I can help you!

First, take your image. Now go to image size, and at the bottom, change "bicubic" to "nearest neighbor." It should now enlarge correctly!

As for rain, this is a method I picked up somewhere:

Simply add a new layer (above your image, of course), and fill it with black. Go to the filters and add noise (noise->add noise). Choose Gaussian, and do a percentage around 50-75. Depends on how much rain you want. Make sure to make it monochromatic so it doesn't look all colored.

The next part is simple. Just do a motion blur (also a filter), and change the angle to what you want. Change the pixels to a lot so it looks like actual falling rain. Now, just set the layers opacity low, so it looks like rain!

http://www.imageshack.us/img1/6996/city1.png

ps: i remember, igot it from polykarbon. check them, they have good stuff.

Here's a good fire tutorial:

http://www.martinity.com/html/tutorials/fire/fire.htm

[CHICAGO¤lollie]

For normal PS objects it works well, like circles.
If you have them set as vector shapes, then yup.
If you have them set to fill pixels, then nup.

I have `em set to fill pixels, so that's why I don't like the Free Transform, to avoid the blurry edges :rolleyes:

-----

Alternatively, to enlarge sprites, you can do so via Microsoft Paint.
CTRL+W > Enter percentage to enlarge by (400% is standard enlarge size for 8BT) > Click Ok ;)

And, for a hell of a lot of big `n fancy Photoshop Tutorials, go here (http://psworkshop.net/psworkshop/), or here! (http://www.photoshoptechniques.com/main/lrh.php) ;)

(Excellent fire tutorial can be found here (http://www.photoshoptechniques.com/texp/fireptk.php))

+edit: took a look at the fire tutorial Lockeownzj00 posted. both tutorials are almost the same.
i found that the "excellent fire tutorial" link goes into heaps and heaps of detail, but both tutorials end up with basically the same good firey look ;)

[Grandmaster_Skweeb]

Locke, here a REALLY good photoshop tutorial place:

www.phong.com

some damned good stuff!

[SNAFU]

How would I set a... building or sprite or background image... on fire using photoshop? I've made some good flame text, but that technique doesn't pass over to non-text things.

[Skatzo]

is there anywhere teaching how to make panels for comics? soz i never made comics before and id really like to start

[tazz31406]

I wish I had Photoshop, sniffle...

Did any of you guys get a good deal for it? Cos' I'm gonna get a job, this summer (turning 15) and I might save up the money to get it.

[Arlia Janet]

I got one for a gift off of ebay for about $50. I got VERY lucky though. If you have a Mac, I am willing to sell you flash and freehand for cheap.

[tazz31406]

Well, behold the lameness, for I have no Mac. Oh, well, I'll just look for a reasonable price (the retail is friggin $650) probably on eBay, like you. If I do not find one, I can probably buy it off a friend of mine...

EDIT: Actually, I've looked on eBay, and I've seen Photoshop CS selling for as little as $300, a much better deal (for me) than the retail version which I am ready to completely take advantage of. Shweet. After I get Photoshop (eventually), I need to get Macromedia Flash and all will be well.