Advertisement

There's no such thing as a stupid question, but they're the easiest to answer.
Login
Search

Advertisement

Web Design & Development Web Design & Development
Search Search
Search for:
Tech Support Guy > > >

Help to create rounded corners using PSP or Photoshop


(!)

howard.a.s's Avatar
howard.a.s howard.a.s is offline
Member with 318 posts.
THREAD STARTER
 
Join Date: Jul 2005
Location: U.K
Experience: Intermediate
01-May-2008, 02:05 PM #1
Help to create rounded corners using PSP or Photoshop
hello all,

Here is a question that for all of you experts, I'm certain has a very simple solution.

How do I quickly and easily create rounded corners for rectangular shapes?

Please take a look at this website (not mine):

http://www.lloydspharmacy.com/wps/portal

The bottom corners of the welcome area, the top and bottom of the lefthand navigation area, the online store bar, and more, each have rounded corners.

Not having very much knowledge of photoshop, I am totally baffled as to how this effect can be created.

Lets take the bottom of the welcome area, for instance.

Would I just create a rectangular bar the same width as the welcome area, for arguments sake 450px by 30px, which would have square corners, and then edit the lefthand end to form a quarter circle? Or would I create a rectangular bar the same height as the welcome area, for arguments sake 180px by 30px, which again would have square corners, and then edit the bottom end to form a curve. Would this be the way I'd do it? Would either method work? Or, is there an easier way?

More to the point, how do I edit the corner to create the curve?

Once created, how would I add the curved corner strip to my welcome area?

Can anyone tell me if a similar effect is achieveable in Paint Shop Pro, as I am more familiar with how to use this.
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
01-May-2008, 02:21 PM #2
Here is a tutorial for using PSP to create rounded corners. I use Gimp and using a selection and applying a "rounded corners" filter does the trick for me and in only a few mouse clicks.

Peace...
howard.a.s's Avatar
howard.a.s howard.a.s is offline
Member with 318 posts.
THREAD STARTER
 
Join Date: Jul 2005
Location: U.K
Experience: Intermediate
01-May-2008, 02:56 PM #3
thanks
I'll go and have read and let you know how I get on.

Just briefly refering back to my previous post, and looking at the website example.

If I'd already created a horizontal bar across the width of my website and given it a background colour, presumably I couldn't then add rounded corners to it?

Would I have to first create a image slice and tile it across the area I want to cover, as opposed to just giving the area a background colour. Then, I would add the image with the rounded corners into position as required?
deepdiver01's Avatar
deepdiver01   (Mark) deepdiver01 is offline
Member with 721 posts.
 
Join Date: Dec 2004
Location: Rubyvale, Queensland
Experience: Intermediate
01-May-2008, 05:37 PM #4
Hi Howard.a.s
In photoshop, if you right click on the rectangle tool button in the taskbox, you will see an option for the rounded rectangle tool. When you click on that, there will be an option showing on the top of the work where you can adjust the size of the curve.

In regard adding the rounded corner, yes you will have to first create an image, slice it with left and right images with the curve being static, and tile the centre fill.
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
01-May-2008, 07:44 PM #5
Quote:
Originally Posted by howard.a.s View Post
Would I have to first create a image slice and tile it across the area I want to cover, as opposed to just giving the area a background colour. Then, I would add the image with the rounded corners into position as required?
You could do that OR you could create four rounded corners and set each corner as the background image of four nested DIVs. Then, the nested DIV with the actual content will have a background color matching the color of the corners and the result effect will be rounded corners. An example.

Making an image with rounded corners is certainly easier to do.

Peace...
As Seen On

BBC, Reader's Digest, PC Magazine, Today Show, Money Magazine
WELCOME TO TECH SUPPORT GUY!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.


(clock)
THIS THREAD HAS EXPIRED.
Are you having the same problem? We have volunteers ready to answer your question, but first you'll have to join for free. Need help getting started? Check out our Welcome Guide.

Search Tech Support Guy

Find the solution to your
computer problem!




Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools


WELCOME
You Are Using: Server ID
Trusted Website Back to the Top ↑