Visit DynamiX Web Design! E-Mail DynamiX Web Design!

design: Create Rounded Images in Seconds! (Photoshop)



Rounded corners are still as popular as they ever have been, but many designers don’t know how to easily create these using Photoshop. Today we are going to create a template that you can adapt as desired, and show you exactly how we made it in four easy to follow steps.

Here’s how our final document will look:

The Friendly DynamiX Goat

Step 1: Open/size your image.
For our example, we chose 550 pixels by 290 pixels. For ease of working, we recommend making the document a little bit larger than your intended end result. Here’s how ours looks:

The Friendly DynamiX Goat

Step 2: Add a rounded box.
Use the “Rounded Rectangle Tool” to create a box around the portion of your image that you would like to capture. Be sure to adjust the radius to suit your rounding desires. We set ours to 25 pixels for this example. Your document should look similar to this:

Where did our goat go?

Step 3: Positioning and layer order
Position the rounded box where you would like it, then drag the layer underneath your image within the “Layers” tab. Your document should look similar to this:

Here's what your Layers tab should look like.

Step 4: Create a clipping mask
Here’s where the fun begins, and where your work ends (unless you just want to add some finishing touches). Simply right click on the image layer, and select “Create Clipping Mask.”

Here's what your Layers tab should look like.

Your document should now look like this:

The end result!

Now, you can easily add more life to this image before you save it, but the basics are covered. Want to get more creative? You can add more layers, text and even style the rounded area itself through the “Layer Style” window.

In our example .PSD file, we have added in a semi-opaque left hand content area, and added some example text. We also added a stroke and drop shadow to the rounded shape, and used Images – Trim to remove the whitespace around our image. Want to know exactly how we achieved any portion of this .PSD? Leave us a comment below!

About Jeff Jahn:
Father, Husband, lover of life. Passionate about building exceptional products, platforms and ideas, and pushing the envelope on what can be achieved through technology. Bootstrapper, willing to radically shift direction if the need arises and always engaged.

Jeff is recognized as a leading authority in web, mobile, social media and emerging online technologies. One of 20 Rising Stars Under 40 (Cobb Life Magazine).

Twitter LinkedIn Google+ 

Tags: , , , , , ,

If you find our articles useful, "like" us!

Pass This Article On! Tiny Url: http://tinyurl.com/m6xr95

Comments are closed.






DynamiX Web Design

DynamiX Labs is Copyright © 2014 DynamiX Web Design, LLC.
DynamiX Labs is proudly powered by WordPress

Entries & Comments.  |  thanks & about.


The DynamiX Mascot button submit it! Background
hire dynamix!