Design principles applied to map design & usability

Keynote for my session at #FOSS4G 2011

Transcript

1. Hello,
2. vizzuality Lead designer & co-founder
7. 15 Design principles you should apply *always*
8. _Classical Conditioning A technique used to associate a stimulus with an unconscious physical or emotional response.
11. _Aesthetic Effect Aesthetic designs are *perceived* as easier to use and better, than less-aesthetic designs.
13. NIXON
14. KENNEDY
20. _Golden Ratio A ration within the elements of a form, such a height to width, approximating 0.618.
24. _Forms follow function Form in design results from purity of function.
26. You can find this map at mapbox.com
27. You can find this map at mapbox.com
28. _Affordance A property in which physical characteristics of an object or environment influence its function.
30. Pull
31. Push
34. _Consistency & Constraint The usability of a system is improved when similar parts are expresed in similar ways.
37. Zoom & movement controls Layers
40. _Fitt's law The time required to move to a target is a function of the target size and distance to the target - plus the precision needed -.
46. _Forgiveness Designs should help people avoid errors and minimize the negative consequences of errors when they do occur.
50. _Use of Color Color is used in design to attract attention, group elements, indicate meaning, and enhance aesthetics.
51. __Number of colors No more than 4-5 colors.
52. You can find this map at mapbox.com
53. __Color combinations Something aesthetic please. Protip! colorbrewer2.org
54. __Saturation More saturated for attracting attention. More saturated more eye fatigue.
56. __Meaning Analyze your colors meaning before aplying them.
58. _Interference Effects A phenomenon in which mental processing is made slower and less accurate by competing mental processes.
59. Black Red Yellow Purple Green Blue Yellow Red White White Blue Green Black Brown Orange Green Orange Yellow Red
60. _Nudge A method for predictably altering behavior without restricting options or signicantly changing incentives.
64. _Inantentional Blindness The failure to cognitively process a stimulus that is presented in clear view, leaving the observer without any awareness or memory of the stimulus.
66. _Progressive disclosure A strategy for managing information complexity in which only necessary or requested information is displayed at any given time.
70. _Visibility The usability of a system is improved when its status and methods of use are clearly visible.
78. Thank you! @saleiva saleiva@vizzuality.com
81. _Framing A technique that influences decision making and judgement by manipulating the way information is presented.
82. Gas kills over 100 Hostages “
83. “ Gas saves over 500 hostages