Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
SlideShare a Scribd company logo

Design Decisions for iPhone Applications, Des Traynor, Contrast

•
•
catherinewall
catherinewall

The document discusses key design decisions for iPhone applications. It emphasizes that design involves making choices and finding focus. It outlines three types of apps: productivity, utility, and immersive. It also covers important design elements like navigation, displaying content, and getting user attention through alerts, sheets and modals. The document stresses sketching multiple ideas and implementing the minimum viable product to start.

1 of 71
DESIGN DECISIONS F O R I P H O N E A P P L I C AT I O N S
WHY ARE WE HERE?
DESIGN IS CHOICE
DESIGN IS CHOICE
DESIGN IS CHOICE
F I R S T I T WA S W E B S I T E S
ONLINE STORES
WEB “2.0”
FA C E B O O K A P P S
AND NOW IPHONE APPS
“The ones who gained profit during the gold rush were those who had made informed moves and stuck to the business principles of mining” — 1878 Gold rush report
N O W, O N T O D E S I G N
DESIGN IS CHOICE
Carrier 12:34 PM Web Page Title http://host.domain.tld 320 x 480 Vertical Resolution
DESIGN IS DESTRUCTIVE
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
GOOD DESIGNERS MAKE CHOICES
“Looking back, I’m proudest of the things we didn’t do” — Steve Jobs
TOUGH QUESTIONS FIRST
SIGNIFICANCE TIME
F I R S T, F I N D Y O U R F O C U S
TWITTER SPORTS MUSIC PHOTOS GAMES RSS VIDEO C H AT FIND YOUR FOCUS FINDER MOVIES SMS FA C E B O O K CONVERTER W E AT H E R
FIND YOUR FOCUS
MAKING CHOICES
NEXT DECISION: “TYPE” OF APP
3 A P P L I C AT I O N “ T Y P E S ”
Carrier 12:34 PM Carrier 12:34 PM Web Page Title Web Page Title http://host.domain.tld http://host.domain.tld Vertical Resolution Web Page Title 320 x 480 12:34 PM 320 x 480 320 x 480 http://host.domain.tld Vertical Resolution Vertical Resolution Carrier
Carrier 12:34 PM Carrier 12:34 PM Web Page Title Web Page Title http://host.domain.tld http://host.domain.tld Vertical Resolution Web Page Title 320 x 480 12:34 PM 320 x 480 320 x 480 http://host.domain.tld Vertical Resolution Vertical Resolution Carrier PRODUCTIVITY UTILITY IMMERSIVE
CUSTOM UI SOUND ENHANCED V E RY V I S U A L ACCELEROMETER NO TEXT IMMERSIVE FULL SCREEN NON-WORKFLOW VIDEO CAMERA LANDSCAPE E N T E R TA I N M E N T C O M PA S S
Carrier 12:34 PM Web Page Title http://host.domain.tld 320 x 480 Vertical Resolution Kerry 1-3 Armagh 0-6
S I M P L E S I N G L E TA S K MINIMAL INPUT R E G U L A R LY CONFIGURED UTILITY V I S U A L LY C O M M O N V I E W, AT T R A C T I V E D I F F E R E N T D ATA
0-3 1-3 Kerry Tyrone Cooper (0-2) Smith (1-0) Donohue (0-1) Kelly (0-1) Duffy (0-1) Keenan (0-1) Donohue Time:14:23
TA S K F O C U S S E D STREAMLINED DRILL DOWN PRODUCTIVITY MINIMAL HIERARCHICAL UNCLUTTERED PA R T O F P H O N E
Leinster Dublin Meath West Meath Wicklow Wexford Carlow Kildare Kilkenny Laois Louth Item
Leinster Leinster Dublin Dublin Alan Brogan (30) Meath Bernard Brogan (10) West Meath Wicklow Mark Vaughn (10) Wexford Jason Sherlock (10) Carlow Kildare Kilkenny Laois Louth Item
Leinster Leinster Dublin Dublin Alan Brogan Dublin Alan Brogan (30) Forward (Dublin) Meath Club: St. Plunketts Bernard Brogan (10) West Meath Games 411 Wicklow Mark Vaughn (10) Career Total 88 - 950 Wexford Jason Sherlock (10) Discipline 45 6 Carlow Kildare Edit Favourite Kilkenny Laois Louth Item
T H I S I S A N I M P O R TA N T C H O I C E
THE TOOLS OF THE TRADE
Carrier 12:34 PM S TAT U S B A R Back Title N AV B A R ( D R I L L D O W N , E T C . ) TA B B A R ( P E R S P E C T I V E S ) Item
Carrier 12:34 PM S TAT U S B A R Back Button Web Page Title Pane Label Button N AV B A R ( D R I L L D O W N , E T C . ) http://host.domain.tld 320 x 480 Vertical Resolution Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer. TA B B A R ( A C T I O N S )
G E T T I N G AT T E N T I O N
MODAL ACTION SHEET ALERT Cancel Touch to Edit Dublin Alan Brogan Dublin Alan Brogan Forward (Dublin) Forward (Dublin) Forward (Dublin) Club: St. Plunketts Club: St. Plunketts Club: St. Plunketts Games Games 411 Games 411 Are you sure? Career Total 88 - 950 Career Total 88 - 950 Career Total a player will result in your Editing 88 - 950 account being flagged for moderation Discipline 45 6 Discipline 45 6 Discipline 45 6 Cancel Edit Edit Favourite Add to Favourites Edit Favourite Add to Favourites Edit Favourite View Player Popularity View Player Popularity Cancel Cancel
D I S P L AY I N G C O N T E N T
I N D E X E D TA B L E I M A G E TA B L E GROUPED LIST D Leinster Dublin Dublin Alan Brogan A Derry B Alan Brogan (30) Forward (Dublin) C D Donegal E Club: St. Plunketts F Bernard Brogan (10) G Down H I Games 411 J Mark Vaughn (10) Dublin K L M Career Total 88 - 950 F Wexford N Jason Sherlock (10) O P Discipline 45 6 Fermanagh Q R S Kildare T G U Edit Favourite V W Galway X Y Z K Laois # Louth Item
THE UI GUIDELINES
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
APPLE CARE ABOUT UI :)
GETTING GOING
SKETCH 5 IDEAS PER DECISION
Code first, think about it later
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
W H AT I S A S K E T C H
QUICK
INEXPENSIVE
C L E A R V O C A B U L A RY
M I N I M A L D E TA I L
A P P R O P R I AT E D E G R E E O F F I D E L I T Y
HOW TO SKETCH
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
Design Decisions for iPhone Applications, Des Traynor, Contrast
Y O U H AV E T O S K E T C H
THIS AIN’T WEB DEVELOPMENT
“Figure out the absolute least you need to do to implement the idea, do just that, and then polish the hell out of the experience” — John Gruber
DESIGN IS CHOICE
@ D E S T R AY N O R D E S AT C O N T R A S T D O T I E

