You are previewing iPhone User Interface Cookbook.
O'Reilly logo
iPhone User Interface Cookbook

Book Description

"

A concise dissection of Apple’s iOS user interface design principles

  • Learn how to build an intuitive interface for your future iOS application

  • Avoid app rejection with detailed insight into how to best abide by Apple’s interface guidelines

  • Written for designers new to iOS, who may be unfamiliar with Objective-C or coding an interface

  • Chapters cover a variety of subjects, from standard interface elements to optimizing custom game interfaces

In Detail

The incredible growth rates for the iPhone, iPod touch, and iPad have pushed consumers to a new “App” economy, with developers racing to the platform. Mobile touch-centric interfaces vary greatly from traditional computing platforms, and programmers as well as designers must learn to adapt to the new form-factor.

The iPhone User Interface Cookbook offers a complete breakdown of standard interface design on the iPhone, iPod touch, and iPad. You will learn the tools behind the trade, how to properly utilize standard interface elements, and custom UI tricks that will help your work stand out on the App Store.

The book is designed to be a complete overview of interface design on all iOS platforms, offering insight and an inside look into app design. A variety of topics are covered, starting with an overview of tools for the app interface designer, touching upon popular interface components such as the Tab Bar, and offering suggestions for complex game interfaces. Whether you’re new to the platform or a seasoned developer with numerous applications in the App Store, this book strives to teach everyone simple and easy to implement tips for iOS interface design. Regardless of skill level, the iPhone User Interface Cookbook offers a detailed breakdown of all things interface design.

"

