Information Architecture for Everyone

This talk makes a broad attempt to answer the question “What is Information Architecture?”, covering examples from various spheres of life.

This talk was presented at Hillhacks 2018 https://hillhacks.in and was slightly adapted from the previous talk presented at WIAD New Delhi 2018: https://speakerdeck.com/souvikdg/information-architecture-for-everyone-wiad

Transcript

1. Information Architecture
   for everyone
   

   View Slide

2. @souvikdg
   

   View Slide

3. Miranj
   

   View Slide

4. View Slide

5. By the end of this talk you 

   should be aware of what is

   Information Architecture

   without facing jargon-bullets.
   

   View Slide

6. “Architecture”
   

   View Slide

7. Photo credit: variationblogr on Visual Hunt / CC BY
   

   View Slide

8. а print from sortavala architecture book by Sasha ЯR on Flickr
   https://www.flickr.com/photos/rotten_reverie/8103565216
   

   View Slide

9. а print from sortavala architecture book by Sasha ЯR on Flickr
   https://www.flickr.com/photos/rotten_reverie/8103565216
   Blueprint
   

   View Slide

10. “Architecture”
    may refer to two different things
    

    View Slide

11. Conceptual Structure
    a.k.a. blueprint or technical drawing
    

    View Slide

12. A Practice
    i.e. application of skill or knowledge
    

    View Slide

13. Information Architecture
    refers to both, but in this talk

    we’re mainly talking about the practice
    

    View Slide

14. 9 4 49 25 16 __
    

    View Slide

15. 4 9 16 25 __ 49
    

    View Slide

16. 4 9 16 25 __ 49
    36
    

    View Slide

17. 4 8 16 32 __ 128
    

    View Slide

18. 4 8 16 32 __ 128
    64
    

    View Slide

19. 4 8 15 16 __ 42
    

    View Slide

20. View Slide

21. 9 4 49 16 25 __
    36
    

    View Slide

22. wtf-am-i-supposed-to-do-wit by kris krüg on Flickr
    https://www.flickr.com/photos/kk/18768224
    Mess
    

    View Slide

23. wtf-am-i-supposed-to-do-wit by kris krüg on Flickr
    https://www.flickr.com/photos/kk/18768224
    Mess
    disorganised or disarranged

    and therefore not understandable
    

    View Slide

24. mess by amanda on Flickr
    https://www.flickr.com/photos/pinprick/5879923126
    

    View Slide

25. Unkept Room by Tom Blackwell on Flickr
    https://www.flickr.com/photos/tjblackwell/6007033415
    

    View Slide

26. Photo credit: José Morcillo Valenciano on Visual Hunt / CC BY
    

    View Slide

27. –Abby Covert
    Information Architect and author of How to Make Sense of Any Mess
    “I define the word ‘mess’ the same way that most
    dictionaries do: A situation where the interactions
    between people and information are confusing or
    full of difficulties.”
    

    View Slide

28. Mess
    

    View Slide

29. View Slide

30. Mess
    is somewhat manageable in small amounts
    

    View Slide

31. View Slide

32. Mess
    is a problem at scale
    

    View Slide

33. Order by Volgar on Flickr
    https://www.flickr.com/photos/volgar/27461981479
    

    View Slide

34. Tukwila/International Blvd Station Parking lot by Atomic Taco on Flickr
    https://www.flickr.com/photos/atomictaco/4333647127
    

    View Slide

35. Tukwila/International Blvd Station Parking lot by Atomic Taco on Flickr
    https://www.flickr.com/photos/atomictaco/4333647127
    Mess
    may be visually neat and tidy
    

    View Slide

36. India by Herry Lawford on Flickr
    https://www.flickr.com/photos/herry/6779074382
    

    View Slide

37. My destroyed desk by josephbergen on Flickr
    https://www.flickr.com/photos/jbergen/2128605950
    

    View Slide

