Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

MTMG Executive: Inclusive Design Workshop - Milano May 18 2018

118 views

Published on

Meet The Media Guru Executive Workshop: Inclusive Design & Accessibility. May 18 2018, Milan. BASE Milano.

Published in: Design
  • Be the first to comment

MTMG Executive: Inclusive Design Workshop - Milano May 18 2018

  1. 1. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles
  2. 2. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive Design MTMG Workshop May 18/18 Milano • 2017-07-05 Corey Timpson Corey Timpson Design Inc. coreytimpson.com @coreytimpson
  3. 3. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Agenda . introductions . overview of 5 vectors . review of participant examples . break . lecture . workshop solutions to examples . present ideas for inclusion to examples . conclusions
  4. 4. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Ecosystem 1. Graphic Design 2. Environmental Design 3. Interface Design 4. Software Design and Development 5. Media Design & Production
  5. 5. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Design Practice
  6. 6. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Overview Premise/Direction Design Development & Production Testing, Prototyping, Testing Fundamentals
  7. 7. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Premise Rather than design and develop something and then figure out how to make it accessible, we design with all audiences, and all abilities, in mind from the outset. “Inclusion” would also address cultural, linguistic, and other dynamics of difference.
  8. 8. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Premise Exclusion is the result of mismatched interactions. Our responsibility is to know how our designs affect these interactions and create mismatches. Points of exclusion help us generate new ideas and inclusive designs.
  9. 9. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive Design Methodology of inclusion has several outputs. One of these outputs is accessibility.
  10. 10. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Scan Canadian Museum for Human Rights Guidelines Smithsonian Accessibility Guidelines Museum of Science London, Building Accessible Exhibitions Musée de la civilisation Québec National/State/Provincial Building Codes WCAG 2.0 + more
  11. 11. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Ecosystem
  12. 12. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Ecosystem The user exists within both physical and digital spaces. Consideration of the building without the installations cannot be done. Consideration of the digital installation cannot be done in isolation. Many variables combine to define the user experience.
  13. 13. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Ecosystem 1. Graphic Design 2. Environmental Design 3. Interface Design 4. Software Design and Development 5. Media Design & Production
  14. 14. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design
  15. 15. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Anatomy of Type
  16. 16. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Type Testing
  17. 17. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Text Layout
  18. 18. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Text Layout I cnduo't bvleiee taht I culod aulaclty uesdtannrd waht I was rdnaieg. Unisg the icndeblire pweor of the hmuan mnid, aocdcrnig to rseecrah at Cmabrigde Uinervtisy, it dseno't mttaer in waht oderr the lterets in a wrod are, the olny irpoamtnt tihng is taht the frsit and lsat ltteer be in the rhgit pclae. The rset can be a taotl mses and you can sitll raed it whoutit a pboerlm. Tihs is bucseae the huamn mnid deos not raed ervey ltteer by istlef, but the wrod as a wlohe. Aaznmig, huh? Yaeh and I awlyas tghhuot slelinpg was ipmorantt!
  19. 19. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Text Layout
  20. 20. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Text Layout
  21. 21. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Visual Hierarchies
  22. 22. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Colour Contrast
  23. 23. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Overprinting
  24. 24. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Graphic Design Text 1. Reading Levels 2. Nomenclature 3. Character Counts 4. Style Guide Development - consistency across media - learnability > usability
  25. 25. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design
  26. 26. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Primary Accessible Zone
  27. 27. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Distance vs Size (Type)
  28. 28. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Spacing & Pacing 1. Negative space 2. Personal space 3. Respite 4. Sweet spot - somewhat variable based on installation 5. 1.2m for pathways
  29. 29. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Seating (Strength, Rest, Support, Reach, Integration)
  30. 30. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Sound Management 1. Consider the entire program during development 2. Hardware spec. (directional, adjustable) 3. Testing and Prototyping 4. Volume Control 5. Induction Technology 6. In-situ tuning 7. 70 dBs
  31. 31. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Sound Design Considerations ● An earcon is a brief, distinctive sound used to represent a specific event or convey information (Abstract). ● Auditory Icons are the auditory equivalent of visual icons (Representational).
  32. 32. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Lighting 1. 50-100 LUX for low vision 2. Artefacts/conservation requirements 3. Small form LED lights can be added to edges in order to distinguish shapes of furniture within low light environments. (ie. edges of Kiosks, Tables) 4. Glare (angle of lightning vs angle of viewing vs material and surface)
  33. 33. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Lighting
  34. 34. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Digital Prerequisites (Reach)
  35. 35. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Environmental Design Digital Prerequisites 1. Reach/Touchable Zones 2. Horizontal and Vertical 3. 685mm (27”) height to tables 4. Angled vs Flat 5. Hardware Specs. (reflection, responsiveness)
  36. 36. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design
  37. 37. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design Start with conceptual model A mental model represents a person’s thought process for how something works and understanding of the world. Mental models are based on lived experiences and intuitive perceptions.
  38. 38. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design Start with conceptual model The degree to with a user’s mental model matches a UI’s conceptual model, will determine how intuitive a UI will be for the user. (Xerox)
  39. 39. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design Data-to-ink ratio Keep data-ink to ink ratio high
  40. 40. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design UI for Blind and Low Vision Users Must rely on memory and on a rich vocabulary of gestures to interact with touchscreen interfaces. Designers should strive to minimize the cognitive load for screen reader users.
  41. 41. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design Navigation, Function Definitions
  42. 42. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Interface Design Navigation, Function Definitions 1. Functional standardization 2. Design standards (nomenclature, iconography) 3. Gesture and behavioural standards Learnability, Usability, Accessibility
  43. 43. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Software Design & Development
  44. 44. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Software Design & Development Semantics, Structure, Standards 1. Software/Programming Languages 2. Why should the visitor care? 3. W3C/WCAG goes only so far 4. Consistency 5. Behaviour and expectations are key considerations 6. Learnability 7. Scalability
  45. 45. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Software Design & Development Semantics, Structure, Standards
  46. 46. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Software Design & Development RFP / RPQ “Software design must meet internationally recognized W3C Web Content Accessibility Guidelines (WCAG) v2.0 Level AA [and revised section 508 standards of the ADA]. Vendor must include an identification of tools, best practices, processes, and strategy for implementation.”
  47. 47. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Media Design & Production
  48. 48. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Media Design & Production Linear Media (Theatre)
  49. 49. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Media Design & Production Linear Media (Kiosk)
  50. 50. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Media Design & Production Components 1. Primary Asset (ie. Film) 2. Child Assets - ASL - Description Track - Transcription - Text-to-Speech 3. Ducking
  51. 51. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Media Design & Production Components Note: . Production Sequencing and Project Schedule . Captions are not Subtitles
  52. 52. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive, Accessible
  53. 53. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive Design Media Design (Theatre)
  54. 54. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive Design Media Design (Kiosk)
  55. 55. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive, Accessible The Sum of All Parts (Digital Kiosk)
  56. 56. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive, Accessible The Sum of All Parts (Digital Kiosk)
  57. 57. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive, Accessible The Sum of All Parts (Digital Surface)
  58. 58. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive, Accessible The Sum of All Parts (Tangible Interface/Mixed media)
  59. 59. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Inclusive Design
  60. 60. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles
  61. 61. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles
  62. 62. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping
  63. 63. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Linear Media Installation (360° Film)
  64. 64. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Linear Media Installation (360° Film)
  65. 65. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Mixed-Media Installation
  66. 66. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Mixed-Media Installation
  67. 67. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Mixed-Media Installation
  68. 68. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Prototyping & Testing are critical. Especially in mixed, busy, multi-user environments. Developing tools in order to solicit usable and pointed feedback.
  69. 69. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Soliciting Good Feedback (ie. constructive criticism)
  70. 70. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping Soliciting Good Feedback (ie. constructive criticism)
  71. 71. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping User / Experts A user/expert is a person who has developed expertise by means of their lived experience in dealing with the challenges of the environment due to a physical, sensory, and/or cognitive functional limitation.
  72. 72. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping User / Experts
  73. 73. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Testing & Prototyping User / Experts
  74. 74. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Innovation
  75. 75. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) System of 5 components 1. Cane detectable floor strip 2. Tactile marker 3. Mobile App 4. iBeacon 5. Content Management System
  76. 76. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) Cane-detectable tactile floor strip
  77. 77. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) Tactile marker
  78. 78. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) iBeacon
  79. 79. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) Mobile app
  80. 80. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) UAP in mixed-media installation
  81. 81. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Access Point (UAP) UAP Scalability
  82. 82. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) Navigation of digital interfaces Navigation of tangible interfaces Standardized approach through all instances of digital interaction. + zoom, volume control, wrist support
  83. 83. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) Concept Design
  84. 84. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) Sematic software standardization
  85. 85. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) Prototype
  86. 86. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) In-situ UKP-I
  87. 87. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) In-situ UKP-I
  88. 88. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Universal Keypad (UKP) In-situ UKP-A
  89. 89. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Mobile Application Driver for development was Inclusive Design Available for iOS and Android Available in English and French
  90. 90. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Mobile Application Driver for development was Inclusive Design Available for iOS, Android Available in English, French Available in ASL, LSQ Available in AD English, AD French
  91. 91. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Mobile Application ASL, LSQ, AD Eng, AD Fra Self Guided Tours
  92. 92. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles
  93. 93. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery
  94. 94. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  95. 95. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  96. 96. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  97. 97. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  98. 98. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  99. 99. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Beyond the Gallery Visitor Experience
  100. 100. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals
  101. 101. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Ecosystem, each component needs consideration but within the context of the system as a whole. Testing. Prototyping (wash, rinse, repeat) Standards, evolution, scalability. Redundancy. Redundancy.
  102. 102. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Establishing Standards to Work From
  103. 103. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Establishing Standards to Work From
  104. 104. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Establishing Standards to Work From
  105. 105. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Establishing Standards to Work From
  106. 106. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles
  107. 107. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Virtual Reality . captioning . signed interpretation . descriptive audio Fundamentals Establishing Standards to Work From
  108. 108. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Redundancy
  109. 109. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Redundancy
  110. 110. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Fundamentals Redundancy
  111. 111. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications
  112. 112. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications Budget constraints = myth Aesthetic or design intent are compromised = false
  113. 113. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications There are only 2 requirements: . good project management (planning/scheduling) . the will
  114. 114. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications . Project Management - scheduling - sequencing of tasks . Budget - negligible impact - greatest costs remain content development - existing = start small - new = start inclusively
  115. 115. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications There are no barriers unless we create them.
  116. 116. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications There are no barriers unless we create them. But there is opportunity: larger audience demographic longer audience loyalty increased usability for everyone
  117. 117. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications There are no barriers unless we create them. But there is opportunity: greater visitation greater reach larger appropriation & earned revenue (Canada = $25B annually)
  118. 118. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Strategic Implications Even further: . greater audience engagement . greater return on investment . mandate fulfillment (Italy 5% population is declared. Tourism implications?) (2016 Legislation)
  119. 119. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Critical Findings The work is never done. Fostering a culture of iterative and consistent evolution is key. Accepting and embracing criticism and using it as fuel. Be deliberate.
  120. 120. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Conclusions The methodology is the most important. Everything else is an output. Inclusive thinking has becoming a key characteristic of the corporate culture. And this is the measure of success.
  121. 121. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Corey Timpson Corey Timpson Design Inc. coreytimpson.com @coreytimpson
  122. 122. Click to edit Master title style Click to edit Master subtitle style Edit Master text styles Greensboro Counter

×