User Experience Design For Ipad Applications

User Experience Design for iPad Applications
June 8, 2012
2012 Impetus Technologies
Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59
Welcome
The Problem
Why should you support the iPad How do you support the iPad? Its going to cost more to develop for
the iPad; is it worth it?
Whats Different
Screen size Additional UI elements Users expectations Revenue
Screen Sizes
Legacy Retina
iPhone
320 480
640 960
iPad
1024 x 768
2048 1536
Additional UI Elements
Popovers Split views
7 Users Expectations
Users expect a richer user experience Users expect higher fidelity artwork
Revenue
iPad apps tend to sell at a higher price
Options
Rely on the compatibility mode Create a universal app Create a version of your app for the
iPad
10 Compatibility Mode
iPhone apps run in a compatibility mode No additional development effort This might be a reasonable choice
12
Universal App
Simply scaling works but often does not
yield the best results
You should take advantage of available

space
13
Universal App
For the iPhone, if you depend on the
standard UI elements, you can create a pretty good looking app
For the iPad, its much harder

14
apps
iPad App
iPad apps arent oversized iPhone However, the development effort may
not be significantly more
Avoid making users feel that theyre

choosing between two different apps
15
How are costs affected?

Consider Design effort QA effort Engineering effort
16
Poll
What is the most difficult challenge you
face in developing for the iPad?
Design Engineering staffing QA testing Cost

17
And now we get technical
Designing your App
19
Keep Focused
Give people innovative ways perform a
clearly defined task
Avoid adding features that are not

directly related to the main task
Dont bring back the functionality you

removed from your iPhone app
20 Guidelines that Work

Make it work seamlessly in either mode Minimize full frame swipes Reduce navigation to a sidebar or a
popover
21 Guidelines that Dont
Make apps look like physical objects
22
Skeuomorphic Design
Hard to say Hard to do Hard to measure results
24
No Tab Bars
The iPad tends to be used in a more
relaxed mode
Tab bar buttons can be hard to reach!
25
Flipboard: Your Social News Magazine

28
USA TODAY for iPad
32 Scrolling or Paging?
Scrolling is easier than swiping from
page to page
Paging is better than scrolling No clear answer for all apps

33 Use Gestures Wisely

Remember that one hand is usually
holding the device
Introduce non-standard gestures

through first-time tutorials
Be aware of iOS-level gestures,

including the four-finger swipe up, fivefinger swipe left or right, and five-finger pinch
34
Be Thoughtful
You dont have to use the split view
35
iA Writer
37
Be Creative
Flipboard Paper Pennant
38
Paper by FiftyThree
40
Topps Pennant
44 Collecting Thoughts
Minimize input, maximize output Dont waste screen real estate and
user attention on secondary functions
If it works on the iPad, with a few

tweaks it will work on a laptop
45
A few other things
46
Artwork
Adapt art to the screen size Scaling up an iPhone app to fill the iPad
screen is not recommended
47
Default.png
For iPhone and iPod touch launch
images, include the status bar region
For iPad launch images, do not include

the status bar region
Most iPad applications should supply a

launch image for each orientation
48
Icons
You are supporting Retina displays,
arent you?
The good news is youve already

created several of the icons youll need
49
Application icon
iPhone and iPod touch
High-resolution iPhone and iPod touch
iPad
High-resolution iPad
57 x 57
114 x 114
72 x 72
144 x 144
App icon for the App Store
512 x 512
1024 x 1024
512 x 512
1024 x 1024
Launch image
320 x 480
640 x 960
768 x 1004 (portrait) 1024 x 748 (landscape) 50 x 50 (Search results) 29 x 29 (Settings)
Small icon for Search results and 29 x 29 Settings
58 x 58
50
Application icon
iPhone and iPod touch
High-resolution iPhone and iPod touch
iPad
High-resolution iPad
57 x 57
114 x 114
72 x 72
144 x 144
App icon for the App Store
512 x 512
1024 x 1024
512 x 512
1024 x 1024
Launch image
320 x 480
640 x 960
Small icon for Search results and 29 x 29 Settings
58 x 58
51
Payload Size
Apps can be as large as 2GB, but be
aware of download times
Make efforts to minimize file size There is a 50MB limit for Over the Air
downloads
52
Developing a Universal App

Consider defining separate view
controller classes for iPhone and iPad devices
Case Study: Mail
55
Case Study
Mail on the iPhone is on the go Mail on the iPad encourages more indepth use
Users coming from the iPhone can

navigate easily
56
Case Study
To enhance the mobile email
experience, Mail on iPad evolves the iPhone Mail UI in a number of important ways
57
Case Study
People can use the app in any of the
four orientations
Most of the screen is reserved for the

current message
A flatter hierarchy Drastically reduced full-screen

transitions
58
Case Study
And a small amount of skeuomorphism
Case Study: iBooks
X .5
X .5
Case Study: Google Translate
X .5
X .5
Summary
70
bigger
Summary
Dont just make your iPhone app
Do leverage your investment in iPhone

development
Do create a richer customer experience Do create greater customer

engagement
About Impetus
72
Strategic partners for software product
engineering and R&D
Thought leaders in cutting-edge

technologies
Mature processes and practices that

are methodical, yet flexible
Diverse domain expertise

Q&A
Follow us on Twitter @impetustech

75
Referenced Apps
Flipboard: Your Social News Magazine, By Flipboard Inc.

Google Translate, By Google, Inc. iA Writer, By Information Architects, Inc.Paper by FiftyThree, By FiftyThree, Inc.
Topps Pennant, By The Topps Company, Inc.

USA TODAY for iPad, By USA TODAY
76
Legal
2012 Impetus Technologies. All rights reserved. You are prohibited from making a copy or modification of, or from redistributing, rebroadcasting, or re-encoding of this content without the prior written consent of Impetus Technologies. This presentation includes images from other products and services. These images are used for illustrative purposes only. There is no explicit or implied endorsement or sponsorship of these products by Impetus. All copyrights and trademarks are property of their respective owners. Apple and the Apple logo, are trademarks of Apple Inc., registered in the U.S. and other countries. IOS is a trademark or registered trademark of Cisco in the U.S. and other countries.

User Experience Design For Ipad Applications - Impetus Webinar

Încărcat de

Informații document

Titlu original

Drepturi de autor

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

User Experience Design For Ipad Applications - Impetus Webinar

Încărcat de

Drepturi de autor:

2012 Impetus Technologies

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

iPad apps tend to sell at a higher price

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

You should take advantage of available

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

For the iPad, its much harder

Avoid making users feel that theyre

How are costs affected?

Design Engineering staffing QA testing Cost

And now we get technical

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Designing your App

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Avoid adding features that are not

Dont bring back the functionality you

20 Guidelines that Work

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

21 Guidelines that Dont

Make apps look like physical objects

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Tab bar buttons can be hard to reach!

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Flipboard: Your Social News Magazine

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

USA TODAY for iPad

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Paging is better than scrolling No clear answer for all apps

33 Use Gestures Wisely

Introduce non-standard gestures

Be aware of iOS-level gestures,

You dont have to use the split view

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

If it works on the iPad, with a few

A few other things

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

For iPad launch images, do not include

Most iPad applications should supply a

The good news is youve already

Recorded version available at http://www.impetus.com/webinar_registration?event=archived&eid=59

iPhone and iPod touch

High-resolution iPhone and iPod touch

App icon for the App Store

768 x 1004 (portrait) 1024 x 748 (landscape) 50 x 50 (Search results) 29 x 29 (Settings)