Making home screens is a breeze in Photoshop! The home screen is the first thing users see after the application is launched, so make sure it is of high quality and professional.
- Create an image in Photoshop:
For traditional layouts
- iPhone 4: 640 x 920
- Phone: 640 x 1096
- Tablet: 1536 x 2048
For modern layouts
- iPhone 4: 640 x 960
- Phone: 640 x 1136
- Tablet: 1546 x 2048
- Go to the website you would like to create an app for, or the image you would like to use, and either save, copy, or screen capture the image.
Note: this article uses the website below as an example.
- Using screen capture on Mac (Command+Shift+4) or PC (Ctrl+Alt+PrntScrn) take a screenshot of the images you would like to use.
- Now drag the image or images you want onto the image you created in Photoshop. Play with the sizing until you get it where you like and then "Place" the image.
Note: Remember to leave some space near the bottom if you plan on including the Call, Directions or Tell-a-Friend buttons.
- Fill in the white space on the bottom. This can be done in two steps:
- Create a new layer.
- Use the draw shape tool to create a black filled rectangle on the newly created layer.
- Once you are happy with the way your Home Screen looks, go to File > Save for Web Devices > Save (this saves the image as a .png file).
- Upload the file into the Appearance step.