How to produce best curved graphic with photo and transparency.

Colin Brazier
Colin Brazier used Ask the Experts™
on
Hi experts,

I am not happy with the quality of the circle surrounding this photo (it looks pixellated) and am wondering how to make a better job of it.  

web graphic
The graphic is to go on a web page and the areas surrounding the circle must be transparent.

I made this gif by creating the circles in Fireworks 8 at 72 ppi (perhaps an error here?) and then pasting the photo inside (also at 72px).

Should I have done both at a larger res (eg 300ppi) and then somehow reduced the size?

I have access to Fireworks 8, Photoshop CS2 and Publisher.

(I could not find Fireworks in the EE topics list so have used more general topics.)

Any help much appreciated.

Col
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Software Engineer
Commented:
Can you check here: http://schutt.nl/ee/Q_27730377/

I re-did the 3 circles in photoshop (as I don't have fireworks) and saved as png because I was trying to save with an alpha channel for super smooth outside edge with partial transparancy. I don't think that worked but maybe the tranparency in itself is enough. The file is significantly larger but you should be able to get a better quality in this same size using the original. Or maybe save as PNG-8 which has less colors like GIF.

The main thing is that I removed the circles as they were and recreated them using a basic shape, going into layer blending options, remove the internal fill (opacity 0) and put a stroke on it with each of the colors (on 3 separate shapes). I think I was off by a pixel here and there which produces small gaps along the circumference so you need to be careful with the position and size of the shapes but then they are a lot smoother than before.

Author

Commented:
Yes, it is much better.  In fact it is more than good enough, the odd pixel here and there isn't a problem.

I just have to work out how you did it (I am a noob with Photoshop really).  Your explanation could hardly be more clear, so I'lll go in and try a few things.

Thanks.  

Col

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial