Got a tip for us?
Let us know
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.
Glass buttons
- Thread starter trainguy77
- Start date
- Sort by reaction score
I'd try using a font other than Times. Something san-serif (without the tails on the letters, i.e. Arial-esque fonts) would probably work better. Or at least that's been my experience with buttons. Also try switching the color of the font to something with a bit more contrast. Because of the darker color on top and the lighter on the bottom, both black and white can blend in a bit with either of those shades. Or maybe just a more prominent font (something bold, for example) would work better with black and white.
Just my 2 cents.
Just my 2 cents.
You should also send the text a few layers back. The glass look works best if you don't have anything floating on top of it. If you don't have any transparent layers behind the text, create two or three on top of it to "soften" the look of the text (and also change the text as others have recommended).
Right now it goesmatticus008 said:
Glass
text(transparent background)
background(transparent corners)
transparent layer
So you say I add layers behind the text?(In between text and background)
Why would you do that?
trainguy77 said:
Not behind the text, in front of it. Right now the text just looks pasted on top. Your glass effects are contained in a single layer? Since your glass isn't particularly "glossy," you might also consider just altering the text to look engraved, which would improve the tactile feel of the button.
How would I get them to be more 3d? Like the tabs at the top of the page. I know how to put a shadow on it. Thats not what I am looking for. The lighter Colors how do you do this?
I want your honest opinion, because I will admit it I am a noob at these kind of things. So thank you. You were not being rude at all. Now on to the button. Here is the site it will be on just so you see the colors. For the first of the two I kind of like how it fades in.Chaszmyr said:
http://www.southcalgary.org/youth/newsite/index.shtml
and another set of buttons:
http://www.southcalgary.org/youth/newsite/index_2.shtml
On the second set I set the DPI to 150 from 75 to try fix the edges. It helped a little but not that much. The second one also has some shadows. But I don't like the way they look. I am not sure how to make shadows that are part of the image.(not behind) I will try re-make them smaller and with the gradient going throughout the whole image.(if thats what you mean) Right now it only "transitions" about 10 px.
Any other suggestions? How do you make the shadows/button more 3d?
I created one a little different. I think it came out to small. But if I stretch its going to look bad. But here it is. I used a different style in making the shape. Is it any better? I zipped it so I could include the GIMP file.
I played around with it a bit.
The button itself is the same as your original one, but I erased your text, played slightly with the levels to adjust the appearance and make it a little gentler, and then put in my own text (20pt Futura Med.) I also put in a 2 pixel grey "stroke" or border around the button, and a very slight grey outer glow. (Sometimes the cheesy photoshop effects can look good...
). It's semi-transparent in PNG format, and shows up well against the blue color you showed for your site, and white.
If I knew anything about GIMP, I'd explain what you could do better...but my knowledge ends at Photoshop.
The button itself is the same as your original one, but I erased your text, played slightly with the levels to adjust the appearance and make it a little gentler, and then put in my own text (20pt Futura Med.) I also put in a 2 pixel grey "stroke" or border around the button, and a very slight grey outer glow. (Sometimes the cheesy photoshop effects can look good...
). It's semi-transparent in PNG format, and shows up well against the blue color you showed for your site, and white.If I knew anything about GIMP, I'd explain what you could do better...but my knowledge ends at Photoshop.
Attachments
The one you created is on the second one.
http://www.southcalgary.org/youth/newsite/index.shtml
http://www.southcalgary.org/youth/newsite/index_2.shtml
I am not sure if I like it. Its better then mine. But I am not sure. I have never had an eye for colors. What does everyone else think?
http://www.southcalgary.org/youth/newsite/index.shtml
http://www.southcalgary.org/youth/newsite/index_2.shtml
I am not sure if I like it. Its better then mine. But I am not sure. I have never had an eye for colors. What does everyone else think?
try giving the letters an inner shadow and bevel to make them look like they actually go into the button... its hard to explain but those of you who know photoshop will know who im talking about...
Do you have an example? I tried the bevel, it did nothing. But its a script so that may be why. Maybe no one has documented this in GIMP because it is hard to explain.
L
Lau
Guest
trainguy77 said:
I'm not sure exactly what style website you're trying to create, in that there's nothing else on that page. But as glass buttons go, I would say OutThere's is really clean looking, and fits in with the glass theme really well, certainly better than with the serif typeface you posted above.
Does anyone know any good books about this? Any good webpages that could help me out with GIMP? As this might take to long teaching me on these forums. I do want to learn, however this may not be the way. How did you guys learn to do this?