More Related Content
Similar to User Experience Design for iPad Applications- Impetus Webinar (20)
More from Impetus Technologies (20)
User Experience Design for iPad Applications- Impetus Webinar
- 1. Impetus Technologies Inc.
User Experience Design For iPad
© 2014 1 Impetus Technologies
Applications
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 2. The Problem
• Why should you support the iPad
• How do you support the iPad?
• It’s going to cost more to develop for the iPad; is it worth it?
© 2014 2 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 3. What’s Different
• Screen size
• Additional UI elements
• Users’ expectations
• Revenue
© 2014 3 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 4. Screen Sizes
iPhone 320 ×480 640 ×960
iPad 1024 x 768 2048 × 1536
© 2014 4 Impetus Technologies
Legacy Retina
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 5. Additional UI Elemenets
• Popovers
• Split views
© 2014 5 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 6. Additional UI Elements
• Popovers
• Split views
© 2014 6 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 7. User’s Expectations
• Users expect a richer user experience
• Users expect higher fidelity artwork
© 2014 7 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 8. Revenue
• iPad apps tend to sell at a higher price
© 2014 8 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 9. Options
• Rely on the compatibility mode
• Create a universal app
• Create a version of your app for the iPad
© 2014 9 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 10. Compatibility Mode
• iPhone apps run in a compatibility mode
• No additional development effort
• This might be a reasonable choice
© 2014 10 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 11. © 2014 11 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 12. Universal App
• Simply scaling works but often does not yield the best results
• You should take advantage of available space
© 2014 12 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 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, it’s much harder
© 2014 13 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 14. iPad App
• iPad apps aren't’t oversized iPhone apps
• However, the development effort may not be significantly
more
• Avoid making users feel that they’re choosing between two
different apps
© 2014 14 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 15. How are Costs affected?
• Consider
• Design effort
• QA effort
• Engineering effort
© 2014 15 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 16. Poll
• What is the most difficult challenge you face in
developing for the iPad?
• Design
• Engineering staffing
• QA testing
• Cost
© 2014 16 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 17. And now we get technical
© 2014 17 Impetus Technologies
- 19. Keep Focused
• Give people innovative ways perform a clearly defined task
• Avoid adding features that are not directly related to the main task
• Don’t bring back the functionality you removed from your iPhone
© 2014 19 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
app
- 20. Guidelines that Work
• Make it work seamlessly in either mode
• Minimize full frame swipes
• Reduce navigation to a sidebar or a popover
© 2014 20 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 21. Guidelines that Don’t
• Make apps look like physical objects
© 2014 21 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 22. Skeuomorphic Design
• Hard to say
• Hard to do
• Hard to measure results
© 2014 22 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 23. © 2014 23 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 24. No Tabs Bar
• The iPad tends to be used in a more relaxed mode
• Tab bar buttons can be hard to reach!
© 2014 24 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 25. Flip board : Your Social News
© 2014 25 Impetus Technologies
Magazine
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 26. © 2014 26 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 27. © 2014 27 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 29. © 2014 29 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 30. © 2014 30 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 31. © 2014 31 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 32. Scrolling or Paging?
• Scrolling is easier than swiping from page to page
• Paging is better than scrolling
• No clear answer for all apps
© 2014 32 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 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, five-finger swipe left or right, and five-finger pinch
© 2014 33 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 34. Be Thoughtful
• You don’t have to use the split view
© 2014 34 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 36. © 2014 36 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 37. Be Creative
• Flip board
• Paper
• Pennant
© 2014 37 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 38. © 2014 38 Impetus Technologies
Paper by Fifty Three
- 39. © 2014 39 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 40. © 2014 40 Impetus Technologies
Topps Pennant
- 41. © 2014 41 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 42. © 2014 42 Impetus Technologies Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 43. © 2014 43 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 44. Collecting Thoughts
• Minimize input, maximize output
• Don’t 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
© 2014 44 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 45. © 2014 45 Impetus Technologies
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
© 2014 46 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 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
© 2014 47 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 48. Icons
• You are supporting Retina displays, aren’t
you?
• The good news is you’ve already created
several of the icons you’ll need
© 2014 48 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 49. iPhone and
iPod touch
Application icon 57 x 57 114 x 114 72 x 72 144 x 144
© 2014 49 Impetus Technologies
High-resolution
iPhone and iPod
touch
Recorded version available at
iPad High-resolution iPad
http://www.impetus.com/webinar_registration?event=archived&eid=59
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)
1536 x 2008
(portrait)
2048 x 1496
(landscape)
Small icon for
Search results and
Settings
29 x 29 58 x 58
50 x 50
(Search results)
29 x 29
(Settings)
100 x 100
(Search results)
58 x 58
(Settings)
- 50. iPhone and
iPod touch
Application icon 57 x 57 114 x 114 72 x 72 144 x 144
© 2014 50 Impetus Technologies
High-resolution
iPhone and iPod
touch
Recorded version available at
iPad High-resolution iPad
http://www.impetus.com/webinar_registration?event=archived&eid=59
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)
1536 x 2008
(portrait)
2048 x 1496
(landscape)
Small icon for
Search results and
Settings
29 x 29 58 x 58
50 x 50
(Search results)
29 x 29
(Settings)
100 x 100
(Search results)
58 x 58
(Settings)
- 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
© 2014 51 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 52. Developing a Universal App
• Consider defining separate view controller classes for
iPhone and iPad devices
© 2014 52 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 53. © 2014 53 Impetus Technologies
Case Study : Mail
- 54. © 2014 54 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 55. Case Study
• Mail on the iPhone is on the go
• Mail on the iPad encourages more in-depth use
• Users coming from the iPhone can navigate easily
© 2014 55 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 56. Case Study
• To enhance the mobile email experience, Mail on
iPad evolves the iPhone Mail UI in a number of
important ways
© 2014 56 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 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
© 2014 57 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 58. Case Study
• And a small amount of skeuomorphism
© 2014 58 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 59. © 2014 59 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 60. © 2014 60 Impetus Technologies
Case Study : iBooks
- 61. © 2014 61 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 62. © 2014 62 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 63. © 2014 63 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 64. © 2014 64 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 66. © 2014 66 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 67. © 2014 67 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 68. © 2014 68 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 70. Summary
• Don’t just make your iPhone app bigger
• Do leverage your investment in iPhone development
• Do create a richer customer experience
• Do create greater customer engagement
© 2014 70 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 71. © 2014 71 Impetus Technologies
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
© 2014 72 Impetus Technologies
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59
- 74. © 2014 74 Impetus Technologies
Thank You
Write to us at inquiry@impetus.com
Follow us on Twitter @impetustech
Recorded version available at
http://www.impetus.com/webinar_registration?event=archived&eid=59