Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for professional graphic designers and non-designers trying to do their own graphic design. It's 100% free, no registration required.

This is my first attempt at seriously using Gimp. I am more of a front end developer slash developer myself and I have only used Gimp or Photoshop for very basic stuff such as removing backgrounds, cropping. So this the first time I want to do more and as I am planning on ditching PS I am trying to work with Gimp. Please see attached image

op-menu-buttons.

It shows simple rounded buttons with nice inner shades and a beveled background as well as inlaid text. How in Gimp do I:

  1. Create this shade gradient effect on the button?
  2. Do the inlaid/embossed inset text effect?
  3. Make the button background with the inset lines?

Thanks in advance for your help!

Update

Checking http://www.youtube.com/watch?v=p1K3L7RdbKw for engraved text (engraved = embossed)

share|improve this question
7  
If you already have photoshop, why in the name of Zeus would you switch to gimp? –  Joonas May 10 '12 at 7:35
    
google your needs there are so many tutorials. –  Jack May 10 '12 at 13:20
    
why do you call the button "embossed" and the text "engraved"? Same effect. Look for the terms "gradient," "stroke" (careful with this in google!), and "emboss." –  horatio May 10 '12 at 13:55
2  
@Lollero I like to try new programs and might go 100% Open Source in the future –  rhand May 11 '12 at 1:33
1  
many tutorials for photoshop are suitable for other programs, provided the ability to mimic the result is there. The steps might be different, but the technique is what matters. Many photoshop techniques are analogs to printing and illustration/airbrush techniques. –  horatio May 11 '12 at 14:07
show 3 more comments

1 Answer

up vote 3 down vote accepted

You will have to use gradient to get that kind of background. Go through this nice tutorial to understand how gradient works : http://mygimptutorial.com/round-web-20-button-with-a-metal-ring

And then play around according to your needs. Let me know if you need help with anything specific.

share|improve this answer
1  
I took a look at the tutorial. The first three steps seem to explain how to make a circle and a gradient, which is part of what I need. Thanks! How to make the inset - think that is the word for it - lines and inset text is not explained there as far as I can see. This is the first answer to this question in weeks and one that is about doing this in Gimp. Very much appreciated! –  rhand Sep 29 '12 at 1:48
    
Download this plugin : registry.gimp.org/node/186 and copy it to the location : ..\share\gimp\2.0\scripts where you have gimp installed. Then follow this blogpost: freshpage.co.uk/inset-typography-inset-text-with-gimp step by step and see if you can achieve the results. Let me know if you get stuck. –  soundswaste Sep 29 '12 at 9:09
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.