Designing your first iPhone App
Brian Benitez
Lesson 21
It's undeniable that mobile devices have become a huge part of modern society. Similar to what the web did, iOS has revolutionized what digital products can be by giving them a home. The huge difference, however, are the two foundations. iOS is much different than the web in that it's able to provide a native home with a tightly controlled experience for it's applications. That's something the web can't do while catering to tons of browsers, OSs, and computing devices.
This is an exploration into iOS—and should begin familiarize you with the standards and constraints of the platform. It's probably much more different than you expected.
-
From Web to Native: A Journey in Interface Design
Interface designer Cole Peters shares his journey transitioning from a web designer to a native mobile designer. This article highlights some of the main differences in the two. Take a minute and explain some of the key differences that you've just learned to a coworker or friend.
-
Starters Guide to iOS Design
A new article that I wish was around before I ever got into iOS design. This is a great, new resource that covers some of the base technical constraints of the operating system. First, read the article—then, without cheating, get a blank piece of paper and write down the pixel resolution of an iPhone 3GS, iPhone 4, and iPhone 5 in portrait orientation. Also, what does "pixel fitting" mean?
-
My App Design Workflow
Okay, now we're about ready to roll our sleeves up and start designing! But first, let's take a look at iOS design-legend Marc Edwards' blog Bjango, for a peek at what his app design workflow looks like. This is one of the most useful articles regarding iOS-specific design techniques that I've ever come across. Note that the first thing Marc suggests in this article is to start lo-fi @1x, then scale up. Make short a list of a few techniques learned in this article that you'd like to practice in your work flow (try to choose at least 3).
-
5 Things to Know When Designing for iOS
Another leader in the mobile design space, Teehan+Lax, has put together a list of five essential points regarding to iOS design. Jot down these five points with a few small notes for each. Leave the note on or by your desk, somewhere you where you can easily reference it.
-
iOS GUI PSD by Teehan+Lax
Download this PSD and save it. There's no need to recreate default iOS elements that you want to have in your design. Use this UI Kit to represent (and reference) standard iOS elements in your design — this will save you a lot of time in your workflow.
-
How to Design an iPhone Music Player App Interface With Photoshop CS6
We're finally here! The fun part! Now using what you've learned from the articles you've just read, see how you can improve on some the techniques suggested in this tutorial. Note when you've done something different than the tutorial suggested and explain to a friend why you did it. (Oh, and use some different colors for the UI than what's suggested in the tutorial. It's fun to experiment—try a few, if you'd like!)
Did you take the time to complete this lesson? Share your end-result with me! I'd love to see what you've come up with! Tweet it to me!
Brian Benitez
Designer, Weebly
I'm a designer at Weebly with a passion for both technology and simplicity. Currently living and working in San Francisco, CA. Previously: Disqus, Sourcebits, and Mutual Mobile. Check out some of my recent work on Dribbble.