<?xml version="1.0"?>
<?xml-stylesheet href="/transform" type="text/xsl"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:bibo="http://purl.org/ontology/bibo/" xmlns:bs="http://purl.org/ontology/bibo/status/" xmlns:ci="https://vocab.methodandstructure.com/content-inventory#" xmlns:dct="http://purl.org/dc/terms/" xmlns:foaf="http://xmlns.com/foaf/0.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:xhv="http://www.w3.org/1999/xhtml/vocab#" xmlns:xsd="http://www.w3.org/2001/XMLSchema#" lang="en" prefix="bibo: http://purl.org/ontology/bibo/ bs: http://purl.org/ontology/bibo/status/ ci: https://vocab.methodandstructure.com/content-inventory# dct: http://purl.org/dc/terms/ foaf: http://xmlns.com/foaf/0.1/ rdf: http://www.w3.org/1999/02/22-rdf-syntax-ns# xhv: http://www.w3.org/1999/xhtml/vocab# xsd: http://www.w3.org/2001/XMLSchema#" vocab="http://www.w3.org/1999/xhtml/vocab#" xml:lang="en">
  <head>
    <title property="dct:title">Shearing Layers Applied to the Web</title>
    <base href="https://doriantaylor.com/shearing-layers-applied-to-the-web"/>
    <link href="document-stats#EwumafwBvpR9XXnXfQSenI" rev="ci:document"/>
    <link href="elsewhere" rel="alternate bookmark" title="Elsewhere"/>
    <link href="this-site" rel="alternate index" title="This Site"/>
    <link href="http://purl.org/ontology/bibo/status/published" rel="bibo:status"/>
    <link href="" rel="ci:canonical" title="Shearing Layers Applied to the Web"/>
    <link href="lexicon/#E-ZY5i7K1cqzfT0p1L9ajJ" rel="dct:audience" title="Digital Media Practitioner"/>
    <link href="lexicon/#Er25AsP7lDnL8trRRAsODJ" rel="dct:audience" title="Digital Media Theorist"/>
    <link href="person/dorian-taylor#me" rel="dct:creator" title="Dorian Taylor"/>
    <link href="//www.youtube.com/embed/HTSbtM12IZw" rel="dct:hasPart"/>
    <link href="http://www.youtube.com/embed/HTSbtM12IZw" rel="dct:hasPart"/>
    <link href="//www.amazon.com/dp/0140139966" rel="dct:references"/>
    <link href="lexicon/#EnewYu-MeZVXNc97q_-jAI" rel="dct:subject" title="Web Development"/>
    <link href="file/brand-shearing-layers" rel="foaf:depiction"/>
    <link href="person/dorian-taylor" rel="meta" title="Who I Am"/>
    <link about="./" href="3f36c30c-6096-454a-8a22-c062100ae41f" rel="alternate" type="application/atom+xml"/>
    <link about="./" href="f07f5044-01bc-472d-9079-9b07771b731c" rel="alternate" type="application/atom+xml"/>
    <link about="./" href="this-site" rel="alternate"/>
    <link about="./" href="elsewhere" rel="alternate"/>
    <link about="./" href="e341ca62-0387-4cea-b69a-cdabc7656871" rel="alternate" type="application/atom+xml"/>
    <link about="verso/" href="3f36c30c-6096-454a-8a22-c062100ae41f" rel="alternate" type="application/atom+xml"/>
    <link about="verso/" href="this-site" rel="alternate"/>
    <link about="verso/" href="elsewhere" rel="alternate"/>
    <meta content="shearing-layers-applied-to-the-web" datatype="xsd:token" property="ci:canonical-slug"/>
    <meta content="It appears that the concept of shearing layers, popularized by Stewart Brand, isn't just applicable to buildings." name="description" property="dct:abstract"/>
    <meta content="2011-12-01T20:15:14+00:00" datatype="xsd:dateTime" property="dct:created"/>
    <meta content="shearing-layers-applied-to-the-web" property="dct:identifier"/>
    <meta content="2011-12-01T20:14:15+00:00" datatype="xsd:dateTime" property="dct:issued"/>
    <meta content="2011-12-02T20:38:14+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2011-12-09T14:09:31+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2013-03-11T23:10:09+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2014-07-31T06:31:25+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2018-11-22T01:39:09+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2022-05-31T04:18:52+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta content="2022-05-31T15:10:50+00:00" datatype="xsd:dateTime" property="dct:modified"/>
    <meta about="person/dorian-taylor#me" content="Dorian Taylor" name="author" property="foaf:name"/>
    <meta content="summary_large_image" name="twitter:card"/>
    <meta content="@doriantaylor" name="twitter:site"/>
    <meta content="Shearing Layers Applied to the Web" name="twitter:title"/>
    <meta content="It appears that the concept of shearing layers, popularized by Stewart Brand, isn't just applicable to buildings." name="twitter:description"/>
    <meta content="https://doriantaylor.com/file/brand-shearing-layers" name="twitter:image"/>
    <object>
      <nav>
        <ul>
          <li>
            <a href="intelligent-heterogeneity" rev="dct:references" typeof="bibo:Article">
              <span property="dct:title">Intelligent Heterogeneity</span>
            </a>
          </li>
          <li>
            <a href="interview-with-lara-fedoroff-for-ux-radio" rev="dct:references" typeof="bibo:Article">
              <span property="dct:title">Interview With Lara Fedoroff for UX Radio</span>
            </a>
          </li>
          <li>
            <a href="life-after-forecasting" rev="dct:references" typeof="bibo:Article">
              <span property="dct:title">Life After Forecasting</span>
            </a>
          </li>
          <li>
            <a href="my-work-at-the-ia-institute-an-anthology" rev="dct:references" typeof="bibo:Article">
              <span property="dct:title">My Work at the IA Institute: An Anthology</span>
            </a>
          </li>
          <li>
            <a href="the-specificity-gradient" rev="dct:references" typeof="bibo:Article">
              <span property="dct:title">The Specificity Gradient</span>
            </a>
          </li>
          <li>
            <a href="document-stats#EwumafwBvpR9XXnXfQSenI" rev="ci:document" typeof="qb:Observation">
              <span>urn:uuid:c2e99a7f-006f-4a51-8f57-5e75df4127a7</span>
            </a>
          </li>
        </ul>
      </nav>
    </object>
  </head>
  <body about="" id="EhTJpajDWGhfSuyieYPBeI" typeof="bibo:Article">
    <section id="E61OzoENsrQXJM3mu6AS2K">
      <p>In 1994, <a href="http://en.wikipedia.org/wiki/Stewart_Brand" title="Stewart Brand &#x2014; Wikipedia" rel="dct:references">Stewart Brand</a> wrote a book called <a href="http://www.amazon.com/gp/product/0140139966?ie=UTF8&amp;tag=doriantaylor-20&amp;linkCode=xm2&amp;camp=1789&amp;creativeASIN=0140139966" title="Amazon.com: How Buildings Learn: What Happens After They're Built (9780140139969): Stewart Brand: Books">How Buildings Learn</a>, which explored how the built environment changes over time as people use it. In it he brought to light a concept known as <a href="http://en.wikipedia.org/wiki/Shearing_layers" title="Shearing layers &#x2014; Wikipedia" rel="dct:references">shearing layers</a>, which, like the different hands of a clock, map to the rates of change of different aspects of a building and how those aspects move largely independently of one another. Three years later he <a href="https://www.youtube.com/watch?v=AvEqfg2sIH0" title="1. How Buildings Learn - Stewart Brand - 1 of 6 - &#x201C;Flow&#x201D;" rel="dct:references">published a six-part documentary</a>, the last of which covers the subject in depth:</p>
      <object style="display: block; margin: 2em auto; width: 420px; height: 315px" data="https://www.youtube.com/embed/HTSbtM12IZw"/>
      
      <p>Temporality is an exceptionally useful axis along which to organize. The speed at which a given aspect tends to change dictates how much effort we put into it, how much deliberation and political alignment is needed, how much we invest in durable materials, and how much of the aspect is subject to forces outside our control. The idea that different aspects of a system change at different time-scales that <em>shear against one another</em> is also enormously valuable&#x2014;it means that in changing one, we have to account for its effect on the others. This is just as applicable to the Web as it is to buildings. In fact, it appears to map perfectly.</p>
      <p>It turns out that I'm not the first to apply this idea to the Web. <a href="http://semanticstudios.com/publications/semantics/000003.php" title="The Speed of Information Architecture" rel="dct:references">Peter Morville, for instance</a>, did ten years earlier than I. I'm sure many others have as well. I want to tell you why <em>I</em> believe it fits.</p>
    </section>
    <section id="site">
      <h2>Site</h2>
      <p>What Brand means by <em>site</em> is a definite region in space where human activity occurs. A site may be occupied by many buildings and other fixtures that facilitate this activity over an arbitrarily long period of time&#x2014;<a href="http://longnow.org/" title="Front Page - The Long Now" rel="dct:references">in his mind, millennia</a>. As such, it would be awfully parochial to draw a direct parallel between this concept and a mere <em><abbr title="World-Wide Web">Web</abbr></em> site.</p>
      <p>A geographical site exists very plainly in physical space, but the kind of site we're concerned about occupies a much more ephemeral, conceptual and representational space. Both produce the same kinds of important social, cultural, psychological and semiotic environments, but while one is reinforced with stone, wood, concrete, glass and steel, the other can be vapourized on a whim or common accident.</p>
      <p>I believe it is absolutely essential that when considering the site, that it isn't really just what we normally call the <em>site</em>, but <a href="http://en.wikipedia.org/wiki/Neighbourhood_%28graph_theory%29" title="HEighbourhood (graph theory) &#x2014; Wikipedia" rel="dct:references">its entire neighbourhood</a> of other sites. When people contribute to the <abbr title="World-Wide Web">Web</abbr>, they do it because they want their message heard. When other people link to that message, especially from another <span class="parenthesis" title="Web">site</span>, it is <a href="http://en.wikipedia.org/wiki/PageRank" title="PageRank &#x2014; Wikipedia" rel="dct:references">a vote endorsing its attention</a> (irrespective of whether that attention is praise or criticism).</p>
      <p>Taking this greater concept of <em>site</em> into account, we can frame a concrete set of considerations for the environment surrounding what we <em>normally</em> dub a <em>site</em>.</p>
    </section>
    <section id="structure">
      <h2>Structure</h2>
      <p>When Brand talks about <em>structure</em>, he's referring to the <a href="lexicon/constraint" title="Constraint" rel="dct:references">constraints</a> and <a href="lexicon/affordance" title="Affordance" rel="dct:references">affordances</a> of the materials used as well as the properties of the forms that can be composed out of them.</p>
      
      <p>For example: The Web exhibits in great abundance one affordance that nearly every other  medium either does poorly or not at all: <a href="http://en.wikipedia.org/wiki/Intension" title="Intension &#x2014; Wikipedia" rel="dct:references">intension</a>. It pertains to understanding and connecting concepts together in terms of their <em>content</em>. It is the complement to <a href="http://en.wikipedia.org/wiki/Extension_%28semantics%29" title="Extension (semantics) &#x2014; Wikipedia" rel="dct:references">extension</a>, which pertains to understanding concepts in terms of the <em>categories</em> they belong to. Intension is about <a href="http://en.wikipedia.org/wiki/Free_association_%28psychology%29" title="Free association (psychology) &#x2014; Wikipedia" rel="dct:references">free association</a>, extension is about <a href="http://en.wikipedia.org/wiki/Library_classification" title="Library classification &#x2014; Wikipedia" rel="dct:references">classification</a>. What information architects tend to call <em>structure</em> is really just different forms of extension, from hierarchies, to facets, to search results. But as people we use both extension <em>and</em> intension to understand the world around us.</p>
      <p>We can understand these properties and put them to work for us, or we can ignore them and risk persistent conflict.</p>
    </section>
    <section id="skin">
      <h2>Skin</h2>
      <p>The <em>skin</em> is whatever comes into contact with the outside world. This isn't just the visual accoutrements intended for human consumption, but the interface for the <a href="http://edge.org/conversation/the-local-global-flip" title="The Local-global Flip, Or, &quot;the Lanier Effect&quot; | Conversation | Edge" rel="dct:references">growing proportion of non-human consumers</a> as well.</p>
      <p>The skin has semiotic value as well as aesthetic. Its features mark points of interest and enable people to orient themselves. It is perhaps more important to exist as an <a href="idioms-analogues-and-metaphors-in-the-language-of-design" title="Idioms, Analogues and Metaphors in the Language of Design" rel="dct:references">unambiguously recognizable idiom</a> than to invoke a pretty metaphor. Machines can be more easily confused, requiring an even stricter adherence to a well-defined set of semantics, and any sudden movements are abhored by both machines and people.</p>
      <p>Therefore: Make the skin reflect the structure&#x2014;entrances and exits, points of transition and inflection, public and private space&#x2014;but the structure need not dictate more than it must. Decouple the skin from every other consideration, so that it can be dealt with on its own, and so other elements may not unduly upset its integrity.</p>
    </section>
    <section id="services">
      <h2>Services</h2>
      <p><em>Services</em> consist of the systems that actually make things go. They are what enable people to get things done. In a building, they provide people with power and water, make the rooms hotter or cooler, or move people throughout the structure. They are analogous to <em>applications</em>.</p>
      <p>We can say a few things about services: <em>how</em> you get a job done is never as important as the fact <em>that</em> you get a job done. Likewise, how you do a certain job tomorrow may not be the same as how you do it today. In other words, technologies, platforms, products, languages, styles and maintainers with their pet preferences all come and go. The services plan should account for that.</p>
      <p>Moreover, services are inherently heterogeneous, with parts being removed as new, unanticipated ones are added. Trying to coerce that behaviour into a monolith is hard, costly, and underperforms if it performs at all.</p>
    </section>
    <section id="space-plan">
      <h2>Space Plan</h2>
      <p>The <em>space plan</em> is what we would normally refer to as <em>structure</em>. It comprises the sections, the site map, facets, search, visual hierarchy, content positioning, et cetera.</p>
      <p>In a building, you adapt the space plan to the human activities that happen most frequently. On the Web, there is little stopping us technically from tracking precisely what activities happen most frequently and adapting ad hoc <em>and</em> doing that for each visitor or discernible group thereof&#x2014;if only it were that easy.</p>
      <p>Changes to the space plan of a building are heavily moderated by the material cost of modifying non-structural elements, but beyond that, what to do tends to be easy for everybody to understand and organize around. Changes to the space plan of a website or any other software system, while they carry a negligible material cost, typically involve coordinating several constituencies with diverging interests, varying levels of understanding and vast disparities in both the domains and ranges of their respective executive power. More often than not, there isn't a single person who can control the entire space plan of a website, though this is a problem that can easily be remedied if we consider it at the outset.</p>
      <aside role="note" id="EnzINzRAubdyBLD-ZcmFSJ">
        <p>P.S.: What I just described is <a href="https://plus.google.com/118207880179234484610/about" title="Marissa Mayer - Google+" rel="dct:references">Marissa Mayer's</a> job.</p>
      </aside>
    </section>
    <section id="stuff">
      <h2>Stuff</h2>
      <p><em>Stuff</em> is what pertains to what actually <em>goes on</em> inside a space. We might also recognize the concept as <em>content</em>. It's the reason why we're here. So let's get everything else out of its way.</p>
    </section>
  </body>
</html>
