iPhone Development 101

iPhone 101

Code Tips



For Photoshop:

This is a layered Photoshop file (in portrait mode), 640 x 1136, with the status bar, nav bar (and buttons), and tab bar as separate layers. There are also several background layers, including one at 640 x 960 for 3.5" screens.

This is a fairly simple template that I use for a starting point on my app designs. If you need more retina elements, check out the iPhone 4 GUI PSD from Teehan-Lax.

iphone5.psd.zip (2.6MB)

Printable Templates:

Here are a couple of printable PDF templates for sketching out app designs. These templates are also included in the idev101 Quick Reference app.

With Nav Bar and Tab Bar
Landscape - Blank - 2 Screens

* The 5.5 x 8.5" templates are formatted to print on 8.5 x 11 paper, and include crop marks for easy trimming.

The app also contains these extra templates:
  • Blank - 2 Screens
  • With 10x10pt Grid
  • With Status Bar
  • With Nav Bar
  • Landscape with 10x10pt Grid
  • Landscape with 10x10pt Grid - 2 screens

Download it today!

And here are some more Tools for Creating App Mockups.