38. My destroyed desk by josephbergen on Flickr
    https://www.flickr.com/photos/jbergen/2128605950
    Mess
    is not about visual neatness or aesthetics
    

    View Slide

39. Mess
    

    View Slide

40. Mess
    

    View Slide

41. Information Architecture
    

    View Slide

42. –The Information Architecture Institute
    “Information architecture is the practice of deciding
    how to arrange the parts of something to be
    understandable.”
    

    View Slide

43. Where do you encounter IA?
    well, everywhere
    

    View Slide

44. French dictionary page2 by Liz Eckmann on Flickr
    https://www.flickr.com/photos/24498687@N03/2337550017
    

    View Slide

45. Old Map (33) by rosario fiore on Flickr
    https://www.flickr.com/photos/38703275@N06/6884558828
    

    View Slide

46. Docos by John Keogh on Flickr
    https://www.flickr.com/photos/jvk/6721198
    

    View Slide

47. Facebook Messenger app by PROKārlis Dambrāns on Flickr
    https://www.flickr.com/photos/janitors/14039237076
    

    View Slide

48. arsp_064 by Anthony Ryan on Flickr
    https://www.flickr.com/photos/useanthonyryansphotos/7946386402
    

    View Slide

49. Exhibition Hall by Robert Ziegler on Flickr
    https://www.flickr.com/photos/63998580@N06/5980150860
    

    View Slide

50. buffet by bigbigbigbigtoe on Flickr
    https://www.flickr.com/photos/10402746@N04/7165271584
    

    View Slide

51. House Numbering
    An example
    

    View Slide

52. What are the different ways of
    organising houses numbers?
    

    View Slide

53. European Scheme / Odd and Even
    

    View Slide

54. Clockwise Scheme
    

    View Slide

55. Distance Scheme
    

    View Slide

56. –No one, ever
    “Hey, nice IA!”
    

    View Slide

57. IA
    is typically accepted as is
    

    View Slide

58. Organising Things
    so that they make sense
    

    View Slide

59. –Most people while experiencing mess
    “Where am I?”
    “Where am I supposed to go next?”
    “Where do I find something”
    “This doesn’t make any sense!”
    

    View Slide

60. Broadly speaking…
    

    View Slide

61. Labelling
    Structuring

    Grouping

    Arranging
    

    View Slide

62. Block Diagram
    Flow Diagram
    Gantt Chart
    Quadrant Diagram
    Venn Diagram
    Swim Lane Diagram
    Hierarchy Diagram
    Mind Map
    Schematic
    Journey Map
    

    View Slide

63. “Architecture”
    

    View Slide

64. information by Tobi Gaulke on Flickr
    https://www.flickr.com/photos/gato-gato-gato/12851862915
    

    View Slide

65. information by Tobi Gaulke on Flickr
    https://www.flickr.com/photos/gato-gato-gato/12851862915
    Information Architect
    

    View Slide

66. information by Tobi Gaulke on Flickr
    https://www.flickr.com/photos/gato-gato-gato/12851862915
    –Abby Covert
    in How to Make Sense of Mess
    “Every mess and every thing shares one important
    non-thing : information.”
    

    View Slide

67. information by Tobi Gaulke on Flickr
    https://www.flickr.com/photos/gato-gato-gato/12851862915
    –Richard Saul Wurman
    Regarded as the Father of Information Architecture
    “An information architect is the individual who
    organises the patterns inherent in data, making the
    complex clear.”
    

    View Slide

68. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    

    View Slide

69. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    “Black Box”
    things we don’t see or understand
    

    View Slide

70. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    thoughtfully and deliberately
    

    View Slide

71. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    from internal biases
    

    View Slide

72. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    from existing paradigms
    

    View Slide

73. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    from known structures
    

    View Slide

74. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    from visual neatness or aesthetics
    

    View Slide

75. 365 0917 by Tim Caynes on Flickr
    https://www.flickr.com/photos/timcaynes/5408753242
    Break Away
    and question until we reach clarity in 

    understanding the properties inherent in things
    

    View Slide

