How to Design an iPhone Music Player App Interface With Photoshop CS6
Photoshop CS6 is a much more powerful vector editing application than its predecessors. In this tutorial, we will show you how to use these new features to create an iPhone music player app interface in both the original iPhone resolution, as well as retina without having to repeat the same process for both designs. Let’s get started!
Tutorial Assets
The following assets were used during the production of this tutorial.
- Roadside Assistance Required
- Lime Light
- Other Assets in Download Files
Step 1
Create a new file. Set Width to 320px and Height to 480px.
Step 2
In this step we are going to create the background. There is a new easier way of creating vector shapes in Photoshop CS6 and we are going to use that method through out the whole tutorial.
Create a new group and name it “Background.” Select the Rectangle Tool (R) and in the Options Bar set the Tool Mode to Shape, then click on the button just next to it to choose the Shape Fill Type. From the list of fill types select the Gradient button. Set all the values the same as the values that are highlighted on the image below. Use the colors #3F4042 and #303133 for the gradient.
Click anywhere on the canvas. When the Create Rectangle window pops out, just click OK and make sure the dimensions are set to 700x700px. Name the newly created layer “Background.”