Visual Design and Mobile Apps

1. Visual design
- a key part of mobile apps
Henrik Hedegaard
Information Architect
@henrikhedegaard

2. Designit in numbers
20 250 25
YEARS
TOP BRAINS
NATIONS

3. Designit in numbers
+3 10
09
OFFICES
NEW
DENMARK
GERMANY SPAIN
NORWAY SWEDEN
UNITED KINGDOM CHINA
COUNTRIES

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

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

6. Some of the clients

7. Your choice…
Prolong the past
Or make changes?

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

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

13. What is a good design?

14. What is a good design?
“FILL IT UP”
This is actually a squirt gun
...for kids!!!
Press FIRE!!
“SHOOOT”

16. There is no SINGLE solution
only pointers

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

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

19. We work for the end-user!

21. Potential for success when...
- it solves my problem
- it address my context
- it has a great look & feel
- it is easy to use
- it has the right functionality
- it performs great
- it inspires me in my task
...and it make me WANT
to use it again
Business, Branding & Marketing

22. POINTERS IN MOBILE DESIGN
Who what where when and why

23. The fat-finger problem

24. The fat-finger problem

25. 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

26. Don’t Gesturize the App

27. Consider Multi-User

28. Consider Multi-User

29. Custom pop-overs & modals

30. Custom pop-overs & modals

31. Engaging splash screens

32. Engaging splash screens

33. Engaging splash screens

34. What’s touchable??

35. Provide a “home” screen
NASA App
- One big mess
- No overview
But only if you
have the right
level of complexity

36. Provide a “home” screen

37. Provide a “home” screen

38. Guide you user

39. Guide you user

40. 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

41. The Extra 10%

42. The Extra 10%

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

44. FORM & FUNCTION
WHEN IS OK, OK?

45. When to accept a functionality
Develop
Design
Business
✔
✔
✔

46. A DIGITAL ECO-SYSTEM
Print, as we knew it, is dead...

47. A digital eco-system

51. Service integration
- Same UI universe
- Same visual style
- Same metaphores
- Different interactions
- Different context
- Diffrent technology

52. An inclusive strategy

53. Services with purpose
Regular websites
Responsive webdesign
Web-apps
Hybrid apps
Native apps

54. Jyske Bank
SmartPhone, Tablet, Responsive webdesign

55. Jyske Bank - Digital Strategy
2008 - New website
2010 - Mobile Currency calculator (iPhone)
2010 - Mobile Banking (iPhone + Android)
2011 - Responsive webdesign
2011 - Mobile Banking (iPad)

78. Submitted to App Store

79. http://smallsurfaces.com/
http://www.simplecue.com/
http://powazek.com/posts/2583