Design stunning iPhone Application Interfaces and become a pro. You’ll hate to miss this tutorial. The secret of beautiful iPhone application interface design in Photoshop is a click away.

Now we’re going to add the buttons at the bottom.  These buttons are going to come from one of the files we downloaded at the beginning of the tutorial.  If you’re too lazy to scroll all the way up you can get them here too: iPhone PSD Vector Kit   Download them and open the file in Photoshop.

Now simply select them and drag them to the Photoshop stage we are working in.

Group these icons (ctrl + G) into a folder and name it “bottombar”

This is what we have so far in this iPhone Interface Application Tutorial!  Pretty nice background huh?!

Now we need to draw the circles.  To do this, we’re going to reference the look of the original application and look at the sizes of the circles.  We will break the design into 3 circles.  Use the Ellipse Tool (U) to draw these three circles of varying sizes.  You can fill them with whatever color you’d like.

Group these three circles into a group named “Wheel.”  After they are grouped, duplicate the group by clicking Layer > Duplicate Group.  The new group should be called something like “Wheel Copy.”  Hide the original “Wheel” group by selecting the eyeball icon to the left of it in the layers palette.

With the new “Wheel Copy” group/folder opened (showing the 3 circle layers inside), we’re going to add a new layer above each circle layer.  The reason we do this is because we need to flatten each circle layer.  Let’s first flatten the largest circle. To do this Click the layer of the biggest circle in the layers palette, then hold down “Shift” and while holding down shift click one of the blank new layers we created.  Once you’ve selected these two layers, select Layer > Merge Layers.  Do this for the medium sized circle and the small sized circle.  This is what you should have below:

Now, (Command + Left Mouse Click) the medium circle layer and with the large circle layer (“Layer 4″ above) hit delete on your keyboard.

Now that we’ve deleted the inside of the large circle we can start adding some SWEET 3D effects.  So, select the large circle layer in the layers palette and at the bottom of the layers palette click the little fx button and select Drop Shadow and enter the settings below.  Do this for the other settings pictured below.

In the Bevel & Emboss window select the little picture next to “Gloss Contour” and try to drag the following curve.

Now continue entering the following settings:

Click the rectangle next to Gradient and enter a black on the left and a dark gray on the right.

Add the following stroke values:

Now, Commant + Left Mouse Click the layer of the smallest circle.  Now, we will select the medium sized circle layer and push delete on your keyboard.  This will delete the center of the medium sized circle.  With this we’re going to create a silver ring.

With the medium sized circle layer selected enter the following settings.

Now, select the smallest circle layer and add the following settings: