davidbgk
/
larlet-fr-david-cache

<!doctype html><!-- This is a valid HTML5 document. -->
<!-- Screen readers, SEO, extensions and so on. -->
<html lang=fr>
<!-- Has to be within the first 1024 bytes, hence before the <title>
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
<meta charset=utf-8>
<!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
<!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
<meta name=viewport content="width=device-width,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
<!-- Required to make a valid HTML5 document. -->
<title>Fan Is A Tool-Using Animal-dConstruct Conference Talk (archive) — David Larlet</title>
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/static/david/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="David Larlet">
<meta name="application-name" content="David Larlet">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- That good ol' feed, subscribe :p. -->
<link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="http://idlewords.com/talks/fan_is_a_tool_using_animal.htm">

<style>
/* http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* http://practicaltypography.com/equity.html */
/* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
/* https://www.filamentgroup.com/lab/js-web-fonts.html */
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ConcourseT3';
  src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
       url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


/* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
body {
  /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  font-family: "EquityTextB", Palatino, serif;
  background-color: #f0f0ea;
  color: #07486c;
  font-kerning: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
pre, code, kbd, samp, var, tt {
  font-family: 'TriplicateT4c', monospace;
}
em {
  font-style: italic;
  color: #323a45;
}
strong {
  font-weight: bold;
  color: black;
}
nav {
  background-color: #323a45;
  color: #f0f0ea;
  display: flex;
  justify-content: space-around;
  padding: 1rem .5rem;
}
  nav:last-child {
    border-bottom: 1vh solid #2d7474;
  }
  nav a {
    color: #f0f0ea;
  }
  nav abbr {
    border-bottom: 1px dotted white;
  }

h1 {
  border-top: 1vh solid #2d7474;
  border-bottom: .2vh dotted #2d7474;
  background-color: #e3e1e1;
  color: #323a45;
  text-align: center;
  padding: 5rem 0 4rem 0;
  width: 100%;
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
}
  h1.single {
    padding-bottom: 10rem;
  }
  h1 span {
    position: absolute;
    top: 1vh;
    left: 20%;
    line-height: 0;
  }
    h1 span a {
      line-height: 1.7;
      padding: 1rem 1.2rem .6rem 1.2rem;
      border-radius: 0 0 6% 6%;
      background: #2d7474;
      font-size: 1.3rem;
      color: white;
      text-decoration: none;
    }
h2 {
  margin: 4rem 0 1rem;
  border-top: .2vh solid #2d7474;
  padding-top: 1vh;
}
h3 {
  text-align: center;
  margin: 3rem 0 .75em;
}
hr {
  height: .4rem;
  width: .4rem;
  border-radius: .4rem;
  background: #07486c;
  margin: 2.5rem auto;
}
time {
  display: bloc;
  margin-left: 0 !important;
}
ul, ol {
  margin: 2rem;
}
ul {
  list-style-type: square;
}
a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.09em;
}
article {
  max-width: 50rem;
  display: flex;
  flex-direction: column;
  margin: 2rem auto;
}
  article.single {
    border-top: .2vh dotted #2d7474;
    margin: -6rem auto 1rem auto;
    background: #f0f0ea;
    padding: 2rem;
  }
  article p:last-child {
    margin-bottom: 1rem;
  }
p {
  padding: 0 .5rem;
  margin-left: 3rem;
}
  p + p,
  figure + p {
    margin-top: 2rem;
  }

blockquote {
  background-color: #e3e1e1;
  border-left: .5vw solid #2d7474;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  margin: 1.5rem;
}
  blockquote cite {
    font-style: italic;
  }
  blockquote p {
    margin-left: 0;
  }

figure {
  border-top: .2vh solid #2d7474;
  background-color: #e3e1e1;
  text-align: center;
  padding: 1.5rem 0;
  margin: 1rem 0 0;
  font-size: 1.5rem;
  width: 100%;
}
  figure img {
    max-width: 250px;
    max-height: 250px;
    border: .5vw solid #323a45;
    padding: 1px;
  }
figcaption {
  padding: 1rem;
  line-height: 1.4;
}
aside {
  display: flex;
  flex-direction: column;
  background-color: #e3e1e1;
  padding: 1rem 0;
  border-bottom: .2vh solid #07486c;
}
  aside p {
    max-width: 50rem;
    margin: 0 auto;
  }

/* https://fvsch.com/code/css-locks/ */
p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  font-size: 1rem;
  line-height: calc( 1.5em + 0.2 * 1rem );
}
h1 {
  font-size: 1.9rem;
  line-height: calc( 1.2em + 0.2 * 1rem );
}
h2 {
  font-size: 1.6rem;
  line-height: calc( 1.3em + 0.2 * 1rem );
}
h3 {
  font-size: 1.35rem;
  line-height: calc( 1.4em + 0.2 * 1rem );
}
@media (min-width: 20em) {
  /* The (100vw - 20rem) / (50 - 20) part
     resolves to 0-1rem, depending on the
     viewport width (between 20em and 50em). */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
    margin-left: 0;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
}
@media (min-width: 50em) {
  /* The right part of the addition *must* be a
     rem value. In this example we *could* change
     the whole declaration to font-size:2.5rem,
     but if our baseline value was not expressed
     in rem we would have to use calc. */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * 1rem );
    line-height: 1.5em;
  }
  p, li, pre, details {
    margin-left: 3rem;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * 1rem );
    line-height: 1.2em;
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * 1rem );
    line-height: 1.3em;
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * 1rem );
    line-height: 1.4em;
  }
  figure img {
    max-width: 500px;
    max-height: 500px;
  }
}

