UPDATE: Find the latest version of this template at http://marshallbock.com/fun/iphone4s.
Pretty much every decent iPhone app ever made also has a website extolling the virtues of the app and its features. And pretty much every one of those sites has one thing in common: an image of an iPhone, its screen displaying a shot of the app.
So the developer provides the screenshot, but where does that iPhone image come from? Probably a template. Somewhere, at some point, a designer sat down and recreated the device in Photoshop, and it eventually ended up on that website.
Another iPhone Template?
There are a lot of those templates out there, but for one reason or another, I’ve been a little disappointed by all of them. Without naming names, they’re all decent-to-good, but I always feel like something’s a little off.
Some tend to be inconsistent with the rendering Apple uses in its own iPhone product images. With others, the proportions are off. Or the buttons are in the wrong positions. Or the image is rasterized and unscalable. Or it’s made of vectors but riddled with split pixels.
For a whole host of reasons, I haven’t been satisfied with the existing options. So I made my own with these goals in mind:
- Both 4 and 4S models
- Both black and white body colors
- Portrait, landscape, and angled orientations
- Every combination of the preceding bullet points
- Rendering that matches Apple’s product images as closely as possible
- Created at high res scale for Retina Display
- Made entirely of vectors and layer styles for scaling up
- Full alignment to a 2px grid for pixel precision at 50% scale
- Screen images as Smart Objects for inserting your own screenshots
- Clean, organized, color-coded, well-named groups and layers
Click the image below for a full-resolution preview.
Dig it? Download the PSD for free :D
Feeling generous? Feel free to buy me a virtual cup of coffee with the Donate button below.
There’s a readme.txt file in the zip, which you can check out for instructions on how to use the template.
NOTE: This template was made using Photoshop CS5. It should open just fine on earlier CS versions with a couple caveats: the shadows under the devices will render incorrectly before CS4 (feathered vector masks); and the screen images are Smart Objects, which CS1 doesn’t support.
- djhartley likes this
- nupaanmungming likes this
- mariaslifestory likes this
- craigjorgensen reblogged this from marshallbock
- designbynuff likes this
- zzyss likes this
- pixelalliance likes this
- bady likes this
- mxvltr likes this
- jlofstedt likes this
- fban likes this
- hagersebastian reblogged this from marshallbock
- tolu likes this
- seanr likes this
- jasonwstanley likes this
- iubongsun likes this
- debay reblogged this from marshallbock
- imneway reblogged this from marshallbock
- imneway likes this
- oscarbarber reblogged this from marshallbock and added:
- notorioususb likes this
- danhigbie likes this
- carlofranco likes this
- yatil likes this
- fatihturan likes this
- presshouse likes this
- gedy likes this
- thinksplendid likes this
- blasko likes this
- jamkanrad likes this
- wesmitchell likes this
- brianpurkiss reblogged this from marshallbock
- brianpurkiss likes this
- jacksonlatka likes this
- stevenisinberlin likes this
- markwyner reblogged this from 9-bits and added:
- opaaul likes this
- scottographs likes this
- drewmellow reblogged this from 9-bits and added:
- drewmellow likes this
- bencochran likes this
- christopherdwhite reblogged this from marshallbock
- edgema likes this
- lostinaseriesoftubes likes this
- anthonyarmendariz reblogged this from marshallbock
- jicooo likes this
- frijole likes this
- mrbushido reblogged this from marshallbock and added:
- mrbushido likes this