More Related Content

Design Decisions for iPhone Applications, Des Traynor, Contrast

  • 1. DESIGN DECISIONS F O R I P H O N E A P P L I C AT I O N S
  • 2. WHY ARE WE HERE?
  • 6. F I R S T I T WA S W E B S I T E S
  • 9. FA C E B O O K A P P S
  • 11. “The ones who gained profit during the gold rush were those who had made informed moves and stuck to the business principles of mining” — 1878 Gold rush report
  • 12. N O W, O N T O D E S I G N
  • 14. Carrier 12:34 PM Web Page Title http://host.domain.tld 320 x 480 Vertical Resolution
  • 19. “Looking back, I’m proudest of the things we didn’t do” — Steve Jobs
  • 22. F I R S T, F I N D Y O U R F O C U S
  • 23. TWITTER SPORTS MUSIC PHOTOS GAMES RSS VIDEO C H AT FIND YOUR FOCUS FINDER MOVIES SMS FA C E B O O K CONVERTER W E AT H E R
  • 27. 3 A P P L I C AT I O N “ T Y P E S ”
  • 28. Carrier 12:34 PM Carrier 12:34 PM Web Page Title Web Page Title http://host.domain.tld http://host.domain.tld Vertical Resolution Web Page Title 320 x 480 12:34 PM 320 x 480 320 x 480 http://host.domain.tld Vertical Resolution Vertical Resolution Carrier
  • 29. Carrier 12:34 PM Carrier 12:34 PM Web Page Title Web Page Title http://host.domain.tld http://host.domain.tld Vertical Resolution Web Page Title 320 x 480 12:34 PM 320 x 480 320 x 480 http://host.domain.tld Vertical Resolution Vertical Resolution Carrier PRODUCTIVITY UTILITY IMMERSIVE
  • 30. CUSTOM UI SOUND ENHANCED V E RY V I S U A L ACCELEROMETER NO TEXT IMMERSIVE FULL SCREEN NON-WORKFLOW VIDEO CAMERA LANDSCAPE E N T E R TA I N M E N T C O M PA S S
  • 31. Carrier 12:34 PM Web Page Title http://host.domain.tld 320 x 480 Vertical Resolution Kerry 1-3 Armagh 0-6
  • 32. S I M P L E S I N G L E TA S K MINIMAL INPUT R E G U L A R LY CONFIGURED UTILITY V I S U A L LY C O M M O N V I E W, AT T R A C T I V E D I F F E R E N T D ATA
  • 33. 0-3 1-3 Kerry Tyrone Cooper (0-2) Smith (1-0) Donohue (0-1) Kelly (0-1) Duffy (0-1) Keenan (0-1) Donohue Time:14:23
  • 34. TA S K F O C U S S E D STREAMLINED DRILL DOWN PRODUCTIVITY MINIMAL HIERARCHICAL UNCLUTTERED PA R T O F P H O N E
  • 36. Leinster Leinster Dublin Dublin Alan Brogan (30) Meath Bernard Brogan (10) West Meath Wicklow Mark Vaughn (10) Wexford Jason Sherlock (10) Carlow Kildare Kilkenny Laois Louth Item
  • 37. Leinster Leinster Dublin Dublin Alan Brogan Dublin Alan Brogan (30) Forward (Dublin) Meath Club: St. Plunketts Bernard Brogan (10) West Meath Games 411 Wicklow Mark Vaughn (10) Career Total 88 - 950 Wexford Jason Sherlock (10) Discipline 45 6 Carlow Kildare Edit Favourite Kilkenny Laois Louth Item
  • 38. T H I S I S A N I M P O R TA N T C H O I C E
  • 39. THE TOOLS OF THE TRADE
  • 40. Carrier 12:34 PM S TAT U S B A R Back Title N AV B A R ( D R I L L D O W N , E T C . ) TA B B A R ( P E R S P E C T I V E S ) Item
  • 41. Carrier 12:34 PM S TAT U S B A R Back Button Web Page Title Pane Label Button N AV B A R ( D R I L L D O W N , E T C . ) http://host.domain.tld 320 x 480 Vertical Resolution Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean consectetuer. TA B B A R ( A C T I O N S )
  • 42. G E T T I N G AT T E N T I O N
  • 43. MODAL ACTION SHEET ALERT Cancel Touch to Edit Dublin Alan Brogan Dublin Alan Brogan Forward (Dublin) Forward (Dublin) Forward (Dublin) Club: St. Plunketts Club: St. Plunketts Club: St. Plunketts Games Games 411 Games 411 Are you sure? Career Total 88 - 950 Career Total 88 - 950 Career Total a player will result in your Editing 88 - 950 account being flagged for moderation Discipline 45 6 Discipline 45 6 Discipline 45 6 Cancel Edit Edit Favourite Add to Favourites Edit Favourite Add to Favourites Edit Favourite View Player Popularity View Player Popularity Cancel Cancel
  • 44. D I S P L AY I N G C O N T E N T
  • 45. I N D E X E D TA B L E I M A G E TA B L E GROUPED LIST D Leinster Dublin Dublin Alan Brogan A Derry B Alan Brogan (30) Forward (Dublin) C D Donegal E Club: St. Plunketts F Bernard Brogan (10) G Down H I Games 411 J Mark Vaughn (10) Dublin K L M Career Total 88 - 950 F Wexford N Jason Sherlock (10) O P Discipline 45 6 Fermanagh Q R S Kildare T G U Edit Favourite V W Galway X Y Z K Laois # Louth Item
  • 51. SKETCH 5 IDEAS PER DECISION
  • 52. Code first, think about it later
  • 55. W H AT I S A S K E T C H
  • 56. QUICK
  • 58. C L E A R V O C A B U L A RY
  • 59. M I N I M A L D E TA I L
  • 60. A P P R O P R I AT E D E G R E E O F F I D E L I T Y
  • 67. Y O U H AV E T O S K E T C H
  • 68. THIS AIN’T WEB DEVELOPMENT
  • 69. “Figure out the absolute least you need to do to implement the idea, do just that, and then polish the hell out of the experience” — John Gruber
  • 71. @ D E S T R AY N O R D E S AT C O N T R A S T D O T I E