figure.unsquared {
  margin-bottom: 1.5rem;
}
  figure.unsquared img {
    height: inherit;
  }


@media print {
  body { font-size: 100%; }
  a:after { content: " (" attr(href) ")"; }
  a, a:link, a:visited, a:after {
    text-decoration: underline;
    text-shadow: none !important;
    background-image: none !important;
    background: white;
    color: black;
  }
  abbr[title] { border-bottom: 0; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  img { page-break-inside: avoid; }
  @page { margin: 2cm .5cm; }
  h1, h2, h3 { page-break-after: avoid; }
  p3 { orphans: 3; widows: 3; }
  img {
    max-width: 250px !important;
    max-height: 250px !important;
  }
  nav, aside { display: none; }
}

ul.with_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_columns {
    column-count: 2;
  }
}
@media (min-width: 50em) {
  ul.with_columns {
    column-count: 3;
  }
}
ul.with_two_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_two_columns {
    column-count: 1;
  }
}
@media (min-width: 50em) {
  ul.with_two_columns {
    column-count: 2;
  }
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
  .gallery figure img {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .gallery figure figcaption {
    font-family: 'ConcourseT3'
  }

footer {
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
  border-top: 3px solid white;
  padding: 4rem 0;
  background-color: #07486c;
  color: white;
}
  footer > * {
    max-width: 50rem;
    margin: 0 auto;
  }
  footer a {
    color: #f1c40f;
  }
  footer .avatar {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    float: left;
    -webkit-shape-outside: circle();
    shape-outside: circle();
    margin-right: 2rem;
    padding: 2px 5px 5px 2px;
    background: white;
    border-left: 1px solid #f1c40f;
    border-top: 1px solid #f1c40f;
    border-right: 5px solid #f1c40f;
    border-bottom: 5px solid #f1c40f;
  }
</style>

<h1>
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  Fan Is A Tool-Using Animal-dConstruct Conference Talk (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="http://idlewords.com/talks/fan_is_a_tool_using_animal.htm">Source originale du contenu</a></h3>
    <table cellspacing="20">

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.002.jpg"/></td>
    <td>


    <p>In 1967, Gene Roddenberry launched a TV show that had a massive cultural impact. While it wasn’t a hit during its original run, it kindled the imagination in a way few other television programs had.  The story of an attractive, pan-ethnic crew roaming the galaxy, solving moral dilemmas in tight uniforms, had a powerful appeal.

</p><p>The hero of the series, Captain James Tiberius Kirk, was a man of passion and a bit of a space whore.  Whether you were white, black, green or blue, you knew you were always welcome in the captain’s quarters.   </p>

    </td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.003.jpg"/></td>
    <td>
    <p>But while space girlfriends came and went, it was clear that the emotional heart of the show was the relationship between two men—or more precisely, between one and a half men and half a Vulcan.

    </p><p>Kirk’s foil was the icy, dark-haired, infuriatingly logical Mr. Spock.  They drove each other crazy, they were at loggerheads, they were inseparable.

        </p><p>In the sixties, of course, shows weren't allowed to have subtext.   This was an era that could made a sitcom about <a href="http://en.wikipedia.org/wiki/I_Dream_of_Jeannie">a scantily-clad magic genie</a>  who has to do obey master's every whim and somehow keep it free of innuendo.

    </p><p>But while Star Trek's writers couldn't hint that there might be something more to the Kirk/Spock relationship, a group of predominantly straight, female fans of the show had no qualms about writing their own stories in which man boldly went where no man had gone before.

    </p></td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.004.jpg"/></td>
    <td>


    <p>This caused a rift; in fact, it nearly tore the Star Trek fandom asunder.  There was a big debate at one of the early Star Trek conferences over what  became known as ‘The Premise’, or K/S, or simply 'slash'.

    </p><p>Fans knew that Gene Roddenberry wouldn't look kindly on hardcore homosexual erotica written about his family-friendly TV show.

    </p><p>But write it they did, and as fandom moved from the world of 'zines and photocopies to mailing lists and Usenet, and then finally found its Golden Age on Livejournal, slash came closer to the surface. It became harder to ignore that people really enjoyed writing and reading this stuff.

    </p><p>There's a cliche in the world of fan fiction about outsiders like me expounding on slash, trying to answer the question 'why do people write this' and 'why do people read it', as if any explanation was required.

    </p><p>No one gets on a conference stage to explain why heterosexual men enjoy watching attractive women make out with each other.  At least, not at the conferences I attend.  But for some reason people seem to think slash requires justification and footnotes. This idea that slash needs explaining is a form of judgement.

    </p><p>You're probably wondering at this point, why is this weird Polish-named guy up on stage talking about Kirk drilling Spock?</p>

    <p>And some of you may be thinking, “That's fine, please continue. Do you have any more slides?”

    </p><p>Well, I'm here by way of atonement, because I used to be a real jerk about fandom, and I used to make fun of them.  Then I had a life-changing, road-to-Damascus moment.  It involved a strange artifact that got produced partly because of something I did, which I'll describe in a few minutes.  It taught me a great deal about community on the Internet.

    </p><p>As I've gotten to know fandom, I've grown convinced that they have a lot to teach us all.  Fans are an example of  real people using machines to talk to one another, rather than a manufactured and engineered attempt to graft social life onto a single website.

    </p><p>But for the story to make sense, I need to tell you a few things about my website, and how I was set on a collision course with fandom.
    </p></td>
</tr>

<tr>
    <td><h1>This Is Joshua</h1>
    <img src="https://static.pinboard.in/fantalk/dcon.006.jpg"/></td>
    <td>
    <p>This is my friend Joshua Schachter.  In 2004, Joshua founded <a href="http://en.wikipedia.org/wiki/Delicious_(website)">Delicious</a>, the first social bookmarking site.  One of his many innovations was a "tags" field on each bookmark, where you could type any words that you wanted to describe what you were saving.  The only other website using tags back then was Flickr, which came out at roughly the same time.

     </p><p>I didn’t see why tags were a big deal, but Joshua explained to me that tagging was basically a search engine in reverse.  This was an incredibly powerful idea.

      </p><p>When you wanted to save something for later, tags gave you a chance to enter the same words your future self would  type into a search box months later.


</p><p>But tags were even more useful than that.  It turned out that when enough people tagged a link, the aggregate tags they came up with gave a really good global description. You didn’t have to tell people to use a standard vocabulary or follow any rules. It was enough to have people type independently whatever came to mind.

</p><p>The high quality of these global tags surprised everyone (with the possible exception of Joshua, who is a very clever guy).  Before that point, people had assumed you needed strict rules in place for multiple people to usefully classify anything.

</p><p>Joshua took this discovery straight to Yahoo. Yahoo at the time employed rooms full of people to do what Delicious users were doing for free.  Yahoo had started life as a web directory, and they were still trying to classify the web by hand.   The pitch was easy. Why not do this Tom Sawyer-style, and have users paint the fence for you?

</p><p>So it came to pass that Yahoo bought Flickr and Delicious, and thus were a thousand buzzwords born: user-generated content, social as a noun, folksonomy, tag cloud, and eventually (when javascript got good enough) Web 2.0.

</p></td>
</tr>

<tr>
    <td><h1>This Is Britta</h1>
    <img src="https://static.pinboard.in/fantalk/dcon.007.jpg"/></td>
    <td>
    <p>This is my friend Britta Gustafson, the former Delicious community manager.  Britta is not just a wonderful human being, but an exceptional diplomat.  She can jiu-jitsu even the most toxic people, including myself.

    </p><p>We were talking one day a couple of years after the Yahoo sale about tags on Delicious, and she said “you should look at the fanfic people, they're doing crazy stuff.”

    </p><p>My response was something like "fanfic? come on, LAAAAAAME!"

    </p><p>She smiled her sweet smile and said, "I know you think it's lame. But why don't you go take a look at what I just said?"

    </p><p>And she was right. The fans were doing something incredible.
        </p></td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.008_small.jpg"/></td>
    <td>

    <p>This morning I pulled up my tag cloud from Pinboard.  My tags are pretty typical of a long-time bookmarker.   Tags accrue over time like barnacles, and unless you scrape them off, you end up with lots of oddities and cruft.

    </p><p>Some people are very focused taggers. They treat tags like folders;  they may only have ten or twelve tags that they bin everything into.  I'm not disciplined. I just type what comes into my mind.

    </p><p>But the fanfic people were doing something very different. They had converged on a set of elaborate tagging conventions that allowed them to turn Delicious into a custom search engine for fanfic.


    </p></td>
</tr>
<tr>
    <td>

  <h1>Examples</h1>
  </td>
    <td>
    <p>Let me give you some examples.  Not all of these may link to live search results anymore, since fic changes fast. But they were all collected from the wild!

</p><p><b><a href="https://pinboard.in/t:pairing:chekhov%252fsulu/">pairing:chekhov/sulu</a></b></p>

    <p>When you get into fanfic, you learn that there are people who focus on certain shows, and within those shows people have favored pairings.  So maybe you like Harry and Draco Malfoy, or perhaps you're a traditionalist, so it's Kirk and Spock for you, even though that's been done for years and years.  The pairing: prefix let you filter by that.

</p><p><b><a href="https://pinboard.in/t:p.needstags/">p.needstags</a></b>
</p><p>
       Delicious had no way of showing you which bookmarks hadn't been tagged yet, so people would stick tags like this on as a placeholder for stuff they needed to go back to and classify later.  It was a kind of meta tag that didn't describe the bookmark directly, but rather helped people manage their workflow.

     </p><p><b><a href="https://pinboard.in/t:kink:D%252fs/">kink:D/s</a></b>.

     </p><p>The kink prefix is self-explanatory.  In this case, the kink is dominance and submission.  If you wanted to read about bondage instead, or cross-dressing, all you had to do was search.

     </p><p><b><a href="https://pinboard.in/t:kidnapped!snape/">kidnapped!snape</a></b></p>
     <p>The exclamation point infix signals that there's a canonical character but something happens to them that's not really in the story.  Here Snape has been kidnapped, for example.  I wonder they're going to do with him.</p>

     <p><b><a href="https://pinboard.in/t:chapters-read:12/">chapters-read:12</a></b></p>
     <p>Some fic is very long, so how do you mark your place? This is a case where a tag is being used to bookmark a bookmark.

     </p><p><b><a href="https://pinboard.in/t:matchmaker:spock-prime/">matchmaker:spock-prime</a></b></p>

     <p>Who knew that Spock Prime, with his little goatee, would actually be the one who got Kirk and Spock Regular together?

    </p><p><b><a href="https://pinboard.in/t:trope:noir/">trope:noir</a></b></p>
     Tropes are a convenient way of organizing by plot device or theme.

    <p><b><a href="https://pinboard.in/t:meta-fandom-femalecharacters-stargate/">meta-fandom-femalecharacters-stargate</a></b>

    </p><p>Some people used hyphens or dots to create tag hierarchies, or to give tags internal structure. These setups could get very elaborate.

    </p><p><b><a href="https://pinboard.in/t:'research/">'research</a> <br/>
        <a href="https://pinboard.in/t:*artemis/">*artemis</a><br/>
        <a href="https://pinboard.in/t:+dylan%252fposey/">+dylan/posey</a><br/>
        <a href="https://pinboard.in/t:@anonymous/">@anonymous</a><br/>
        <a href="https://pinboard.in/t:^allthefeels/">^allthefeels</a> <br/>
        <a href="https://pinboard.in/t:]&lt;10k/">]</a></b>


    </p><p> Some of my favorite examples overloaded the tag auto-completion feature, where typing the first character of a tag brought up the full list of tags starting with that letter.

    </p><p>Users began to prefix their tags in order to group them, in a kind of <a href="https://en.wikipedia.org/wiki/Hungarian_notation">Hungarian notation</a>.

     </p><p>In this user's prefixing convention, for example, <b>'</b> marks a general category, <b>*</b> indicates a character name, <b>+</b> is for pairings, <b>@</b> is the author of the fic, <b>^</b> is the tagger's own commentary, and <b>]</b> indicates approximate word count.


     </p><p>It's incredible how much effort people put into tagging conventions, and how they were able to converge on some useful common idioms that made Delicious the most powerful fanfic search engine on the planet.


</p><p>This was really remarkable.  Fans had customized Delicious into a fan site without writing a line of code (though there were soon plugins and Greasemonkey scripts to make fannish work easier).


    </p></td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.010.jpg"/></td>
    <td>
    <p>In 2009, when I started my own bookmarking site, called Pinboard, I really wanted to lure over fans with their amazing tag collections.

    </p><p>But fans are loyal people.  And they were really attached to Delicious, especially to a very elaborate Firefox plugin that made life a breeze for people with thousands of tags.   I didn't have much success in getting them to cross over.

    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.011.jpg"/></td>
    <td>
    <p>Until in 2010 Steve Chen and Chad Hurley, the founders of YouTube, came along and made my career.   I don't know them personally. Maybe they're lovely people in person—kind to animals, beloved by children.

    </p><p>But they bungled their way through acquiring Delicious so badly that the site never recovered.

    </p><p>Chad looked at Steve and was like:

</p><p>“Bro, you want to buy Delicious?”

</p><p>And Steve looked at Chad and was like:
</p><p>“Bro let's totally buy it!”
</p><p>And they high-fived and that was it.</p>

<p>A few months after the acquisition, there was a grand uncloaking of their new design, much of which involved destroying features of Delicious that fans  were utterly dependent on.


</p><p>The new Delicious removed the ability to see your full list of tags, which as you can imagine for someone with an intricate tagging system is the end of the world.

</p><p>They got rid of tag bundles, a crucial feature for fans.</p>

<p>And in an inspired stroke, they took down their support forum, so no one could complain about anything on the site itself.

</p><p>But the single change that killed fandom dead on Delicious was no longer being able to type "/" into the search box.

</p><p>There is no God, life has no meaning, it's all over when you can't search on the slash character.  And fandom started freaking out on Twitter.


    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.012.jpg"/></td>
    <td>
<p>Being a canny businessman, I posted a gentle reminder that there was still a bookmarking site that let you search on a slash tag.


</p><p>So fandom dispatched a probe to see if I was worth further study.  The emissaries talked to me a bit and explained that my site was missing some features that fans relied on.


    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.013.jpg"/></td>
    <td>
  <p>In my foolishness I asked, "Could you make me a list of those features? I'll take a look, maybe some of it is easy to implement."

</p><p>Oh yes, they could make make a list.

</p><p>I had summoned a very friendly Balrog.

    </p></td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.014.jpg"/></td>
    <td>


    <p>
For three days, I watched <a href="https://docs.google.com/document/d/17oqfHHkO48fVFY3sPQqkoCuqFnQOWe4fxRxXJ-lUglg/edit?hl=en_US">this collaborative Google doc</a> grow and grow before my eyes.  It ended up being fifty-two pages long. I want to show you some of the highlights.

</p><p>At times, there were so many people editing the document at that it tucked its tail between its legs and went into a  panicked ‘read only’ mode.  Even the mighty engineers at Google couldn’t cope with the sustained attention of fandom.


    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.015.jpg"/></td>
    <td>
  <p>The editors of this document were anonymous, but they somehow seemed to know each other.
</p><p>Here's the first page of the document. You'll notice that it's already color-coded and starts with elaborate instructions.

</p><p>Please don't insert anything into the table of contents, because there's a really OCD person whose job is just that.

</p><p>You were supposed to study this spontaneously-generated style guide and read the entire document before contributing. And people did!


    </p></td>
</tr>
<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.016.jpg"/></td>
    <td>


<p>The document contained a long list of feature requests and use cases.  People would vote on the features they wanted by adding a little arrow and their vote afterwards: ‘seconded’, ‘thirded’, so on.

</p><p>There was no way to keep track of who had written what, but somehow they managed it anyway.


    </p></td>
</tr>


<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.017.jpg"/></td>
    <td>

  <p>I was afraid of what was happening.  When I ventured into this document myself, I made my text light orange, so it would be as faint as possible. People started having discussions with me.

</p><p>Here I've shown a paragraph where someone asks me if I can build a user search feature, and I reply at length about why that's not trivial.  At that point someone decides that it's easier for them to just go build the feature on the spot. They set up a little app in Heroku that mapped Pinboard usernames to Delicious usernames.

</p><p>In the time it took me to explain why I couldn't build the feature, someone did it for me and stuck a hyperlink into this document that is spiraling out of control.

    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.018.jpg"/></td>
    <td>


      <p>Here you see a very stern admonition by some people not to slash me (that is, include me in erotic fiction).

      </p><p>“Please don't slash Maciej, he's not okay with it, and we want him to like us.”

      </p><p>(I was totally fine with it!)</p>

      <p>You see the debate and then someone plaintively cries "THIS IS WHY WE CAN'T HAVE NICE THINGS", and tries to argue that writing fic about anthropomorphized bookmarking sites is not the same thing as real person fiction (RPF), which is taboo in certain parts of fandom.

   </p><p>And then of course the inevitable happens, and someone writes fic about the document itself.

      </p><p>Naturally the fic links back to the document, and someone puts a link to the fic in the document itself, crossing the Internet streams and dividing by zero.
    </p></td>
</tr>

<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.019.jpg"/></td>
    <td>


<p>In a further paragraph, someone asks for a feature, and another viewer just pastes the appropriate javascript right into the doc.

</p><p>At some point in the night, the document acquired an index.  Someone wrote a tutorial for how to edit this document.  Another person took charge of removing duplicate references, and greying out feature requests for things my website already did.

</p><p>One user—all she did was indent (which was important), and another user THANKED HER in the credits section  (because of course there was a credits section).

</p><p>Someone else added hyperlinks to outside documents where appropriate.
Not just documents, but MLA-style citations.

    </p></td>
</tr>


<tr>
    <td><img src="https://static.pinboard.in/fantalk/dcon.020.jpg"/></td>
    <td>

    <p>Finally at the end of the doc, people took time to express how happy they were about having written it together, and how much fun it had been, and their joy at living in a world where this kind of thing was possible.   They changed the text color for each user.

    </p><p>When is the last time you saw an anonymous comment thread or collaborative doc end in general happiness?


    </p></td>
</tr>


<tr>
    <td><h1>A Dramatic Reading</h1></td>
    <td>
   <p>

  </p>
  <p>[Here I gave a dramatic reading from <b><a href="http://archiveofourown.org/works/258626">The Morning After</a></b>, a wonderful story featuring an anthropomorphized Delicious and Pinboard. Big thanks to ambyr for letting me include this in my talk! Go read it!]

  </p><p>Having worked at large tech companies, where getting a spec written requires shedding tears of blood in a room full of people whose only goal seems to be to thwart you, and waiting weeks for them to finish, I could not believe what I was seeing.

  </p><p>It was like a mirror world to YouTube comments, where several dozen anonymous people had come together in love and harmony to write a complex, logically coherent document, based on a single tweet.

  </p><p>All I could think was–who ARE these people?

    </p></td>
</tr>

<tr>
    <td><h1>Executive Summary Of Low-Hanging Takeaways for Key Stakeholders</h1></td>
    <td>
   I know you are serious conferencegoers and paid good money to be here, so I want to send you home with some actionable business intelligence about fandom.


    </td>
</tr>

<tr>
    <td><h1>Fans are SO NICE</h1></td>
    <td>
   <p>Key takeaway #1: Fans are incredibly nice.

   </p><p>So stop being mean to them, if you've ever been mean to them like I used to be.  We live in a culture that celebrates a man with a metal stick who spends thirty years of his life trying to hit a ball into a hole.   He's <a href="http://www.theonion.com/articles/man-who-used-stick-to-roll-ball-into-hole-in-groun,6204/">described as 'courageous'</a>, there's a story arc to his life, and so on.

   </p><p>A hobby where you are writing stories is not weird, and certainly nothing to look down on.


    </p></td>
</tr>

<tr>
    <td><h1>Fans Fight Censorship</h1></td>
    <td>
   <p>Fans love drama, so they tend to dramatize their history, but they've had real moments of struggle.  One of them was when LiveJournal gave in to a moral panic and announced they were banning all communities that supported 'criminal activity'. Their definition of criminal activity was a simple and unimaginative blacklist of keywords.

   </p><p>Anything that matched that list—including words like incest, rape, and abuse—marked a community as criminal. LiveJournal banned 500 communities.  350 of them were eventually reinstated after fans fought back.

   </p><p>The people banned on LiveJournal weren't just fans writing erotic stories, but incest and rape survivors discussing their all-too-real experience. It was a very heavy-handed move.

   </p><p>Due to the provocative nature of their writing, fans often find themselves subjected to this kind of censorship. They test boundaries.

   </p><p>We saw an example just recently when Tumblr, after being acquired by Yahoo, decided to ban pornography. That ban included blanking out public search results for the keyword 'gay'.

   </p><p>Fans are right there in the trenches, so support them, because what they're doing protects our own freedom of expression.


    </p></td>
</tr>
<tr>
    <td><h1>Fans Fight For Privacy</h1></td>
    <td>
   <p>Fans fight for privacy.  Fandom is mostly a women's community, and they have an interesting take on privacy. While fans aren't ashamed of what they're doing, they know that the ability to have pseudonyms or a separate identity from their day-to-day one gives them freedom to write what they want, and interact how they want.

   </p><p>Fans are also sensitive to issues of safety, something sites all too often take for granted.

   </p><p>We live at a time when very centralizing sites are trying to tether us to our real names.  Fans fight against this, while providing a living example that you can have anonymous or pseudonymous communities that are not full of horrible trolls.


  </p></td>
</tr>

<tr>
    <td><h1>Fans Transgress</h1></td>
    <td>
   <p> Fans never sold out, man!


   </p><p>There have been multiple attempts by for-profit fan fiction sites to co-opt a part of  fandom.


   </p><p>Just a couple of weeks ago, Amazon introduced Kindle Worlds.
   In Kindle Worlds, Amazon has graciously licensed some fictional realms and given users leave to write stories about them.

   </p><p>If you look at the terms and conditions, there can't be any sex in these stories, and there are all kinds of other restrictions. But authors are promised some pittance of a percentage of every sale.

   </p><p>Fans don't automatically dismiss efforts like this, but almost invariably their answer is “no, we're just going to keep doing what we've been doing.” Which is transgressing. Which is awesome! This is what the Internet was supposed to bring: edgy, substantive freedom from corporate control.

   </p><p>Fans fight the good fight against an insane corporate vision of copyright  where imagination is considered property and we're supposed to believe that writing original stories based in an established universe is thoughtcrime.</p>

   <p>Here's a quote from some shill at LucasFilm:

   </p><blockquote>
   We've been very clear all along on where we draw the line. We love our fans, we want them to have fun. But if in fact somebody is using our characters to create a story unto itself, that's not in the spirit of what we think fandom is about.
   <p>Fandom is about celebrating the story the way it is.
   </p></blockquote>

   <p>No.</p>

   <p>Fandom is a big middle finger raised at this attitude.

   </p><p>Consider that fandom is a subculture that is older than the Internet, yet I can talk about it in 2013 and know that some of you are hearing about fandom for the very first time. That's pretty cool.  Fans have kept it real.

 </p></td>
</tr>
<tr>
    <td><h1>Fans Improve Our Culture</h1></td>
    <td>

   <p>Fans improve our culture.  Part of the reason our television shows suck less than they used to is because people have become more sophisticated about the way they watch them.

   </p><p>There may be technological reasons for this; we can binge on shows now dozens of episodes at a time.   But fandom plays a big role. It analyzes this stuff to death, deconstructs it; armies of librarians, professors, academics, and just general smart people in fandom pick stories apart and glue them back in unexpected ways.

   </p><p>And of course lots of people in the entertainment industry are in fandom too, and pick up on this.  Fannish efforts percolate back into the culture and make stories better for everyone.

    </p></td>
</tr>

<tr>
    <td><h1>Social Is Not A Syrup</h1>
    <img src="https://static.pinboard.in/fantalk/dcon.029.jpg"/></td>
    <td>

  <p>Just a couple more ranty items, while I have the time.

  </p><p>The first is a remark about the concept of "social", which has lately afflicted our online communities.


   </p><p>There's a horrible conceit gaining ground that websites present someting called "content". I like to think of it as an amorphous, tofu-like substance.  You cut it to whatever shape you want, and then pour some kind of syrup or gravy called "social" on top to give it flavor.

     </p><p>Social is not a syrup, a sauce, a gravy. It's not even a noun.

  </p><p>Fandom teaches us that communities are not about consumption, and they're not something you can engineer. If you want people to get involved in your site, you have to treat them with respect and give them room to do it on their own terms.

   </p></td>
</tr>


<tr>
    <td><h1>Don't Make It Too Easy</h1></td>
    <td>

  <p>One counterintuitive thing about active communities is that they sometimes use clunky, outdated tools.  This doesn't just apply fandom, you can find it in all kinds of places.  I like to scuba dive, for example, but the main scuba site is a terribly crufty <a href="http://www.scubaboard.com/forums/content/">PHP message board</a>.

  </p><p>Our first instinct as programmers is to want to make these tools better.  But these terrible interfaces serve a protective function, where they keep the community insulated from drive-by visitors and require new contributors to endure a a period of apprenticeship and lurking.

  </p><p>If you ever wonder why comments on sites like The Guardian or the New York Times are total trash, one reason may be that they've gone to too much effort to make it easy to post to the site.

    </p></td>
</tr>


<tr>
    <td><h1>Lurkers Are Watching</h1></td>
    <td>
  Lurkers are watching you, and they outnumber everyone else.
  Your behavior is important.

  Livejournal didn't think there would be a big deal in banning a few hundred little fan communities, but for every person who spoke out, there were ten people watching to see what would happen.

  <p>This is something to be really careful about.  People who choose to stop using your site will likely never tell you why they're leaving.

    </p></td>
</tr>


<tr>
    <td><h1>Stop Futzing With It</h1></td>
    <td>

    A corollary of that is 'just stop futzing with it'.  Don't 'refresh' your interface. Gratuitous change is an easy way to break trust with your community, or break features you didn't even know you had.

    <p>On Livejournal, for example, every post and comment can have a little user icon next to it.  Fans used to use these icons as a silent commentary on the comment they'd written. Sometimes the comment didn't even make sense without the accompanying icon for context. There were users who had amassed hundreds of user icons, and they would pick the one that best fit the comment.  There was an art to it.

    </p><p>Until one day, Livejournal decided to limit people to 20 or 30 icons, and made the change retroactive. So they killed this feature of their site that they didn't even understand, and they destroyed a lot of data.

    </p></td>
</tr>
<tr>
    <td><h1>Shut Up And Listen</h1></td>
    <td>
    Which leads to the next point, 'shut up and listen'.  People are using your sites in ways you might not understand. Why not have a look and see what they're up to? Or ask? People are amazingly forthcoming when you ask them, but it rarely occurs to site owners to do this.
    <p>Just because you wrote it doesn't mean you know what your site is for.

    </p></td>
</tr>

<tr>
    <td><h1>Breakups Are Hard</h1></td>
    <td>
  <p>Breakups are hard on communities and on sites. When a tight-knit community decides to leave, they tend to go all at once.  With Delicious it was a stampede. Not everybody went to Pinboard, but almost everybody went somewhere else.

  </p><p>Breakups are irrevocable. Once a community leaves your site, they're not going to come back easily.  There's such a high activation energy to overcome to get people to leave, that if they do leave it means you've truly exasperated them.

  </p><p>In that way it's a lot like human relationships.  It takes a lot to get people to go, but once they're gone, it's final.


    </p></td>
</tr>


<tr>
    <td><h1>We Are All Fans</h1></td>
    <td>
    <p>We are all fans.  Whether or not you write fanfic, read it, or have any interest in it, you're a fan of something.   There's stuff that you like to read, or watch.

    </p><p>Let that be a guide to you, to help you empathize with people who like to take a more active approach to their fandom.

    </p></td>
</tr>


<tr>
    <td><h1>Fandom Changes Lives</h1></td>
    <td>
  <p>This might sound a little maudlin, but fandom changes people's lives.
    Britta had a nice way of putting it, that for some young women fandom is a secret seminar in feminism, and it can be life-changing.

    </p><p>For other fans, it has that same power when it comes to embracing sexual identity, and gender, or even discovering there's such a thing as gender identity to begin with.  There are some brilliant minds in fandom, and they help one another grow.

    </p><p>For a lot of people, fandom is their happy place.  It's an area of their life where they can contribute, be active, feel connected to others, and simply have a good time.   We're always told that the Internet is alienating; subcultures like fandom prove that the opposite is true.

    </p></td>
</tr>

<tr>
    <td><h1>But Wait There's More</h1>


   </td>
    <td>
  <p>I want to give a big 'hooray' and 'yay' to fandom, and encourage everybody to check out some sites where you can learn about fandom firsthand.

  </p><p><a href="http://fanlore.org">Fanlore</a> tells the fascinating history of fandom from their own perspective.</p>


  <p>The <a href="http://archiveofourown.org">Archive of Our Own (AO3)</a> is what Britta calls the 'friendliest damn open source project on the internet'. It's the only place that will train you to code from nothing if you want to contribute.

  </p><p><a href="http://dreamwidth.org">Dreamwidth</a> has created a fan-friendly and fan-run clone of LiveJournal, with many features that are useful to fans.

  </p><p>And of course every day you can see what's popular among the fandom crowd on the <a href="https://pinboard.in/popular/fandom">Pinboard fandom page</a>.

  </p><p>So thanks to all of you, and thanks to all the fans who made this talk possible! And if I've made any mistakes in this talk, please <a href="mailto:maciej@ceglowski.com">write to me</a> so I can correct them.</p>

  <br/><br/>

  <p>CONFUSED BUT REMARKABLY VIGOROUS APPLAUSE</p>
  </td>
</tr>


</table>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="http://idlewords.com/talks/fan_is_a_tool_using_animal.htm">Source originale</a> |
    <a href="/david/stream/2019/">Accueil du flux</a>
  </p>
</nav>

<footer>
  <div>
    <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
    <p>
      Bonjour/Hi!
      Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
      Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
    </p>
    <p>
      Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
    </p>
    
    <p>
      Voici quelques articles choisis :
      <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
      <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
      <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
      <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
      <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
      <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
      <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
      <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
      <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
      <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
      <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
      <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
      <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
      <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
      <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
      et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
    </p>
    <p>
      On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
    </p>
    <p>
      Je ne traque pas ta navigation mais mon
      <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
      conserve des logs d’accès.
    </p>
  </div>
</footer>
<script type="text/javascript">
  ;(_ => {
    const jumper = document.getElementById('jumper')
    jumper.addEventListener('click', e => {
      e.preventDefault()
      const anchor = e.target.getAttribute('href')
      const targetEl = document.getElementById(anchor.substring(1))
      targetEl.scrollIntoView({behavior: 'smooth'})
    })
  })()
</script>