76. Scrabble Tiles and Scrapbooking Letters 3 by Barbara Mazz on Flickr
    https://www.flickr.com/photos/electricporcupine/4623214027
    

    View Slide

77. Scrabble Tiles and Scrapbooking Letters 3 by Barbara Mazz on Flickr
    https://www.flickr.com/photos/electricporcupine/4623214027
    See through the mess,

    and help others.
    

    View Slide

78. Let’s try it…
    

    View Slide

79. But first, some theory…
    

    View Slide

80. What are the different ways
    of organising things?
    

    View Slide

81. Random
    is not really a useful way
    

    View Slide

82. –Richard Saul Wurman
    “Information may be infinite, however… The
    organisation of information is finite as it can only be
    organised by LATCH: Location, Alphabet, Time,
    Category, or Hierarchy.”
    

    View Slide

83. Location
    spatially
    

    View Slide

84. Delhi Metro Rail Corporation
    

    View Slide

85. https://commons.wikimedia.org/wiki/File:Dorsal_Ventral_Body_Cavities.jpg
    

    View Slide

86. Alphabet
    alphabetically
    

    View Slide

87. Little phone by John Sheldon on Flickr
    https://www.flickr.com/photos/18909153@N08/6965138569
    

    View Slide

88. Lord to Mumps by Kevin Grocki on Flickr
    https://www.flickr.com/photos/kgrocki/4353715409
    

    View Slide

89. Time
    chronologically
    

    View Slide

90. Music by Jesse Kruger on Flickr
    https://www.flickr.com/photos/jessekruger/390534244
    

    View Slide

91. Photo credit: aafes49 on VisualHunt.com / CC BY-ND
    

    View Slide

92. Category
    similarity
    

    View Slide

93. View Slide

94. View Slide

95. Hierarchy
    continuum or rank
    

    View Slide

96. Photo credit: Gilbert R. on visualhunt.com / CC BY-NC-ND
    

    View Slide

97. Mailboxes by Lodewijk van den Broek on Flickr
    https://www.flickr.com/photos/12760128@N04/3765909892
    

    View Slide

98. Location
    Alphabet

    Time

    Category
    Hierarchy
    

    View Slide

99. Now let’s try it
    

    View Slide

100. The recipe by Bill Holsinger-Robinson on Flickr
     https://www.flickr.com/photos/billhr/3190017092
     

     View Slide

101. The recipe by Bill Holsinger-Robinson on Flickr
     https://www.flickr.com/photos/billhr/3190017092
     Cookbook
     

     View Slide

102. The recipe by Bill Holsinger-Robinson on Flickr
     https://www.flickr.com/photos/billhr/3190017092
     If you have a large collection of
     food recipes, what are the ways
     in which you could arrange them?
     

     View Slide

103. Location
     Alphabet

     Time

     Category
     Hierarchy
     

     View Slide

104. View Slide

105. Information

     is subjective
     

     View Slide

106. View Slide

107. My destroyed desk by josephbergen on Flickr
     https://www.flickr.com/photos/jbergen/2128605950
     

     View Slide

108. Information
     

     View Slide

109. User Context
     

     View Slide

110. Information
     User Context
     

     View Slide

111. Information
     User Context
     IA
     

     View Slide

112. –The Information Architecture Institute
     “Information architecture is the practice of deciding
     how to arrange the parts of something to be
     understandable.”
     

     View Slide

113. –Me
     “Information Architecture is the thoughtful,
     deliberate practice of achieving a shared mental
     model, and further applying it to make 

     something understandable”
     

     View Slide

114. You’re now an
     Information Architect…
     

     View Slide

115. …and can possibly save the
     world from mess.
     

     View Slide

116. !
     Thanks
     Chris How — All You Need To Know About IA In 10 Minutes

     Abby Covert — How to Make Sense of Any Mess
     

     View Slide