About the mental model of timelines. How to apply the mental model of time and timelines when designing interfaces. Presentation for the World Information Architecture Day 2012, Ghent, Belgium.

1. THE MENTAL MODEL
OF TIMELINES
#WIAD –WORLD IA DAY 2012
#IA2012GENT – FEBRUARI 11, 2012
WOUTER WALGRAEVE - NASCOM

2. HI!
I AM WOUTER WALGRAEVE
AND I WORK AT NASCOM

3. I LOVE
SCIENCE FICTION

6. CLASSIC EXAMPLES OF
THE BOOTSTRAP PARADOX
THE BUTTERFLY EFFECT
…

7. SF IS OFTEN ABOUT
MESSING UP TIME

8. THE MENTAL MODEL
OF TIMELINES
ABOUT THE TITLE

9. so, this presentation talks about
TIME

10. past now future

11. Every now become a past,
every future becomes a now.

12. structure
sequence
order
sort

13. 5 ways to un-
LATCH
content

14. Location – Alphabet – Time – Category - Hierarchy

15. … and deals with
MENTAL MODELS

16. discovering the patterns of thoughts

17. THE MENTAL MODEL
OF TIMELINES
HISTORY OF ‘TIME’

18. NOTION OF TIME

19. THE SEQUENCE OF
DAY & NIGHT

20. CAPTURED BY A
SUNDIAL

23. the sundial became a clock

24. clockwise
counterclockwise
anticlockwise

25. COINCIDENCE?

27. a vertical sundial goes counterclockwise
(in the northern hemisphere)

29. JUST LIKE
THE MUNSTER ASTRONOMICAL CLOCK

31. THE MENTAL MODEL
OF TIMELINES
TIME AS A SPIRAL

35. THE FUTURE TRAVELS
CLOCKWISE

38. THE MENTAL MODEL
OF TIMELINES
FROM SPIRAL TO TIMELINE

39. THE SEQUENCE OF
DAY & NIGHT

40. MAPPED ON OUR MENTAL MODEL OF THE EARTH

43. HALFWAY QUIZ
which way does the earth rotate?

45. BONUS QUESTION
and is that CW or CCW?

46. past now future

47. past now future

52. first last
next next next next next next

53. first last
beginning end

54. earlier now later

55. before item after
older more recent

56. before item after
older items more recent items
previous page next page

58. first
last

61. first
last

64. first eldest
last most recent

65. first eldest
last most recent

66. first eldest
last most recent

67. first last
eldest most recent

68. first last
eldest most recent
last last
most recent most recent

69. eldest
most recent

70. most recent
eldest
most recent
eldest

71. most recent
eldest

72. C A P
R E
6
before item after
ID E 5
older items
previous page
S L more recent items
next page

73. when you click left when you click right
more recent items older items
older items more recent items
previous page next page

74. after item before
more recent items older items
previous page next page

75. most recent
eldest

76. most recent
eldest

77. most recent
eldest

78. most recent
eldest

79. most recent
eldest

80. WRAP UP

82. IT’S OK TO GO:
clockwise
left, right, up, down

83. IT’S OK TO GO:
from to top/left to
bottom/right & vice versa

85. YOU’LL GET INTO TROUBLE WHEN YOU GO
from to bottom/left to
top/right & vice versa

86. YOU’LL GET INTO TROUBLE WHEN YOU GO
counterclockwise

87. AND YET….
visit PLURK.com, see how it challenges your mental
model of the horizontal timeline, use it for one week…
and be convinced their interface makes perfectly sense.

89. TIME’S UP…
twitter me: @wouterwalgraeve

90. WHUFFIES TO
www.flickr.com/photos/hellmy
www.flickr.com/photos/the_diner
www.flickr.com/photos/max_zoomer
www.flickr.com/photos/rodrigodomingos
www.flickr.com/photos/7456216@N08
www.flickr.com/photos/sacred_destinations
www.flickr.com/photos/the_diner
www.flickr.com/photos/telstar

91. NASCOM
INFO@NASCOM.BE
@NASCOM ON TWITTER