iPhone photoshop template

Download the PSD source file.

Well it’s pretty late on a Friday night and I really should be out drinking but I’ve just got my internet sorted in my new house so thought I’d take the opportunity to post this photoshop template for you all which I created earlier today.

I saw a site a while back when the iPhone had been recently launched which allowed you to type in a url and it would show you how the site looked on an iPhone, pretty cool. Once I saw this I thought it could be an interesting way to present design concepts for mobile sites to clients, or to put a photo of me or my family in and make it into a desktop wallpaper.

The easiest way to do this would be to just overlay a photo on an existing shot of the iPhone, but you wouldn’t get all the date and time overlays which would add that realistic polished effect, so finally I’ve got round to creating a PSD where you can simply replace the masked image and export to any file type you like.

Download the PSD source file.

Once you’ve downloaded the psd, to change the image on the screen of the iPhone simply paste your image onto the layer highlighted below.

Hey presto your design, photo or any image you like is in and can be exported to any format you wish.

Why not put a slide show in there?

If you have some very basic flash skills it is easy to put a slideshow or flash movie into this template too.

Simply turn off the background layer, green mask and editable image layers and save as a 24 bit png (WITH THE TRANSPARENCY BOX CHECKED), import this into flash and create a mask the size of the iPhone screen on the layer below and put your movie into that mask.

Good luck and I hope this template will be of use to some of you, if it is let me know and add links to your results in the comments.