1. First in Photoshop create a new image.
For traditional layouts
- iPhone 4: 640 x 920
- Phone: 640 x 1096
- Tablet: 1536 x 2048
- iPhone 4: 640 x 960
- Phone: 640 x 1136
- Tablet: 1546 x 2048
2. Now go to the website you're looking to create an app for OR the image you would like to be used and either save, copy, or screen capture the image you would like.
For example, below I want to take their logo and one of their images as well to incorporate within their homescreen.
3. Using screen capture on Mac (command+shift+4) or PC (CTRL+ALT+PRNTSCRN) I took the two images I want to use for my Home Screen.
4. Now drag the image or images you want used onto the image you created in Photoshop. Play with the sizing until you get it where you like and then "Place" the image!
Remember to leave some space near the bottom if you plan on including the Call, Directions or Tell a Friend buttons!
5. Now, you'll want to fill in the white space on the bottom. This can be done in two easy steps.
- Create a new layer
- Use the draw shape tool to create a black filled rectangle on the newly created layer
6. After you're happy with the way your Home Screen looks go to File-> Save for Web Devices -> Save
This will ensure you save it as a .png file!
That's it, now just upload it into the Appearance step!