Responsive Information Architectures

Andy Fitzgerald
Andy FitzgeraldUser Experience Architecture & Design Consultant at Andy Fitzgerald Consulting, LLC
28 March 2014
Responsive Information
Architectures
IA Summit
San Diego, CA
Presented by Andy Fitzgerald, PhD
#ResponsiveIA @andybywire
http://bradfrostweb.com/blog/post/device-fatigue/
#ResponsiveIA @andybywire
http://jenson.org/of-bears-bats-and-bees-making-sense-of-the-
internet-of-things/
#ResponsiveIA @andybywire
http://jenson.org/of-bears-bats-and-bees-making-sense-of-the-
internet-of-things/
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
- Sara Wachter-Boettcher.
Content Everywhere
“The best we can all do is focus our limited
stock of human care and attention toward
designing systems [...] not obsessing over
individual pages for individual platforms.”
#ResponsiveIA @andybywire
Responsive
Information Architecture
An information design strategy that allows for
the expression of specific meaning across
multiple and independent contexts.
#ResponsiveIA @andybywire
Rich understanding of the information ecology
Content-driven guidelines for interaction
design choices
Articulated information structures based on
multiple modes of meaning making
Embrace ambiguity as a strategy for negotiating
the connected environment
Responsive
Information Architecture
#ResponsiveIA @andybywire
Responsive web design
Meaning-making
Information architecture
Responsive information architectures
Responsive web design
#ResponsiveIA @andybywire
- Ethan Marcotte. Responsive Web Design
“We can embrace the flexibility inherent to the
web, without surrendering the control we
require as designers.”
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Responsive Grid
a model that allows us to write the rules
necessary to effectively articulate an
instance in the system
Making meaning
#ResponsiveIA @andybywire
- Richard Saul Wurman. Hats
“You can only understand something relative to
something you already understand.”
#ResponsiveIA @andybywire
Modes of Signification
Symbolic
the signifier does not resemble the signified; it is
arbitrary and conventional
Text
= Tree
(signifier)(signified)
#ResponsiveIA @andybywire
Modes of Signification
Symbolic
the signifier does not represent the signified; it is
arbitrary and conventional
Indexical
the signifier is directly connected to the signified
#ResponsiveIA @andybywire
Smoke signifies fire
Fever signifies infection
A knock signifies a visitor
Handwriting signifies the writer
Responsive Information Architectures
#ResponsiveIA @andybywire
Modes of Signification
Symbolic
the signifier does not represent the signified; it is
arbitrary and conventional
Indexical
the signifier is directly connected to the signified
Iconic
the signifier is perceived as resembling or imitating
the signified
#ResponsiveIA @andybywire
- Daniel Chandler. Semiotics
“Iconic signifiers seem to present reality more
directly than symbolic signs.”
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Responsive Information Architectures
Responsive Information Architectures
#ResponsiveIA @andybywire
- Louise Barrett. Beyond the Brain
“This innate bias may not be for faces as such,
but for the particular kind of geometric
configuration that faces present.”
#ResponsiveIA @andybywire
Information architecture
choreography
ontology
taxonomy
arrangement of the parts
particular meaning
rules for interaction among the parts
THE NATURE OF
INFORMATION ARCHITECTURE
#ResponsiveIA @andybywire
Ontology
• “Particular meaning”
• “What we mean when we say what we say”
• The argument: how we encourage users to think
about the content or functionality we are
offering
#ResponsiveIA @andybywire
Taxonomy
• “Arrangement of the parts”
• “Arrangement of meaning in and across contexts”
• How the pieces of the argument fit together – a
method of arrangement conceived to create a
particular kind of understanding.
#ResponsiveIA @andybywire
• “Rules for interaction among the parts”
• “The appropriate unfolding”
• Must respond to context in order to be effective
Choreography
#ResponsiveIA @andybywire
ONTOLOGY
TAXONOMY
CHOREOGRAPHY
#ResponsiveIA @andybywire
} ONTOLOGY
TAXONOMY
CHOREOGRAPHY
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
#ResponsiveIA @andybywire
} ONTOLOGY
TAXONOMY
CHOREOGRAPHY
QUALIA
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
} ONTOLOGY
TAXONOMY
CHOREOGRAPHY
QUALIA
Mind Blowing by Luis Prado from The Noun Project
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
}
Mind Blowing by Luis Prado from The Noun Project
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
ONTOLOGY
TAXONOMY
CHOREOGRAPHY
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
- @brad_frost
https://twitter.com/brad_frost/status/443371579645624321
“This makes me want to murder things.”
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
}
Mind Blowing by Luis Prado from The Noun Project
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
ONTOLOGY
TAXONOMY
CHOREOGRAPHY
#ResponsiveIA @andybywire
}
Mind Blowing by Luis Prado from The Noun Project
ng it up is an associative
e get these actions right,
level of meaning making
one of the slowest of the
: the fundamental way in
ur natural world.This has
ages to usability. Intuitive
ly useable because they
perational knowledge we
n interface is completely
intuitive it must “borrow”
her sphere of experience
man in The Psychology of
s to as “knowledge in the
een interface popularized
dy example of this. More
Protect’s ”wave to hush”
n example that builds on
eractions (waving smoke
tector to try to shut it up)
nstantly comprehensible
nal and often overlooked
pping into deep layers of
that by leveraging more
, we’re able to design for
r loosely and in a natural
I mean associations that
erwritten by an arbitrary,
ciation in order to signify;
oted in our experience of
nate perceptual abilities.
ore stable and, ironically,
mapping one’s use of the
ple as swapping out one
mental model (the wheel
another (the touchscreen
loose coupling allows for
to rigid (and often brittle)
ganizational approaches.
University of Lethbridge
Louise Barrett uses this
embly” to explain how in
obots “a whole variety of
effectively exploit specific
ry) conditions, along with
cs of an animal’s body, to
ive behavior ‘on the fly.’”
w soft assembly accounts
in simple organisms (her
and pre-microprocessor
those examples to show
ces of human and animal
e be explained by taking
fundamental constitutive
n. For those of us tasked
hitectures and interaction
worked physical spaces,
e most fundamental level
ociation is understood (in
mode it is most basically
and then articulating that
that exploits the intrinsic
nment, allows us to build
ation structures that don’t
her by force, convention,
which fit together by the
e of their core structures.
ONTOLOGY
TAXONOMY
CHOREOGRAPHY
Responsive information
architectures
#ResponsiveIA @andybywire
An information design strategy that facilitates
the expression of specific meaning across
multiple and independent contexts.
Responsive
Information Architecture
#ResponsiveIA @andybywire
Taxonomic Grid
• Determine the narrative
• Audit content and existing organization
• Identify and build single-dimension structures
• Articulate compound taxonomies to meet goals,
accommodate constraints, and leverage
opportunities.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Taxonomic Grid
• Determine the narrative
• Audit content and existing organization
• Identify and build single-dimension structures
• Articulate compound taxonomies to meet goals,
accommodate constraints, and leverage
opportunities.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Taxonomic Grid
• Determine the narrative
• Audit content and existing organization
• Identify and build single-dimension structures
• Articulate compound taxonomies to meet goals,
accommodate constraints, and leverage
opportunities.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Taxonomic Grid
• Determine the narrative
• Audit content and existing organization
• Identify and build single-dimension structures
• Articulate compound taxonomies to meet goals,
accommodate constraints, and leverage
opportunities.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
Taxonomic Grid
• Determine the narrative
• Audit content and existing organization
• Identify and build single-dimension structures
• Articulate compound taxonomies to meet goals,
accommodate constraints, and leverage
opportunities.
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
#ResponsiveIA @andybywire
http://pervasiveia.com/blog/embracing-ambiguity
- Luca Rosati. Embracing ambiguity:
Ambiguity as an emerging design pattern
“Embracing ambiguity — embracing the
possibility of not understanding exactly how the
pieces fit together — means designing systems
that surpass our expectations of them.”
#ResponsiveIA @andybywire
Rich understanding of the information ecology
Content-driven guidelines for interaction
design choices
Articulated information structures based on
multiple modes of meaning making
Embrace ambiguity as a strategy for negotiating
the connected environment
Responsive
Information Architecture
#ResponsiveIA @andybywire
Responsive Information Architectures
Thank you.
Responsive Information Architectures
www.linkedin.com/in/andyfitzgerald
@andybywire
#ResponsiveIA
1 of 84

More Related Content

Viewers also liked(20)

Urban Design Urban Design
Urban Design
Alshimaa Aboelmakarem Farag3.2K views
Designing for the Human ScaleDesigning for the Human Scale
Designing for the Human Scale
Andy Fitzgerald2.6K views
Site responsive designSite responsive design
Site responsive design
Paul Bulkeley4.2K views
Responsive ClassroomResponsive Classroom
Responsive Classroom
ruthdemshick13.4K views
Final Report, Hi7Final Report, Hi7
Final Report, Hi7
Mike White845 views
Elements of urban designElements of urban design
Elements of urban design
Sadhika Farzana3.8K views
Design of spaces by william whyte  Design of spaces by william whyte
Design of spaces by william whyte
SomaiaElsherif10.3K views
image of a cityimage of a city
image of a city
Anchal Garg12.9K views
Image of the CityImage of the City
Image of the City
Alshimaa Aboelmakarem Farag9K views
Types of urban designTypes of urban design
Types of urban design
Goby Cracked20.5K views
Image of cityImage of city
Image of city
Ravi Varma reddy19.2K views
Image of the cityImage of the city
Image of the city
CoEP 94K views
Climate Responsive ArchitectureClimate Responsive Architecture
Climate Responsive Architecture
Deepthi Deepu109K views
Elements of urban designElements of urban design
Elements of urban design
Neo Angala88.3K views
Urban Design project 1Urban Design project 1
Urban Design project 1
Salman Altuwariki41.9K views
Elements of Urban DesignElements of Urban Design
Elements of Urban Design
Russel Lowell Ala62.6K views

Similar to Responsive Information Architectures(20)

ISEA Paper 2011ISEA Paper 2011
ISEA Paper 2011
Julian Stadon405 views
PresentationPresentation
Presentation
mauricio aldana926 views
*Handout10 weave oxford*Handout10 weave oxford
*Handout10 weave oxford
Katie King150 views
Sss experience learningSss experience learning
Sss experience learning
Merja Bauters509 views
Social Construct EssaySocial Construct Essay
Social Construct Essay
Victoria Dillard5 views
Object Relation TheoryObject Relation Theory
Object Relation Theory
Purchase College Papers UK5 views
ISMAR 2011 PaperISMAR 2011 Paper
ISMAR 2011 Paper
Julian Stadon587 views
*Handout10 tranimal cardiff*Handout10 tranimal cardiff
*Handout10 tranimal cardiff
Katie King220 views
Systems thinking   diagramsSystems thinking   diagrams
Systems thinking diagrams
Jai Chenna90 views
Agent-Based Modeling for SociologistsAgent-Based Modeling for Sociologists
Agent-Based Modeling for Sociologists
Simone Gabbriellini924 views
SHARED VOCABULARIES FOR COLLECTIVE INTELLIGENCESHARED VOCABULARIES FOR COLLECTIVE INTELLIGENCE
SHARED VOCABULARIES FOR COLLECTIVE INTELLIGENCE
Networked Research Lab, UK2.9K views
The Theory of Intended Evolution-ExcerptsThe Theory of Intended Evolution-Excerpts
The Theory of Intended Evolution-Excerpts
David Kincade MSOM, LAc106 views
Essay On Complexity TheoryEssay On Complexity Theory
Essay On Complexity Theory
Karen Washington8 views

More from Andy Fitzgerald(9)

Prototyping Information ArchitecturePrototyping Information Architecture
Prototyping Information Architecture
Andy Fitzgerald1.8K views
Taxonomy for App MakersTaxonomy for App Makers
Taxonomy for App Makers
Andy Fitzgerald6.1K views
Information Architecture & Content StrategyInformation Architecture & Content Strategy
Information Architecture & Content Strategy
Andy Fitzgerald33.2K views
Designing for Tablets & Smart TVs Designing for Tablets & Smart TVs
Designing for Tablets & Smart TVs
Andy Fitzgerald6.4K views
Android UX & DesignAndroid UX & Design
Android UX & Design
Andy Fitzgerald2.6K views
Mobile Information ArchitectureMobile Information Architecture
Mobile Information Architecture
Andy Fitzgerald4.3K views

Recently uploaded(20)

SS25 Fashion Key Items trend bookSS25 Fashion Key Items trend book
SS25 Fashion Key Items trend book
Peclers Paris60 views
Anti-Cancer Drugs-Medicinal ChemistryAnti-Cancer Drugs-Medicinal Chemistry
Anti-Cancer Drugs-Medicinal Chemistry
NarminHamaaminHussen6 views
217 Drive - All on upper.pptx217 Drive - All on upper.pptx
217 Drive - All on upper.pptx
vidstor2829 views
Design System.pdfDesign System.pdf
Design System.pdf
Atiqur Rahaman9 views
Figma Prototype A to Z.pdfFigma Prototype A to Z.pdf
Figma Prototype A to Z.pdf
Atiqur Rahaman14 views
polarispolaris
polaris
scribddarkened352188 views
Anti -Parkinsonian Drugs-Medicinal ChemistryAnti -Parkinsonian Drugs-Medicinal Chemistry
Anti -Parkinsonian Drugs-Medicinal Chemistry
NarminHamaaminHussen7 views
Nomor Meja RUANG-4.docNomor Meja RUANG-4.doc
Nomor Meja RUANG-4.doc
ssuserc40b916 views
FMP E1 pitch packFMP E1 pitch pack
FMP E1 pitch pack
MonnaS241 views
Scopic UX Design Test Task.pdfScopic UX Design Test Task.pdf
Scopic UX Design Test Task.pdf
Atiqur Rahaman237 views
Anthelmintic Drugs-Medicinal ChemistryAnthelmintic Drugs-Medicinal Chemistry
Anthelmintic Drugs-Medicinal Chemistry
NarminHamaaminHussen5 views
3 Dark Design Templates3 Dark Design Templates
3 Dark Design Templates
Pixeldarts12 views
KachaliKachali
Kachali
charulchoudhary240410 views
The Last GrainsThe Last Grains
The Last Grains
pulkkinenaliisa33 views
Benzodiazepines--Medicinal ChemistryBenzodiazepines--Medicinal Chemistry
Benzodiazepines--Medicinal Chemistry
NarminHamaaminHussen6 views
Viking passive.pdfViking passive.pdf
Viking passive.pdf
Matis Velt15 views
Be Kind Of A Bitch Sweatshirt Be Kind Of A Bitch Sweatshirt
Be Kind Of A Bitch Sweatshirt
TeeFusion23 views
Doing Footwear - Footwear FactoryDoing Footwear - Footwear Factory
Doing Footwear - Footwear Factory
Doing Footwear6 views
Presentation (1).pdfPresentation (1).pdf
Presentation (1).pdf
hjksa15 views
My Creative Resume DIAPOS.pptxMy Creative Resume DIAPOS.pptx
My Creative Resume DIAPOS.pptx
BrayanQuispe237 views

Responsive Information Architectures

  • 1. 28 March 2014 Responsive Information Architectures IA Summit San Diego, CA Presented by Andy Fitzgerald, PhD
  • 7. #ResponsiveIA @andybywire - Sara Wachter-Boettcher. Content Everywhere “The best we can all do is focus our limited stock of human care and attention toward designing systems [...] not obsessing over individual pages for individual platforms.”
  • 8. #ResponsiveIA @andybywire Responsive Information Architecture An information design strategy that allows for the expression of specific meaning across multiple and independent contexts.
  • 9. #ResponsiveIA @andybywire Rich understanding of the information ecology Content-driven guidelines for interaction design choices Articulated information structures based on multiple modes of meaning making Embrace ambiguity as a strategy for negotiating the connected environment Responsive Information Architecture
  • 10. #ResponsiveIA @andybywire Responsive web design Meaning-making Information architecture Responsive information architectures
  • 12. #ResponsiveIA @andybywire - Ethan Marcotte. Responsive Web Design “We can embrace the flexibility inherent to the web, without surrendering the control we require as designers.”
  • 21. #ResponsiveIA @andybywire Responsive Grid a model that allows us to write the rules necessary to effectively articulate an instance in the system
  • 23. #ResponsiveIA @andybywire - Richard Saul Wurman. Hats “You can only understand something relative to something you already understand.”
  • 24. #ResponsiveIA @andybywire Modes of Signification Symbolic the signifier does not resemble the signified; it is arbitrary and conventional
  • 25. Text
  • 27. #ResponsiveIA @andybywire Modes of Signification Symbolic the signifier does not represent the signified; it is arbitrary and conventional Indexical the signifier is directly connected to the signified
  • 28. #ResponsiveIA @andybywire Smoke signifies fire Fever signifies infection A knock signifies a visitor Handwriting signifies the writer
  • 30. #ResponsiveIA @andybywire Modes of Signification Symbolic the signifier does not represent the signified; it is arbitrary and conventional Indexical the signifier is directly connected to the signified Iconic the signifier is perceived as resembling or imitating the signified
  • 31. #ResponsiveIA @andybywire - Daniel Chandler. Semiotics “Iconic signifiers seem to present reality more directly than symbolic signs.”
  • 36. #ResponsiveIA @andybywire - Louise Barrett. Beyond the Brain “This innate bias may not be for faces as such, but for the particular kind of geometric configuration that faces present.”
  • 39. choreography ontology taxonomy arrangement of the parts particular meaning rules for interaction among the parts THE NATURE OF INFORMATION ARCHITECTURE
  • 40. #ResponsiveIA @andybywire Ontology • “Particular meaning” • “What we mean when we say what we say” • The argument: how we encourage users to think about the content or functionality we are offering
  • 41. #ResponsiveIA @andybywire Taxonomy • “Arrangement of the parts” • “Arrangement of meaning in and across contexts” • How the pieces of the argument fit together – a method of arrangement conceived to create a particular kind of understanding.
  • 42. #ResponsiveIA @andybywire • “Rules for interaction among the parts” • “The appropriate unfolding” • Must respond to context in order to be effective Choreography
  • 44. #ResponsiveIA @andybywire } ONTOLOGY TAXONOMY CHOREOGRAPHY ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures.
  • 45. #ResponsiveIA @andybywire } ONTOLOGY TAXONOMY CHOREOGRAPHY QUALIA ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures.
  • 49. #ResponsiveIA @andybywire } ONTOLOGY TAXONOMY CHOREOGRAPHY QUALIA Mind Blowing by Luis Prado from The Noun Project ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures.
  • 51. #ResponsiveIA @andybywire } Mind Blowing by Luis Prado from The Noun Project ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures. ONTOLOGY TAXONOMY CHOREOGRAPHY
  • 55. #ResponsiveIA @andybywire } Mind Blowing by Luis Prado from The Noun Project ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures. ONTOLOGY TAXONOMY CHOREOGRAPHY
  • 56. #ResponsiveIA @andybywire } Mind Blowing by Luis Prado from The Noun Project ng it up is an associative e get these actions right, level of meaning making one of the slowest of the : the fundamental way in ur natural world.This has ages to usability. Intuitive ly useable because they perational knowledge we n interface is completely intuitive it must “borrow” her sphere of experience man in The Psychology of s to as “knowledge in the een interface popularized dy example of this. More Protect’s ”wave to hush” n example that builds on eractions (waving smoke tector to try to shut it up) nstantly comprehensible nal and often overlooked pping into deep layers of that by leveraging more , we’re able to design for r loosely and in a natural I mean associations that erwritten by an arbitrary, ciation in order to signify; oted in our experience of nate perceptual abilities. ore stable and, ironically, mapping one’s use of the ple as swapping out one mental model (the wheel another (the touchscreen loose coupling allows for to rigid (and often brittle) ganizational approaches. University of Lethbridge Louise Barrett uses this embly” to explain how in obots “a whole variety of effectively exploit specific ry) conditions, along with cs of an animal’s body, to ive behavior ‘on the fly.’” w soft assembly accounts in simple organisms (her and pre-microprocessor those examples to show ces of human and animal e be explained by taking fundamental constitutive n. For those of us tasked hitectures and interaction worked physical spaces, e most fundamental level ociation is understood (in mode it is most basically and then articulating that that exploits the intrinsic nment, allows us to build ation structures that don’t her by force, convention, which fit together by the e of their core structures. ONTOLOGY TAXONOMY CHOREOGRAPHY
  • 58. #ResponsiveIA @andybywire An information design strategy that facilitates the expression of specific meaning across multiple and independent contexts. Responsive Information Architecture
  • 59. #ResponsiveIA @andybywire Taxonomic Grid • Determine the narrative • Audit content and existing organization • Identify and build single-dimension structures • Articulate compound taxonomies to meet goals, accommodate constraints, and leverage opportunities.
  • 62. #ResponsiveIA @andybywire Taxonomic Grid • Determine the narrative • Audit content and existing organization • Identify and build single-dimension structures • Articulate compound taxonomies to meet goals, accommodate constraints, and leverage opportunities.
  • 64. #ResponsiveIA @andybywire Taxonomic Grid • Determine the narrative • Audit content and existing organization • Identify and build single-dimension structures • Articulate compound taxonomies to meet goals, accommodate constraints, and leverage opportunities.
  • 71. #ResponsiveIA @andybywire Taxonomic Grid • Determine the narrative • Audit content and existing organization • Identify and build single-dimension structures • Articulate compound taxonomies to meet goals, accommodate constraints, and leverage opportunities.
  • 76. #ResponsiveIA @andybywire Taxonomic Grid • Determine the narrative • Audit content and existing organization • Identify and build single-dimension structures • Articulate compound taxonomies to meet goals, accommodate constraints, and leverage opportunities.
  • 80. #ResponsiveIA @andybywire http://pervasiveia.com/blog/embracing-ambiguity - Luca Rosati. Embracing ambiguity: Ambiguity as an emerging design pattern “Embracing ambiguity — embracing the possibility of not understanding exactly how the pieces fit together — means designing systems that surpass our expectations of them.”
  • 81. #ResponsiveIA @andybywire Rich understanding of the information ecology Content-driven guidelines for interaction design choices Articulated information structures based on multiple modes of meaning making Embrace ambiguity as a strategy for negotiating the connected environment Responsive Information Architecture
  • 84. Thank you. Responsive Information Architectures www.linkedin.com/in/andyfitzgerald @andybywire #ResponsiveIA