Table of Contents

  1. iPhone User Interface Cookbook
    1. iPhone User Interface Cookbook
    2. Credits
    3. About the Author
    4. About the Reviewers
    5. www.PacktPub.com
      1. Discounts
      2. Free eBooks
      3. Newsletters
      4. Code Downloads, Errata and Support
    6. PacktLib.PacktPub.com
    7. Preface
      1. What this book covers
      2. Who this book is for
      3. Getting to know the features of iOS
        1. Looking at the features...
        2. Understanding our audience
        3. Dealing with download caps
      4. The tools of the trade
        1. What we'll be using...
        2. Resources for designing iOS apps
        3. Sizing up interface elements
        4. The complete package
        5. Great examples from the pros
      5. Working with a finger as a pointing device
        1. Working with our hands...
          1. It all depends on how you hold it
      6. Placing visual elements for touch
        1. Determining placement of standard components...
        2. There's more...
          1. Comments on columns
          2. It all depends on how you hold it
      7. What you need for this book
      8. Conventions
      9. Reader feedback
      10. Customer support
          1. Downloading the example code
        1. Errata
        2. Piracy
        3. Questions
    8. 1. Getting Started: Prototyping, Proper Tools, and Testing our Design
      1. Introduction
      2. Starting with the sketch
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Picking up the best stencil set
          2. There's an app for that
        5. See also
      3. Developing a rapid prototype
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      4. Migrating to the high-resolution Retina display
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Don't get too comfortable
          2. Hiring someone to help fix our art problem
        5. See also
      5. Getting our work onto a device
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Setting up multiple devices at once
          2. How many devices should we use?
        5. See also
      6. Taking a screenshot of an application on our device
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      7. Working within Apple's guidelines
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. The Apple design awards
          2. Rejection is a dish best served cold
    9. 2. Customizing our Icon, the Navigation Bar, and the Tab Bar
      1. Introduction
      2. Designing an application icon and preparing it for the user home screen
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Dropping the text
          2. Great gradients
          3. If all else fails....
        5. See also
      3. Creating the rounded edges effect on our icon
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Not being caught cutting corners
        5. See also
      4. Removing the app icon's gloss effect
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      5. Optimizing our newspaper or magazine app's icon for Newsstand in iOS 5
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      6. Creating a custom Tab Bar for our iPhone application
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Losing the freshman 15
        5. See also
    10. 3. Different Ways to "View" our Application
      1. Introduction
      2. Properly utilizing modal views
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Dual modalities
      3. Getting quick updates with Alert Views
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Pushing it back
        5. See also
      4. Improving our application through Table Views
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Two peas in a pod
        5. See also
      5. Integrating Web View into our app
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Back, forward, and home
        5. See also
      6. Including Twitter in iOS 5
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There’s more...
        5. Keep on giving
      7. Determining which view is better for our app
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
    11. 4. Utilizing Common UI Elements
      1. Introduction
      2. Implementing application functionality using a Navigation Bar
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Adding some style
        5. See also
      3. Providing variety through a Tab Bar
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Making our app stand out from the crowd
        5. See also
      4. Speeding up data entry through pickers and custom keyboards
        1. Getting ready
        2. How to do it...
              1. Custom keyboards
              2. Picker Views
        3. How it works...
        4. There's more...
          1. Foreign languages can work too
          2. Keyboards on the Web
      5. Simplicity in the Slider control
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Customize our slider
        5. See also
      6. Offering complex control through an Action Sheet
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      7. Using UI to keep our user inside our application
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      8. Making text fade in or out of view
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Full screen? No problem
          2. High and low
        5. See also
    12. 5. All About Games
      1. Introduction
      2. Planning your game around touch
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Using the iPhone as a controller...for the iPad
        5. See also
      3. Using control techniques that are optimized for touch
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Using an actual control pad
        5. See also
      4. Designing HUDs with limited real estate
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Customizations
        5. See also
      5. Accounting for the lost Status Bar
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
    13. 6. Starting, Stopping, and Multitasking
      1. Introduction
      2. Starting the application with a proper Default.png
        1. Getting ready
        2. How to do it...
              1. The right way
              2. The wrong, but possibly preferable way
        3. How it works...
        4. There's more...
          1. We can retina optimize our Default.png too
          2. Prepare for multiple orientations
        5. See also
      3. Planning our application UI for a first impression
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Lend a helping hand
        5. See also
      4. Dealing with phone calls or text messages
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. They're not text messages, but they're close enough
        5. See also
      5. Working with multitasking in iOS 4
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Multitasking can be frustrating
        5. See also
      6. Periodical downloads and Newsstand in iOS 5
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Let's multitask.
        5. See also
      7. Making accommodations for other apps that are multitasking
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Double status bar all the way
        5. See also
    14. 7. Notifications, Locations, and Sounds
      1. Introduction
      2. Integrating push or local notifications into our app
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Using a single button notification if we want
          2. Providing a positive sound
        5. See also
      3. Using badges to draw attention to new content
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Accompanying badges with notifications
        5. See also
      4. Managing audio properties and keeping silent
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Audio isn't required, but it is appreciated
          2. Keeping those who can't hear our audio in mind too
      5. Locating the sweet spot when handling location services
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      6. Making an app usable without location data
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. A few apps just shutting down completely
        5. See also
      7. Making cents with proper ad placement
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Combining forces
        5. See also
    15. 8. Accessibility, Options, and Limited Opportunity to Help our User
      1. Introduction
      2. Using the 80 percent rule when developing optimal settings
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Ratio flexibility
          2. Splitting our work into multiple apps
        5. See also
      3. Properly supporting copy and paste
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Menu customizations
        5. See also
      4. Supporting undo and redo
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
      5. Configurations in, settings out
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Do we have to?
        5. See also
      6. Cutting features when in doubt
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Cut them out for now, but don't get rid of them forever
        5. See also
      7. Supporting VoiceOver and other accessibility features
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Offering variable text size
          2. Helping color-blindness too
        5. See also
    16. 9. Migrating to the iPad
      1. Introduction
      2. Migrating our app to the iPad
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. If we can only do iPhone, we can at least increase our art quality
        5. See also
      3. Experiences that are possible on the iPad, but not on the iPhone
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Hardware differences
        5. See also
      4. Accounting for resolution and aspect ratio changes
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. When should we expect the Retina iPad?
        5. See also
      5. Managing our app for use with two hands
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Case considerations
        5. See also
      6. Designing our app with all orientations in mind
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. Another example
        5. See also
      7. Including Popovers and new UI elements for the iPad
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. There's more...
          1. iPad killed the radio star
          2. Multi-finger gestures
        5. See also
      8. Designing an app using skeuomorphic designs
        1. Getting ready
        2. How to do it...
        3. How it works...
        4. See also
    17. A. The Importance of Direct Manipulation
    18. B. If you need a stylus, you blew it