Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 0 down vote favorite

I'm doing the e-commerce part of a site that a design firm started. They used a Mac and made their buttons look oh-so-nice:

enter image description here

Unfortunately I don't have a Mac, and the kind of buttons I've created using the GIMP looks, well, not so good:

enter image description here

Are there free or reasonably-priced tools that can properly anti-alias the text on buttons ... on Windows?

share|improve this question
1  
Hi - this is a Graphics design question not a UX one, but I would give Paint.NET, or Inkscape a look depending on whether you're happy to design in bitmap or vector format. Both anti-alias. One easy tip is to design an image LARGER and then scale it to the right size when done. Most resizing tools will do the anti-aliasing for you as part of the scale operation - Gimp included. – Roger Attrill Dec 21 '11 at 14:44
I would have liked to answer this. Graphic design is a subset of UX (to me). However, check out this article. stopdesign.com/archive/2009/02/04/recreating-the-button.html – Glen Lipka Dec 21 '11 at 18:25
Shouldn't this have been migrated to GD.SE, or would it be off-topic for them, as well? – Daniel Newman Dec 21 '11 at 20:19

closed as off topic by Phil, Schroedingers Cat, Roger Attrill, Matt Rockwell, DA01 Dec 21 '11 at 16:30

Questions on User Experience Stack Exchange are expected to relate to user experience within the scope defined in the FAQ. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about closed questions here.

1 Answer

up vote 7 down vote

If you are asking this question for a pixel perfect mockup, you can skip the following paragraph. Otherwise, you MUST read it:

Except for pixel-perfect mockups, you should not create images for your textual buttons to use in production, especially given the power of CSS for web or styling for desktop/mobile/any other target platform. Because it would make your application non accessible to screen readers. Because you would need to create as many buttons as languages supported by your application. Because you would need to design every buttons and other graphical compenent in the exact same way to achieve a uniform website/application design.

Now the answer to your question:

If you use The Gimp, you just have to check the option Antialiasing in the Text Tool panel. And never resize the button after creating it. Instead re-create another one for your various sizes.

enter image description here

share|improve this answer
1  
+1 for the obligatory disclaimer! – Jeremy McGee Dec 21 '11 at 15:15
1  
+1 for pointing out that the answer is CSS...not software. – DA01 Dec 21 '11 at 16:30

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