ITU - Mobile App Design Presented at Designit, March 2012 In relation to a guest lecture at the IT University in Copenhagen

1. Mobile User Experience
- reshaping our human agency
Henrik Hedegaard
Information Architect, Designit
@henrikhedegaard
Twitter

2. Responsive design
A way to make your website look and work perfectly
across all the new devices out there without
creating and maintaining parallel mobile websites.

3. “One can also hope
that future rings
will be designed by
jewelry designers
and look less nerdy.”
– Jakob Nielsen

4. “The word design is everything
and nothing. The design and
the product itself are
inseparable.”
– Jonathan Ive

6. Designit in ballpark figures
20 240 25
YEARS TOP BRAINS NATIONS

7. Designit in ballpark figures
11 +3 10
OFFICES NEW COUNTRIES
DENMARK
GERMANY SPAIN
NORWAY SWEDEN
UNITED KINGDOM CHINA
BRAZIL

8. Our Collective Brain
Identify user needs Rethink & discover
opportunities
Strategic-creative &
user driven approach
Translate into
new services
User value creates
business value

9. Service Delivery
User studies & ethnography Brand and communication Digital design
Digital & product experiences Product design & ergonomy Service innovation

10. Some of the clients

12. Client’s choice…
Prolong the past
Or make changes?

14. Opportunity Solution

15. Rethink approach!
Opportunity Solution

16. User
es Expe
centri c ser vic r ie n
User ce!
Rethink approach!
Opportunity Solution

19. “There’s an app for that”
The market for crap-apps
is totally over-saturated

24. http://www.realmacsoftware.com/clear/

25. http://www.realmacsoftware.com/clear/

26. http://www.realmacsoftware.com/clear/

27. Unique Usage
Simplicity Above All

28. Worth Considering

29. Worth Considering
Business
Must be based on a
viable business model

30. Worth Considering
Business
Must be based on a
viable business model
Feasibility
Must be realistic from a
technical perspective

31. Worth Considering
Business
Must be based on a
viable business model
Desirability
Feasibility App must deliver
Must be realistic from a real user value
technical perspective

32. Worth Considering
Responsibility
Must be a win-win and
Business
develop sustainable
Must be based on a end-user relations
viable business model
Desirability
Feasibility App must deliver
Must be realistic from a real user value
technical perspective

33. Process stakeholders
Develop Design Business

34. Process stakeholders
Develop Design Business
Function Form $$$$$

35. We All Work For End-Users

36. We All Work For End-Users

39. “ Perfection is achieved, not
when there is nothing more
to add, but when there is
nothing left to take away.

42. Interaction Design
Natural User Interfaces through touch

43. Direct Manipulation
We still love you, but...

44. Multi touch is the new sheriff in town

45. Touch is designing for humans
It supports our perception of objects

46. Layered content
Step-wise touch interaction

47. Touch Gesture
Reference Guide
Luke Wroblewski
www.lukew.com/ff/entry.asp?1071

49. Uzu - kinetic multitouch particle visualizer

52. Designing with Metaphors
Visually & Interactions

53. The best user interface is when
we don’t perceive the interface

55. The best user interface is with
no perception if an interface

56. Page “flip” - WTF!?
The best user interface is with
no perception if an interface

57. Perception is more than visual
We hold, see, hear, feel

58. Metaphors bind it all together

67. When the UI really works,
we tend to forget it’s an interface

68. Jyske Bank
SmartPhone, Tablet, Responsive webdesign

79. Thanks

80. Links & References
Designing for iPad: Reality Check
Information Architects
iPad vs. iPhone: A User Experience Study
UX Magazine
iPad User Experience Guidelines
UX Magazine
App Store Review Guidelines
Apple
Small Sufaces
Mobility Blog
Thoughts on Designing for iPad
Derek Powazek
Touch Gesture Reference Guide and more
Luke Wroblewski Blog

81. POINTERS IN MOBILE DESIGN
Who, what, where, when and why

82. 10 Success Factors in IxD
SATISFACTION
LEARNABILITY MEMORABILITY
EFFICIENCY CONSISTENCY
MAPPING VISIBILITY
SIMPLICITY FEEDBACK
ERROR RECOVERY

83. The fat-finger problem

84. The fat-finger problem

85. Enrich standard navigation
Huffington Post
Web-relation and totally ugly
New York Times
Bad positioning
Supplemented with pinch-gesture
Zite
Very usable, but ugly
Supplemented with tap-gesture

86. Don’t Gesturize the App

87. Don’t Gesturize the App

88. Don’t Gesturize the App

89. Consider Multi-User

90. Consider Multi-User

91. Custom pop-overs & modals

92. Custom pop-overs & modals

93. Engaging splash screens

94. Engaging splash screens

95. Engaging splash screens

96. What’s touchable??

97. What’s touchable??

98. What’s touchable??

99. Provide a “home” screen

100. Guide you user

101. Guide you user

102. Simplify complexity
- Goal: engaging self service apps
- Goal: reduce service calls
- Minimal amount of buttons
- Quick monitoring of usage
- Quick history functionality
- Quick statistical coloration
- Simple mobile code / login
- Well-know interface standard

103. The Extra 10%

104. The Extra 10%