418 lines
16 KiB
HTML
418 lines
16 KiB
HTML
<!doctype>
|
|
<html>
|
|
<head>
|
|
<link rel="stylesheet" type="text/css" href="puzzle.css">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Content... -->
|
|
<div id="content">
|
|
<div id="content_words"></div>
|
|
<div id="next">
|
|
<button onclick="nextLevel()">NEXT →</button>
|
|
</div>
|
|
<iframe id="content_puzzle" width="500" height="500"></iframe>
|
|
</div>
|
|
|
|
|
|
<!-- SLIDES -->
|
|
<slides>
|
|
<slide level="0_draw_whatever">
|
|
<h2>THE WISDOM and/or MADNESS of the CROWDS</h2>
|
|
Why is it that the <i>same</i> people, in <i>different</i> groups, can be kind, cruel, smart, stupid?
|
|
In this explorable explanation,
|
|
I'll show how the <i>network</i> of a group itself can shape the people caught in its web.
|
|
<br>
|
|
<br>
|
|
<b>
|
|
Draw a network of friends! <img class="icon" src="img/gray.png"/> →
|
|
When you're done playing around, press "next" ↘
|
|
</b>
|
|
</slide>
|
|
<slide level="1a_thresholds">
|
|
An example. On the right,
|
|
<img class="icon" src="img/yellow.png"/>
|
|
represent binge-drinkers, and
|
|
<img class="icon" src="img/gray.png"/>
|
|
represent non-binge-drinkers.
|
|
People look to their network of peers, to get a sense of how many of their friends do something.
|
|
<br><br>
|
|
(the number over their heads show what % of their friends, <i>not counting themselves</i>,
|
|
are binge-drinkers. #binge_drinking_friends/#friends)
|
|
<br><br>
|
|
<b>
|
|
Play around to get a feel of this!
|
|
Connect & disconnect people, and see how that changes their perception
|
|
of how many people do X →
|
|
</b>
|
|
</slide>
|
|
<slide level="1b_majority">
|
|
As important as friendships are, networks can <i>fool</i> people.
|
|
A 1991 study showed that “virtually all students reported that their friends drank more than they did”. (which, if you think about it, is logically impossible!)
|
|
In fact, it's possible to fool everyone that a majority of people do X, even if people who do X are in a minority:
|
|
<br><br>
|
|
<b>
|
|
Puzzle! Fool <i>everyone</i> into thinking 50% OR MORE of their
|
|
friends are binge-drinkers →
|
|
</b>
|
|
</slide>
|
|
<slide level="2a_sim">
|
|
But of course, networks don't just <i>fool</i> people, they also <i>change</i> people.
|
|
<b>"Contagions",</b> like beliefs and behaviors, spread from person to person through a network.
|
|
<br><br>
|
|
On the right, we start with one person
|
|
<img class="icon" src="img/red.png"/>
|
|
who believes a rumor. "Fake news", as the cool kids say.
|
|
Every day, that person will pass the lie on to their friends.
|
|
And they pass it on to <i>their</i> friends.
|
|
And so on.
|
|
<br><br>
|
|
<b>
|
|
Click START SIM to see the "contagion" spread
|
|
(note: for now, a person adopts a contagion if AT LEAST ONE
|
|
FRIEND does. we'll see other possibilities later) →
|
|
</b>
|
|
|
|
</slide>
|
|
<slide level="2b_simple_cascade">
|
|
Now, we have a bunch of small, separate communities.
|
|
<br><br>
|
|
<b>
|
|
Try to infect <i>everyone</i> with the rumor over time! <img class="icon" src="img/red.png"/>
|
|
(Feel free to just hit "start sim" and try out many different networks again and again)
|
|
→
|
|
</b>
|
|
(note: you can't cut the pre-existing connections)
|
|
</slide>
|
|
<slide>
|
|
(someting something compounding <b>cascade effect</b>, something something knocking 'em down
|
|
like ever-bigger dominos)
|
|
<br><br>
|
|
(something something about spread of madness through crowds, like
|
|
2008 financial crisis or mass speculation or mobs or riots or whatever)
|
|
</slide>
|
|
<slide level="3a_complex">
|
|
When an idea/behavior just needs a minimum of <i>one</i> friends to spread,
|
|
it's called a <b>"simple contagion"</b>.
|
|
However, some ideas are harder to grasp, some behaviors need more encouragement,
|
|
and so these need <i>multiple</i> friends to spread —
|
|
these are called <b>"complex contagions"</b>.
|
|
<br><br>
|
|
A false rumor <img class="icon" src="img/red.png"/> may be a simple contagion,
|
|
but the complicated truth <img class="icon" src="img/blue.png"/> is
|
|
a complex contagion.
|
|
(head shows #infected_friends/#friends)
|
|
<br><br>
|
|
<b>On the right, a complex contagion that needs 25% OR MORE friends to spread.
|
|
Play around to get a feel for it →
|
|
</b>
|
|
</slide>
|
|
<slide level="3b_complex_cascade">
|
|
<b>
|
|
Puzzle! Same as before, but now you have to spread a complex idea.
|
|
<img class="icon" src="img/blue.png"/>
|
|
(a person needs AT LEAST 25% of their friends to adopt the idea, before they do too)
|
|
Try "infecting" everyone now!
|
|
→
|
|
</b>
|
|
(again, feel free to hit "start sim" and just <i>try</i> a solution, as many times as you want)
|
|
</slide>
|
|
<slide level="3c_extinguish">
|
|
So, is that the way to spread more complex ideas/behaviors?
|
|
Just add <i>more</i> connections?
|
|
<br><br>
|
|
Well, no. While more connections can never hurt a <i>simple</i> contagion,
|
|
they can hurt <i>complex</i> contagions!
|
|
<br><br>
|
|
<b>
|
|
Puzzle! Same as before, but now, try to add to the network so it
|
|
<i>prevents</i> the spread of a complex contagion!
|
|
</b>
|
|
</slide>
|
|
<slide>
|
|
(something something about <b>groupthink</b>, how too many connections squashes
|
|
complex contagions due to conformity pressure. example: NASA and Challenger explosion)
|
|
</slide>
|
|
<slide level="4a_sweet_spot">
|
|
(something something about how if you have too FEW connections,
|
|
people are isolated and ideas can't spread
|
|
but if you have too MANY connections,
|
|
people are pressured by conformity and ideas can't grow.)
|
|
<br><br>
|
|
Top-left: too few connections, complex contagion doesn't spread to everyone.
|
|
Top-right: too many connections, complex contagion can't spread to everyone.
|
|
<br><br>
|
|
<b>
|
|
Make a small group network that's the sweet spot inbetween, and spreads the complex contagion
|
|
<img class="icon" src="img/blue.png"/>
|
|
to everyone →
|
|
</b>
|
|
</slide>
|
|
<slide level="4b_bridge">
|
|
Within-group friendships are called <b>"bonding social capital"</b>.
|
|
And you discovered, there's a sweet spot where people are connected enough
|
|
to spread a complex idea, but not so much conformity squashes it.
|
|
But how do ideas spread <i>between</i> groups?
|
|
Between-group friendships are called <b>"bridging social capital"</b>,
|
|
and, likewise, there's a sweet spot.
|
|
<br><br>
|
|
<b>
|
|
Create a group in the top-left (remember your sweet spot?)
|
|
and then create a bridge to spread the complex contagion to the other
|
|
group →
|
|
</b>
|
|
</slide>
|
|
<slide level="4c_small_world">
|
|
<b>FINAL PUZZLE! Now, do both! Create a bunch of bonded communities <i>and</i>
|
|
the bridges between them. →</b>
|
|
</slide>
|
|
<slide>
|
|
(something someting <b>Small World Network</b>,
|
|
something something "unity AND diversity", "e pluribus unum",
|
|
etc etc)
|
|
<br><br>
|
|
(happy ending or whatever)
|
|
</slide>
|
|
|
|
|
|
|
|
<!--slide level="1_majority" width="500" height="500">
|
|
Networks change people, because networks <i>fool</i> people.
|
|
There's a network paradox called the "Majority Illusion",
|
|
where, even though the majority of people in a group don't do X,
|
|
the majority of everyone's <i>friends</i> do X!
|
|
<br><br>
|
|
<b>
|
|
Draw a network that fools <i>everyone</i> into thinking
|
|
that <i>half or more</i> of their friends are binge-drinkers
|
|
<img class="icon" src="img/yellow.png"/>
|
|
→
|
|
</b>
|
|
<br><br>
|
|
When you solve it, press "next" ↓
|
|
</slide>
|
|
<slide>
|
|
Just like how you see the earth as flat because you're <i>on</i> it,
|
|
people can get wrong ideas about society because they're <i>in</i> it.
|
|
<br><br>
|
|
But, you may ask, it can't <i>all</i> be about the network of a group —
|
|
what about culture, information, ideology? And you'd be correct!
|
|
But if ideas flow from person to person, they have to flow through <i>something</i> —
|
|
and ideas flow through the pipes of social connections, arranged in a network.
|
|
</slide>
|
|
<slide level="2_simple_contagion" width="500" height="500">
|
|
So, let's explore that idea.
|
|
To your left, there's just one person
|
|
<img class="icon" src="img/red.png"/>
|
|
who has some information.
|
|
Some <i>mis</i>information. "Fake news", as the cool kids say.
|
|
And every day, that person will pass the lie on to their friends.
|
|
And they'll pass it on to <i>their</i> friends.
|
|
And so on.
|
|
<br><br>
|
|
<b>
|
|
Draw a network so that eventually <i>everyone</i> gets infected with the lie!
|
|
<img class="icon" src="img/red.png"/>
|
|
(note: dark-black lines can't be erased)
|
|
Click "start sim" and "next step" to move the sim forward →
|
|
</b>
|
|
</slide>
|
|
<slide>
|
|
So far, I've said nothing really that new.
|
|
People live in social networks, and sometimes ideas (even wrong ideas) go "viral".
|
|
Old news, so what?
|
|
<br><br>
|
|
But there's a new recent finding in network science, that few people know about
|
|
but more should. Almost all viruses and day-to-day information act as what is called
|
|
<b>"simple contagions":</b> you only need <i>one</i> contact to catch it and spread it.
|
|
</slide>
|
|
<slide level="3_complex_contagion" width="500" height="500">
|
|
But it turns out, the spread of <i>complicated ideas</i> and <i>actual behavior</i> act more like
|
|
<b>"complex contagions":</b> you need <i>more than some % of your friends</i> to be
|
|
"infected" before you too can be "infected".
|
|
(And the more complex the new idea/behavior, the higher the threshold for % of friends
|
|
needed to spread the contagion)
|
|
<br><br>
|
|
<b>
|
|
People are now more skeptical.
|
|
They only believe a rumor when 1/3 or more of their friends believe it.
|
|
<img class="icon" src="img/red.png"/>
|
|
Try to infect everyone <i>now</i>. →
|
|
</b>
|
|
</slide>
|
|
<slide>
|
|
This kind of behavior is called an <b>information cascade</b>,
|
|
which can explain crowd madnesses like the 2008 housing bubble.
|
|
Risky investment may be thought of as a "complex contagion" —
|
|
you won't dive in if just <i>one</i> other friend does...
|
|
but you may consider it if a significant % of your friends do.
|
|
<br><br>
|
|
And as you saw before, <i>even with a higher level of skepticism</i>,
|
|
bad information and behaviors can still drive a crowd to madness.
|
|
</slide>
|
|
<slide level="4_simple_group" width="500" height="500">
|
|
Okay, you may say, so "complex contagions" are just "simple contagions",
|
|
but tougher. Not quite. Let's look at the next two puzzles...
|
|
this time, about the spread of <i>good</i> ideas!
|
|
|
|
<br><br>
|
|
Here's a team of six people.
|
|
<i>Any one</i> of them could come up with a brilliant idea.
|
|
(note: here, the idea is a "simple contagion" — you just need one "infected" friend)
|
|
|
|
<br><br>
|
|
<b>
|
|
Connect the peeps so that a new idea,
|
|
<img class="icon" src="img/blue.png"/>
|
|
from any person, spreads to everyone else
|
|
in ONE turn. →
|
|
</b>
|
|
|
|
</slide>
|
|
<slide>
|
|
Of course, just connect everyone to everyone else!
|
|
When everyone's connected, ideas can flow as freely as dysentery.
|
|
<br><br>
|
|
Simple contagions are simple ideas, clickbait, the kind of stuff you'd happily and easily share.
|
|
But now, let's ask — what if the idea was a <i>complex contagion?</i>
|
|
Complex contagions are complex ideas, tough questions, actions that take actual effort...
|
|
</slide>
|
|
<slide level="5_complex_group" width="500" height="500">
|
|
|
|
Same puzzle as before. But now, the (complex) idea will only spread to a person
|
|
if 1/6 or more of their friends believe it.
|
|
|
|
<br><br>
|
|
<b>
|
|
Connect the peeps so that a new idea,
|
|
<img class="icon" src="img/blue.png"/>
|
|
from any person, will <i>NOT</i> spread to everyone else.
|
|
→
|
|
</b>
|
|
|
|
</slide>
|
|
<slide>
|
|
...Of course. Just connect everyone to everyone else.
|
|
When everyone's connected, conformity takes over, and squashes any complex, hard-to-swallow ideas.
|
|
<br><br>
|
|
This can explain moments of <b>groupthink</b>, like the Space Shuttle <i>Challenger</i> explosion,
|
|
which killed 7 people.
|
|
NASA, a team of smart individuals — literally rocket scientists —
|
|
failed to prevent the disaster caused by <i>cold weather</i>,
|
|
and <i>despite</i> multiple warnings from the engineers to the managers that this would happen.
|
|
</slide>
|
|
<slide>
|
|
And <i>that's</i> the most profound difference between simple and complex contagions.
|
|
What works for simple contagions,
|
|
can be <i>terrible</i> for complex contagions.
|
|
<br><br>
|
|
You're using the internet to read this.
|
|
Long ago, a lot of us thought "connect everyone to everyone"
|
|
would unleash the wisdom of the crowds!
|
|
And in many cases, it did!
|
|
But, more often, it releases the madness of crowds.
|
|
"Connect everyone" create conditions to spread simple contagions,
|
|
but creates echo chambers that crush complex contagions.
|
|
</slide>
|
|
<slide>
|
|
So... what now?
|
|
<br><br>
|
|
All this time I've been making you create networks that <i>hurt</i> people.
|
|
Now, let's see how you can make networks that <i>help</i> people!
|
|
</slide>
|
|
<slide level="6_depolarization" width="500" height="500">
|
|
Let's say we're got a polarized society — between two classes, or cultures,
|
|
or political identities, whatever.
|
|
<img class="icon" src="img/purple.png"/>
|
|
<img class="icon" src="img/green.png"/>
|
|
Like in the first puzzle,
|
|
everyone's fooled into thinking their own type is in the majority —
|
|
actually, not just majority, but <i>entirety</i>.
|
|
<br><br>
|
|
<b>
|
|
Connect them so that, for each person,
|
|
<i>75% to 95%</i> of their friends
|
|
are similar to them. →</b>
|
|
<br>
|
|
Enough similar friends to have a sense of identity,
|
|
but enough dissimilar friends so they're not <i>just</i> their identity.
|
|
</b>
|
|
</slide>
|
|
<slide>
|
|
Nice! Notice you have two main "kinds" of connections here:
|
|
within-group and between-group connections — also known as
|
|
<b>bonding</b> and <b>bridging</b> social capital.
|
|
<br><br>
|
|
A healthy society needs both.
|
|
If people <i>only</i> bond within their groups, you get insular tribes.
|
|
If people <i>only</i> bond outside their groups, you have no strong communities.
|
|
</slide>
|
|
<slide level="7_reintegrate" width="500" height="500">
|
|
So far, we've only been looking at cases
|
|
with just one "contagion". But what if you have two <i>competing</i> contagions?
|
|
<br><br>
|
|
Here, we have a simulation of opioid users
|
|
<img class="icon" src="img/yellow.png"/>
|
|
and non-opioid users.
|
|
<img class="icon" src="img/gray.png"/>
|
|
And let's say that the odds are stacked <i>against</i> non-users.
|
|
If <i>2/3 or more</i> of a user's friends are non-users, they'll quit.
|
|
But, if just <i>1/3 or more</i> of a non-user's friends are users, they'll start using.
|
|
<br><br>
|
|
<b>
|
|
Create a network that helps get <i>everybody</i> to quit. →
|
|
</b>
|
|
|
|
</slide>
|
|
<slide>
|
|
If you only connected the non-users to the users (bridging)
|
|
but without connecting the non-users to each other first (bonding),
|
|
you'd end up with <i>everyone</i> using.
|
|
<br><br>
|
|
The answer, as you found once again, was to have <i>both</i>
|
|
bonding <i>and</i> bridging connections! Interesting...
|
|
<br><br>
|
|
Okay. One last, final puzzle...
|
|
</slide>
|
|
<slide level="8_complex_filter" width="500" height="500">
|
|
Sometimes, an idea is counterintuitive because it's genuinely revolutionary.
|
|
Other times, an idea is counterintuitive because it's just bull<span style="background:#000">fuck</span>.
|
|
<br><br>
|
|
How can we create a society with a <i>healthy</i> amount of skepticism?
|
|
<b>
|
|
Create a network that allows contagions with a 25%-or-more-of-friends threshold to pass to everyone,
|
|
<img class="icon" src="img/blue.png"/>
|
|
but NOT allow contagions with a 33%-or-more-of-friends threshold to pass to everyone.
|
|
<img class="icon" src="img/red.png"/>
|
|
→
|
|
</b>
|
|
<br>
|
|
(remember: bonding & bridging...)
|
|
</slide>
|
|
<slide>
|
|
Ta-da! And that's how you can maximize the wisdom of crowds,
|
|
while minimizing the madness of crowds — a healthy balance
|
|
of bonding <i>and</i> bridging.
|
|
<br><br>
|
|
So the next time you're horrified by how cruel or stupid people are acting,
|
|
have humility, for we can all be swept up by mad crowds.
|
|
But also, have hope, for we can all be swept up by wise crowds, too.
|
|
<br><br>
|
|
The question then is: what crowds will <i>you</i> connect with?
|
|
</slide>
|
|
<slide>
|
|
<i>
|
|
“The great triumphs and tragedies of history are caused,
|
|
not by people being fundamentally good or fundamentally bad,
|
|
but by people being fundamentally people.”
|
|
</i>
|
|
<br>
|
|
~<i>Good Omens</i>, by Neil Gaiman & Terry Pratchett
|
|
<br><br>
|
|
<b>THE END</b>
|
|
</slide-->
|
|
</slides>
|
|
|
|
</body>
|
|
</html>
|
|
<script src="puzzle.js"></script> |