-
Notifications
You must be signed in to change notification settings - Fork 99
/
nl.html
1691 lines (1352 loc) · 53.7 KB
/
nl.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!--
THE WISDOM AND/OR MADNESS OF CROWDS
by Nicky Case | apr 2018
- - - - - - - - - - -
FAN TRANSLATION GUIDE:
https://github.com/ncase/crowds#how-to-translate-this-thing
Hello fan-translaters! Thank you so, so much for your help.
I hope you know what you've gotten yourself into.
There's about 3600+ WORDS to translate, including
the Bonus Boxes and References.
To make things easier (or less painful, anyway) I've marked
what needs to be translated and how with big "TRANSLATE" comments.
Ctrl+F for "TRANSLATE" in uppercase to see what needs to be translated!
BUT BEFORE YOU TRANSLATE ANYTHING, DO THIS:
1) Look up the two-letter code of the language you're translating to:
https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
2) *COPY* index.html, and name the copy [two-letter-code].html
For example: de.html, ar.html, zh.html, etc...
3) Translate *THAT* page. Do NOT modify the original index.html!
And once you're done, go to "translations.txt", and follow the
instructions there to let this game "know" your translation exists.
Good luck, and thanks again!
<3,
~ Nicky Case
-->
<!DOCTYPE html>
<html lang="nl">
<head>
<!-- Meta Info -->
<title>De Wijsheid en/of Waanzin van Groepen</title> <!-- <title>(TRANSLATE this part only)</title> -->
<meta name="description" content="een interactieve gids voor sociale netwerken"/> <!-- content="(TRANSLATE this part only)" -->
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<meta charset="utf-8">
<link rel="icon" type="image/png" href="favicon.png">
<link rel="alternate" href="http://ncase.me/crowds/" hreflang="en">
<link rel="alternate" href="http://ncase.me/crowds/cs.html" hreflang="cs">
<link rel="alternate" href="http://ncase.me/crowds/de.html" hreflang="de">
<link rel="alternate" href="http://ncase.me/crowds/es.html" hreflang="es-ES">
<link rel="alternate" href="http://ncase.me/crowds/fr.html" hreflang="fr">
<link rel="alternate" href="http://ncase.me/crowds/it.html" hreflang="it">
<link rel="alternate" href="http://ncase.me/crowds/ja.html" hreflang="ja">
<link rel="alternate" href="http://ncase.me/crowds/pt.html" hreflang="pt">
<link rel="alternate" href="http://ncase.me/crowds/ru.html" hreflang="ru">
<link rel="alternate" href="http://ncase.me/crowds/uk.html" hreflang="uk">
<link rel="alternate" href="http://ncase.me/crowds/vi.html" hreflang="vi">
<link rel="alternate" href="http://ncase.me/crowds/zh-CN.html" hreflang="zh-CN">
<link rel="alternate" href="http://ncase.me/crowds/zh-TW.html" hreflang="zh-TW">
<!-- Sharing -->
<meta itemprop="name" content="De Wijsheid en/of Waanzin van Groepen"> <!-- content="(TRANSLATE this part only)" -->
<meta itemprop="description" content="een interactieve gids voor sociale netwerken"> <!-- content="(TRANSLATE this part only)" -->
<meta itemprop="image" content="http://ncase.me/crowds/social/thumb.png">
<meta name="twitter:title" content="De Wijsheid en/of Waanzin van Groepen"> <!-- content="(TRANSLATE this part only)" -->
<meta name="twitter:description" content="een interactieve gids voor sociale netwerken"> <!-- content="(TRANSLATE this part only)" -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@ncasenmare">
<meta name="twitter:creator" content="@ncasenmare">
<meta name="twitter:image" content="http://ncase.me/crowds/social/thumb.png">
<meta property="og:title" content="De Wijsheid en/of Waanzin van Groepen"> <!-- content="(TRANSLATE this part only)" -->
<meta property="og:description" content="een interactieve gids voor sociale netwerken"> <!-- content="(TRANSLATE this part only)" -->
<meta property="og:type" content="website">
<meta property="og:url" content="http://ncase.me/crowds/">
<meta property="og:image" content="http://ncase.me/crowds/social/thumb.png">
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="css/index.css?v=7">
</head>
<body>
<!-- THE SLIDESHOW -->
<div id="container">
<!-- Simulation(s) in background -->
<div id="simulations_container">
<div id="simulations"></div>
</div>
<!-- Slideshow: words & buttons -->
<div id="slideshow_container">
<div id="slideshow"></div>
</div>
<!-- Scratch Transition -->
<canvas id="scratch" width="711" height="400"></canvas>
<!-- Skip -->
<div id="skip">overslaan ></div> <!-- TRANSLATE -->
<!-- Modal -->
<div id="modal_container">
<div id="modal_bg"></div>
<div id="modal">
<div id="modal_close">?</div>
<div id="modal_content_container">
<div id="modal_content"></div>
</div>
</div>
</div>
</div>
<!-- Navigation: Audio, Contents, Share, Translations -->
<div id="navigation_container">
<div id="sound" mute="no">
<div id="sound_icon"></div>
<span id="sound_on">AAN</span> <!-- TRANSLATE -->
<span id="sound_off">UIT</span> <!-- TRANSLATE -->
</div>
<div id="sharing">
<a id="fb" target="_blank" href="TODO"></a>
<a id="tw" target="_blank" href="TODO"></a>
<a id="em" target="_blank" href="TODO"></a>
<span id="share_title">
De Wijsheid en/of Waanzin van Groepen <!-- TRANSLATE -->
</span>
<span id="share_desc">
<!-- TRANSLATOR: keep this on ONE LINE or the social sharing will break! -->
Waarom gedragen groepen mensen zich slim, dom, vriendelijk of gemeen? Een interactieve gids voor sociale netwerken: <!-- TRANSLATE -->
</span>
</div>
<div id="navigation">
<!-- The chapters -->
<!-- TRANSLATE all the Chapter names! -->
<div chapter="Introduction">
<span>0</span>
<span>0. Introductie</span>
</div>
<div chapter="Networks">
<span>1</span>
<span>1. Verbindingen</span>
</div>
<div chapter="Simple">
<span>2</span>
<span>2. Infecties</span>
</div>
<div chapter="Complex">
<span>3</span>
<span>3. Complexe Infecties</span>
</div>
<div chapter="BB">
<span>4</span>
<span>4. Verbinden & Overbruggen</span> <!-- note: & is html for the "and" sign -->
</div>
<div chapter="SmallWorld">
<span>5</span>
<span>5. Het is een kleine wereld</span>
</div>
<div chapter="Conclusion">
<span>6</span>
<span>6. Dus...</span>
</div>
<div chapter="Credits">
<span>7</span>
<span>7. Met dank aan</span>
</div>
<div chapter="Sandbox">
<span>?</span>
<span>? Experimentele Modus! ?</span>
</div>
<!-- A divider -->
<span class="nav_divider"></span>
<!-- Bonus Notes & References -->
<div modal="bonus">
<span>?</span>
<span>Extra Boxen!</span> <!-- TRANSLATE -->
</div>
<div modal="references">
<span style="margin-top: 7px; font-size: 35px;">*</span>
<span>Links & Referenties</span> <!-- TRANSLATE -->
</div>
<div modal="translations">
<span style="margin-top:5px; position:relative;"><span style="
position: absolute;
top: -8px;
left: 6px;
">A</span><span style="
position: absolute;
font-size: 16px;
top: -1px;
left: 16px;
">?</span></span>
<span>Vertalingen</span> <!-- TRANSLATE -->
</div>
<!-- The hover bubble -->
<span id="nav_bubble"></span>
</div>
<div id="translations"></div>
<div id="social"></div>
</div>
<!-- The Pencil -->
<div id="pencil_container">
<canvas id="pencil"></canvas>
</div>
<!-- Preloader -->
<div id="pre_preloader">
<div>aan het laden...</div> <!-- TRANSLATE -->
</div>
</body>
</html>
<!-- - - - - -->
<!-- SCRIPTS -->
<!-- - - - - -->
<script src="js/lib/helpers.js"></script>
<script src="js/lib/inobounce.js"></script>
<script src="js/lib/minpubsub.src.js"></script>
<script src="js/lib/howler.min.js"></script>
<script src="js/lib/Key.js"></script>
<script src="js/lib/Mouse.js"></script>
<script src="js/lib/Sprite.js"></script>
<script src="js/slideshow/Slideshow.js"></script>
<script src="js/slideshow/Pencil.js"></script>
<script src="js/slideshow/Boxes.js"></script>
<script src="js/slideshow/Scratch.js"></script>
<script src="js/slideshow/Navigation.js"></script>
<script src="js/slideshow/SimUI.js"></script>
<script src="js/slideshow/SandboxUI.js"></script>
<script src="js/slideshow/Modal.js?v=5"></script>
<script src="js/slideshow/Preloader.js"></script>
<script src="js/slideshow/Translations.js?v=5"></script>
<script src="js/sim/Peep.js?v=2"></script>
<script src="js/sim/Connection.js"></script>
<script src="js/sim/ConnectorCutter.js"></script>
<script src="js/sim/Simulations.js"></script>
<script src="js/chapters/A_Preloader.js"></script>
<script src="js/chapters/B_Introduction.js"></script>
<script src="js/chapters/C_Networks.js"></script>
<script src="js/chapters/D_Simple_Contagion.js"></script>
<script src="js/chapters/E_Complex_Contagion.js"></script>
<script src="js/chapters/F_Bonding_And_Bridging.js"></script>
<script src="js/chapters/G_Small_World.js"></script>
<script src="js/chapters/H_Conclusion.js"></script>
<script src="js/chapters/I_Credits.js"></script>
<script src="js/chapters/J_Sandbox.js?v=2"></script>
<script src="js/main.js"></script>
<!-- - - - - - - - - - - - -->
<!-- THE SLIDESHOW'S WORDS -->
<!-- - - - - - - - - - - - -->
<!--
This is the bulk of what you need to TRANSLATE!
Translate just the text that's within the <tag></tags>
If you're using a code editor (like Sublime Text https://www.sublimetext.com/),
it should automatically highlight what the text is (usually in white).
-->
<span style="display:none">
<!-- Preloader -->
<words id="preloader_title">
<div style="font-size: 30px;">
<span>de</span>
<br>
<span style="font-size: 60px;letter-spacing: 4px;">WIJSHEID</span>
<span style="position:relative;top: -10px;">en/of</span>
<span style="font-size: 60px;">WAANZIN</span>
<br>
<span style="position: relative;top: -11px;">van</span>
<br>
<span style="font-size: 100px;line-height: 80px;position: relative;top: -15px; display:block;">GROEPEN</span>
</div>
<div style="color:#999;font-size: 18px;">
<!-- TRANSLATE note: comment out the line below... -->
<!-- speeltijd: 30 min ï gemaakt door nicky case, april 2018 -->
<!-- ...and UN-comment + TRANSLATE this line! -->
gemaakt door nicky case & vertaald door Sjanne van der Stappen met hulp van Esra de Groot
</div>
</words>
<words id="preloader_button">
<next></next>
</words>
<words id="preloader_loading">
aan het laden...
</words>
<words id="preloader_play">
laten we beginnen! <div class="rarr"></div>
</words>
<!-- Introduction -->
<!--
TRANSLATE note: to make the text stay in a circle, I added lots of <br> breaks.
You may have to re-arrange the <br>'s in order to do your translation.
It shouldn't look too bad if they're slightly off, though!
Also, <b></b> bolds a word/phrase, and <i></i> italicizes a word/phrase.
-->
<words id="intro">
<br><br>
Sir Isaac Newton was er vrij zeker van dat hij
<br>
een knappe kop was. Nadat hij de wiskunde en een zwaartekrachttheorie
<br>
had uitgevonden, zou hij toch slim genoeg moeten zijn
<br>
om geld te investeren? Hoe dan ook, om een lang verhaal
<br>
kort te maken, verloor hij $4.600.000 (huidige dollarwaarde) in de
<br>
nationale speculatie gekte genaamd de South Sea Bubble van 1720.
<br><br>
Zoals Dhr. Newton later zei: <i>"Ik kan de beweging van hemel-
<br>
lichamen berekenen, maar niet de waanzin van mensen."</i>
<next>tja, jammer voor hem <div class="rarr"></div> </next>
</words>
<words id="intro_2">
<div style="height:0.5em"></div>
Dat is natuurlijk niet de enige
<br>
tijd waarin markten, instellingen of hele
<br>
democratieÎn doorsloegen — de <i>waanzin</i> van
<br>
groepen. En toch, juist wanneer je de hoop in de mensheid
<br>
verliest, zie je inwoners samenwerken om elkaar te redden bij
<br>
wervelstormen, gemeenschappen oplossingen creÎren voor problemen,
<br>
mensen vechten voor een betere wereld — de <i>wijsheid</i> van groepen!
<div style="height:0.9em"></div>
<b>Maar <i>waarom</i> veranderen sommige groepen in waanzin, of wijsheid?</b>
<br>
Geen theorie kan alles verklaren, maar ik denk dat een nieuw
<br>
onderzoeksgebied, de <b>wetenschap van netwerken</b>, ons kan leiden!
<br>
Het kernidee is: om groepen te begrijpen, moeten we niet naar
<br>
<i>losse individuen</i> kijken, maar naar...
<next>...hun <i>verbindingen.</i> <div class="rarr"></div> </next>
</words>
<!-- Networks -->
<words id="networks_tutorial_start">
<b>Laten we een netwerk tekenen!</b>
Elke verbinding staat voor een vriendschap tussen twee mensen:
</words>
<words id="networks_tutorial_connect">
teken om te verbinden
</words>
<words id="networks_tutorial_disconnect">
doorkras om te verbreken
</words>
<words id="networks_tutorial_end">
als je klaar bent met krabbelen en tekenen,
<next wiggle>klik hier om verder te gaan <div class="rarr"></div> </next>
</words>
<words id="networks_threshold">
Nu worden sociale verbindingen voor meer gebruikt dan alleen het maken van mooie tekeningen.
Mensen <i>kijken naar</i> hun sociale verbindingen om hun wereld te begrijpen.
Bijvoorbeeld, mensen kijken naar hun leeftijdsgenoten om uit te zoeken
<b>welk % van hun vrienden (exclusief zijzelf)</b>
erg veel alcohol drinkt. <icon name="yellow"></icon>
</words>
<words id="networks_threshold_instruction">
<b>Teken/verwijder verbindingen, en kijk wat er gebeurt! <div class="rarr"></div> </b>
</words>
<words id="networks_threshold_end">
<next>cool, ik snap het</next>
</words>
<words id="networks_pre_puzzle">
Desalniettemin kan een netwerk mensen <i>foppen</i>.
Precies zoals de aarde plat lijkt omdat we erop staan,
kunnen mensen onjuiste ideeÎn over de maatschappij krijgen omdat ze er <i>midden in</i> zitten.
</words>
<words id="optional_reading">
<div style="position:absolute; top:5px;">
<i>optionele</i> extra aantekeningen! ↑
</div>
<div style="position:absolute; left:216px; top:10px;">
↓ links en referenties
</div>
</words>
<words id="networks_pre_puzzle_2">
<bon id="books"></bon>
<br>
Een onderzoek<ref id="drunk"></ref> uit 1991 liet bijvoorbeeld zien dat
"vrijwel alle [universiteits]studenten aangaven dat hun vrienden meer dronken dan zij deden."
Maar dat lijkt onmogelijk!
Hoe kan dat nou?
Nou, je gaat het antwoord zodadelijk zelf uitvinden, door het tekenen van een netwerk.
Het is tijd om...
<next>IEDEREEN TE FOPPEN <div class="rarr"></div> </next>
</words>
<words id="networks_puzzle">
<b style="font-size:2em">PUZZEL TIJD!</b>
<br>
Fop <i>iedereen</i> zodat ze denken dat
de meerderheid van hun vrienden (50% of meer, de drempelwaarde) meer drinken dan zij <icon name="yellow"></icon>
(terwijl de stevige drinkers in de minderheid zijn!)
</words>
<words id="networks_puzzle_metric">
<b>GEFOPT:</b>
</words>
<words id="networks_puzzle_metric_2">
van de 9 mensen
</words>
<words id="networks_puzzle_end">
Gefeliciteerd! Je hebt een groep studenten laten geloven
in de aanwezigheid van een ongelofelijk ongezonde sociale norm! Goed bezig!
<next wiggle>...uh. bedankt?</next>
</words>
<words id="networks_post_puzzle">
Wat je zojuist gemaakt hebt wordt De Illusie van de Meerderheid genoemd<ref id="majority"></ref>,
wat ook verklaart waarom mensen denken dat hun politieke voorkeur een consensus is,
of waarom extremisme gebruikelijker lijkt dan het eigenlijk is.
<i>Waanzin.</i>
<bon id="connections"></bon>
Maar mensen <i>observeren</i> niet alleen passief ideeÎn en gedrag van anderen,
ze <i>doen</i> ze actief <i>na</i>.
Laten we daarom gaan kijken naar iets dat netwerk onderzoekers noemen...
<next>ìInfecties!î <div class="rarr"></div> </next>
</words>
<!-- Simple Contagions -->
<words id="simple_simple">
<i>Laten we voor nu het "drempelwaarde" ding parkeren.</i>
Hieronder hebben we een persoon <icon name="red"></icon> met informatie.
<i>Incorrecte</i> informatie. "Nepnieuws", zoals de coole mensen het noemen.
En deze persoon verspreidt elke dag de roddel onder zijn vrienden, zoals een virus.
En zij vertellen het aan <i>hun</i> vrienden. Ga zo maar door.
<br>
<b>
Start de simulatie! <div class="darr"></div>
(p.s: je kunt niet tekenen <i>tijdens</i> dat de simulatie bezig is)
</b>
</words>
<words id="simple_simple_2">
Opmerking: ondanks de negatieve benaming, kunnen "infecties" goed of slecht zijn (of neutraal of ambigu).
Er is sterk statistisch bewijs<ref id="contagion"></ref> dat
roken, gezondheid, geluk, stemvoorkeuren en niveaus van samenwerken
allemaal "besmettelijk" zijn -
en er is zelfs bewijs dat zelfmoord<ref id="suicides"></ref> en massale schietpartijen<ref id="shootings"></ref> dat ook zijn.
</words>
<words id="simple_simple_end">
<next wiggle>nou dat is deprimerend <div class="rarr"></div> </next>
</words>
<words id="simple_cascade">
Dat is het inderdaad.
Hoe dan ook, <b>TIJD OM TE PUZZELEN!</b>
<br>
Teken een netwerk & start de simulatie,
zodat <i>iedereen</i> besmet wordt met de "infectie".
<br>
(nieuwe regel: je kunt de <i>dikke</i> verbindingen niet doorkrassen)
</words>
<words id="simple_cascade_end">
<next wiggle>fan-tas-tisch <div class="rarr"></div> </next>
</words>
<words id="simple_post_cascade">
Deze waanzin-verspreiding wordt een <b>"informatie cascade"</b> genoemd.
Dhr. Newton viel voor zo'n cascade in 1720.
FinanciÎle instituten in de hele wereld vielen voor zo'n cascade in 2008.<ref id="subprime"></ref>
<br><br>
Toch <i>is deze simulatie onjuist.</i>
De meeste ideeÎn worden <i>niet</i> als virussen verspreid.
Aan veel overtuigingen en gedrag moet je meer dan een keer "blootgesteld" worden
voordat je "geÔnfecteerd" bent.
Dus hebben netwerk onderzoekers een nieuwe, betere manier bedacht
om te beschrijven hoe ideeÎn/gedrag zich verspreidt, en ze noemen het...
<next wiggle>ì<i>Complexe</i> Infecties!î <div class="rarr"></div> </next>
</words>
<!-- Complex Contagions -->
<words id="complex_complex">
Laten we de "drempelwaardes" en het stevige-drinkersvoorbeeld <icon name="yellow"></icon> opnieuw bekijken!
Toen je het de eerste keer speelde, veranderden de personen hun gedrag niet.
<br><br>
Nu gaan we kijken wat er gebeurt als mensen beginnen met drinken
<i>zodra 50%+ van hun vrienden dat doet!</i>
<b>Bedenk, voordat je de simulatie start, wat er <i>zou moeten</i> gebeuren.</b>
<br><br>
<b>Start nu de simulatie en zie wat er echt gebeurt! <div class="rarr"></div> </b>
</words>
<words id="complex_complex_2">
<span style="line-height:1.3em; display:block;">
Anders dan in de eerdere "nepnieuws" <icon name="red"></icon> infectie,
verspreidt deze infectie <icon name="yellow"></icon> zich <i>niet</i> naar iedereen!
De eerste paar mensen worden "geÔnfecteerd", want ondanks het feit dat ze slechts aan ÈÈn stevige drinker
blootgesteld zijn, is die stevige drinker 50% van hun vrienden. (jup, ze zijn eenzaam)
Daarentegen wordt de persoon aan het einde van de keten <i>niet</i> "geÔnfecteerd",
want ondanks dat ze blootgesteld zijn aan een stevige drinker,
gaan ze niet over de 50%+ drempelwaarde.
<div style="height:0.75em"></div>
Het <i>relatieve</i> % "geÔnfecteerde" vrienden is van belang.
<i>Dat</i> is het verschil tussen de <b>complexe infectie</b> theorie<ref id="complex"></ref>,
en onze naÔeve het-verspreidt-als-een-virus <b>simpele infectie</b> theorie.
(je kunt zeggen dat "simpele infecties" gewoon infecties zijn met een "meer dan 0%" drempelwaarde voor infectie)
<div style="height:0.75em"></div>
Infecties zijn echter niet persÈ slecht —
dus genoeg over de <i>waanzin</i> van groepen, hoe zit het met de...
<next>...<i>wijsheid</i> van groepen?</next>
</span>
</words>
<words id="complex_complex_3">
Hier hebben we een persoon <icon name="blue"></icon> die als vrijwilliger... Geen idee,
mensen redt in wervelstormen, of bijles geeft aan kansarme kinderen in zijn lokale samenleving, of iets anders cools.
Het punt is, dat het een "goede" complexe infectie is.
Laten we deze keer echter zeggen dat de drempelwaarde maar 25% is —
mensen willen wel vrijwilliger worden, maar alleen als 25% of meer van hun vrienden ook vrijwilliger is.
Tja, welwillendheid heeft een beetje sociale aanmoediging nodig.
<br><br>
<b>← "Infecteer" iederen met de goede voornemens!</b>
</words>
<words id="complex_complex_3_end">
<span style="line-height:1.3em; display:block;">
<b>OPMERKING:</b> Vrijwilliger zijn is maar <i>een</i> van vele complexe infecties!
Andere zijn bijvoorbeeld: opkomst bij verkiezingen, leefstijl gewoontes,
je eigen overtuigingen uit te dagen,
de tijd nemen om een probleem goed te begrijpen — alles
waarvoor meer dan ÈÈn "blootstelling" nodig is.
Complexe infecties zijn niet <i>persÈ</i> verstandig,
maar verstandig zijn is een complexe infectie.
<div style="height:0.75em"></div>
(Wat is dan een voorbeeld van een <i>simpele</i> infectie in het dagelijks leven?
Meestal kleine feitjes, zoals "een buidelrat heeft 13 tepels"<ref id="possum"></ref>)
<bon id="contagions"></bon>
Om <i>echt</i> de kracht en gekheid van complexe infecties te laten zien, gaan we opnieuw kijken naar...
<next>...een eerdere puzzel <div class="rarr"></div> </next>
</span>
</words>
<words id="complex_cascade">
Herinner je dit nog? Deze keer, met een <i>complexe</i> infectie <icon name="blue"></icon>, wordt het iets moeilijker...
<br>
<b>Probeer iedereen te "infecteren" met complexe wijsheid! <div class="darr"></div></b>
</words>
<words id="complex_cascade_feel_free">
(voel je vrij om op "start" te klikken en zoveel oplossingen te <i>proberen</i> als je wil)
</words>
<words id="complex_cascade_end">
<next wiggle>COOL <div class="rarr"></div> </next>
</words>
<words id="complex_post_cascade">
Nou zou je kunnen denken dat je gewoon verbindingen moet blijven toevoegen om een infectie te verspreiden,
"complexe" of "simpele", goede of slechte, wijze of gekke.
Maar is dat wel zo? Laten we opnieuw kijken naar...
</words>
<words id="complex_post_cascade_end">
<next wiggle>...een andere eerdere puzzel <div class="rarr"></div> </next>
</words>
<words id="complex_prevent">
Als je op "start" klikt, zal de complexe infectie <icon name="blue"></icon> naar iedereen verspreiden.
Dat is geen verrassing.
Maar laten we nu het <i>tegenovergestelde</i> doen van alles dat we eerder gedaan hebben:
<b>teken een netwerk om te <i>voorkomen</i> dat de infectie zich naar iedereen verspreidt! <div class="darr"></div></b>
</words>
<words id="complex_prevent_2">
Zie je dat?
Terwijl meer verbindingen altijd zullen helpen om <i>simpele</i> ideeÎn te verspreiden,
<b>kunnen meer verbindingen de verspreiding van <i>complexe</i> ideeÎn schaden!</b>
(dit zet je aan het denken over het internet, he?)
En dit is niet alleen een theoretisch probleem. Dit kan een zaak van leven...
</words>
<words id="complex_prevent_end">
<next wiggle>...of dood zijn. <div class="rarr"></div> </next>
</words>
<words id="complex_groupthink">
De mensen bij NASA zijn knappe koppen.
Ik bedoel maar, ze gebruikten Newtons theorieÎn om ons naar de maan te krijgen.
Hoe dan ook, om een lang verhaal kort te maken,
lanceerden ze in 1986, <i>ondanks waarschuwingen van de technici</i>,
de <i>Challenger</i>,
die ontplofte en 7 mensen doodde.
De directe oorzaak:
het was te koud die ochtend.
<div style="height:0.9em"></div>
De indirecte oorzaak: de managers negeerden de waarschuwingen van de technici.
Waarom? Vanwege <b>groepsdenken</b><ref id="groupthink"></ref>.
Wanneer een groep <i>te</i> hecht is, (zoals vaak het geval is in de top van bedrijven)
worden ze resistent voor complexe ideeÎn die hun overtuigingen of ego uitdagen.
<div style="height:0.9em"></div>
Dus, dat is hoe bedrijven tot de waanzin van groepen kunnen worden gedreven.
Maar hoe kunnen we <i>wijsheid</i> van groepen "maken"?
In het kort, twee woorden:
<next>Verbinden & Overbruggen <div class="rarr"></div> </next>
</words>
<!-- Bonding & Bridging -->
<words id="bonding_1">
← Te weinig verbindingen, en een idee kan zich niet verspreiden.
<br>
Te veel verbindingen, en je krijgt groepsdenken. <div class="rarr"></div>
</words>
<words id="bonding_2">
<b>
Teken een groep die precies goed is:
net genoeg verbonden om een complex idee te verspreiden!
<div class="darr"></div>
</b>
</words>
<words id="bonding_end">
Makkelijk!
Het aantal verbindingen <i>binnen</i> een groep wordt <b>verbindend sociaal kapitaal<ref id="social_capital"></ref> genoemd.
Maar hoe zit het met de verbindingen...
<next wiggle>...<i>tussen</i> groepen?</next>
</words>
<words id="bridging_1">
Zoals je misschien al geraden hebt,
wordt het aantal verbindingen <i>tussen</i> groepen
<b>overbruggend sociaal kapitaal</b> genoemd.
Dit is belangrijk, omdat het groepen helpt om uit hun <i>bubbel</i> te ontsnappen.
<br>
<b>Bouw een brug, om iedereen te "infecteren" met complexe wijsheid:</b>
</words>
<words id="bridging_end">
Net als bij verbinden is er een optimale manier voor overbruggen.<ref id="bridge"></ref>
(extra uitdaging: probier een brug te tekenen die zo dik is dat de complexe infectie
er <i>niet</i> doorheen kan!)
Nu we weten hoe we verbindingen kunnen "maken" <i>binnen</i> en <i>tussen</i> groepen, kunnen we...
<next wiggle>...BEIDE tegelijk doen!</next>
</words>
<words id="bb_1">
<b style="font-size:2em">FINAL PUZZLE!</b>
<br>
Teken verbindingen binnen groepen (verbinden) en tussen groepen (overbruggen)
om wijsheid over de hele menigte te verspreiden:
</words>
<words id="bb_2">
Gefeliciteerd, je hebt zojuist een heel speciaal type netwerk getekend!
Netwerken met de juiste combinatie van verbinden en overbruggen
zijn enorm belangrijk, en ze heten...
<next wiggle>ìKleine Wereld Netwerkenî <div class="rarr"></div> </next>
</words>
<words id="bb_small_world_1">
<i>"Eenheid zonder uniformiteit". "Verscheidenheid zonder verdeling". "E Pluribus Unum: uit velen, ÈÈn".</i>
<br>
Hoe het ook verwoord wordt,
mensen vanuit alle tijden en culturen komen vaak tot dezelfde wijsheid:
<b>
een gezonde samenleving heeft een optimaal aantal verbindingen <i>binnen</i>
en overbruggingen <i>tussen</i> groepen nodig.
</b>
Dat is:
</words>
<words id="bb_small_world_2">
Niet dit...
<br>
(want de ideeÎn kunnen zich niet verspreiden)
</words>
<words id="bb_small_world_3">
ook niet dit...
<br>
(want dan krijg je groepsdenken)
</words>
<words id="bb_small_world_4">
...maar <i>DIT:</i>
</words>
<words id="bb_small_world_5">
Netwerk onderzoekers hebben nu wiskundige definities voor deze eeuwenoude wijsheid:
het <b>kleine wereld netwerk</b><ref id="small_world"></ref>.
Deze optimale combi van verbinden+overbruggen beschrijft hoe
onze neuronen verbonden zijn<ref id="swn_neurons"></ref>,
voedt collectieve creativiteit<ref id="swn_creativity"></ref>
en het oplossen van problemen<ref id="swn_social_physics"></ref>,
en hielp zelfs president John F. Kennedy van de VS (ternauwernood) een kernoorlog te voorkomen!<ref id="swn_jfk"></ref>
Dus ja, kleine werelden zijn van groot belang.
</words>
<words id="bb_small_world_end">
<next>okÈ, laten we gaan afronden... <div class="rarr"></div> </next>
</words>
<!-- Sandbox -->
<words id="sandbox_caption">
(psst... wil je een geheim weten?<ref id="sandbox"></ref>)
</words>
<words id="sandbox_contagion">
Infectie:
</words>
<words id="sandbox_contagion_simple">
simpel
</words>
<words id="sandbox_contagion_complex">
complex
</words>
<words id="sandbox_color_chooser">
De Kleur van de Infectie:
</words>
<words id="sandbox_tool_chooser">
Selecteer gereedschap...
</words>
<words id="sandbox_tool_pencil">
Teken Netwerk
</words>
<words id="sandbox_tool_add">
Voeg Persoon toe
</words>
<words id="sandbox_tool_add_infected">
Voeg "Besmet" toe
</words>
<words id="sandbox_tool_move">
Verplaats Persoon
</words>
<words id="sandbox_tool_delete">
Verwijder Persoon
</words>
<words id="sandbox_tool_clear">
<b>VERWIJDER ALLES</b>
</words>
<words id="sandbox_shortcuts_label">
(...of, gebruik de toetsenbord shortcuts!)
</words>
<words id="sandbox_shortcuts">
[1]: Voeg Persoon toe [2]: Voeg "Besmet" toe
<br>
[Spatie]: Verplaats [Backspace]: Verwijder
</words>
<!-- Conclusion -->
<words id="conclusion_1">
<div style="font-size: 30px;">
CONCLUSIE: het draait allemaal om...
</div>
<div style="
width: 100%;
position: absolute;
font-size: 88px;
top: 20px;
line-height: 100px; display:block;
">
Infecties & Verbindingen
</div>
<div style="
width: 710px;
position: absolute;
top: 125px;
left: 250px;
">
<b>Infecties:</b>
Net zoals neuronen signalen in een brein doorsturen,
sturen mensen opvattingen & gedrag door naar een samenleving.
We beÔnvloeden niet alleen onze vrienden,
maar ook vrienden van onze vrienden en zelfs vrienden van vrienden van onze vrienden!<ref id="three_degrees"></ref>
("wees de verandering die je wil zien in de wereld" etc. etc.)
Maar, zoals bij neuronen, draait het niet alleen om de signalen, maar ook om...
</div>
<div style="
width: 710px;
position: absolute;
top: 275px;
left: 250px;
">
<b>Verbindingen:</b>
Met te weinig verbindingen kunnen complexe ideeÎn niet verspreiden.
Met te <i>veel</i> verbindingen worden complexe ideeÎn verpletterd door groepsdenken.
De truc is om een kleine wereld netwerk te bouwen, de optimale mix van
verbinden en overbruggen: <i>e pluribus unum.</i>
</div>
<div style="
width: 350px;
position: absolute;
top: 410px;
left: 220px;
text-align: center;
color: #999;
">
(wil je je eigen simulaties maken?
Ga dan naar de Experimentele Modus, door hieronder op (?) te klikken!)
</div>
<div style="
width: 400px;
position: absolute;
top: 395px;
right: 0px;
text-align: right;
">
Maar hoe zit het met de vraag van het begin?
Waarom veranderen sommige groepen in...
</div>
<div style="
width: 300px;
position: absolute;
top: 460px;
right: 0px;
">
<next>...wijsheid en/of waanzin?</next>
</div>
</words>
<words id="conclusion_2">
<span style="line-height:1.4em; display:block;">
<div style="height:0.5em"></div>
Van Newton tot NASA tot
<br>
netwerk onderzoek, we hebben veel besproken
<br>
vandaag. Om een lang verhaal kort te maken, de waanzin
<br>
van groepen komt niet door <i>individuele mensen</i>, maar door
<br>
hoe we gevangen zitten in het kleverige web van een netwerk.
<div style="height:0.9em"></div>
Dit <i>betekent NIET</i> dat we alle persoonlijke verantwoordelijkheid
<br>
moeten laten varen, aangezien we ook de <i>wevers</i> van het web zijn.
<br>
Dus, verbeter infecties: wees kritisch over ideeÎn die je vleien<ref id="flatter"></ref>, probeer
<br>
complexe ideeÎn te begrijpen. En verbeter verbindingen: verbind met
<br>
gelijken, maar bouw ook bruggen over culturele/politieke scheidingen.
<div style="height:0.9em"></div>
We kunnen een wijs web weven. Zeker, het is moeilijker dan
<br>
lijnen tekenen op een scherm...
<next>...maar het is het zÛ waard.</next>
</span>
</words>
<words id="conclusion_3">
<i>
"De grote triomfen en tragedies in de geschiedenis zijn veroorzaakt,
niet door mensen die fundamenteel goed of fundamenteel slecht zijn,
maar door mensen die fundamenteel mensen zijn."
</i>
<br>
<span style="position:relative; top:5px">~</span> Neil Gaiman & Terry Pratchett
<div style="height:0.8em"></div>
<next small><3</next>
</words>
<!-- Credits -->
<words id="credits">
<div style="text-align:center; color:#fff; letter-spacing: 1px; font-size: 24px; line-height: 27px;">
<span style="color:#777; position:relative; top:5px;">
gemaakt door</span>
<div style="font-size: 3em; line-height: 1.0em;">
NICKY CASE</div>
<a target="_blank" href="http://ncase.me" style="text-decoration:none">
speel mijn andere spellen</a> ∑
<a target="_blank" href="https://twitter.com/ncasenmare" style="text-decoration:none">
volg mijn twitter</a>
<br><br>
<span style="color:#777; position:relative; top:5px; display: inline-block; margin-top: 15px;">
veel liefde en dank aan</span>
<div style="font-size: 3em; line-height: 1.0em;">
MIJN PATREON SUPPORTERS</div>
<a target="_blank" href="https://www.patreon.com/ncase" style="text-decoration:none">
help me om meer dingen zoals dit te maken! <3</a>
<br>
<a onclick='publish("reference/show", ["supporters"]);'>