-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·794 lines (562 loc) · 30.8 KB
/
index.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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Compact Skateboarding History</title>
<meta name="description" content="an off-center view of a recent beyond-sport phenomena">
<meta name="author" content="rokma">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png?v=2106">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png?v=2106">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png?v=2106">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png?v=2106">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png?v=2106">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png?v=2106">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png?v=2106">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png?v=2106">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png?v=2106">
<link rel="icon" type="image/png" href="/favicon-32x32.png?v=2106" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-194x194.png?v=2106" sizes="194x194">
<link rel="icon" type="image/png" href="/favicon-96x96.png?v=2106" sizes="96x96">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png?v=2106" sizes="192x192">
<link rel="icon" type="image/png" href="/favicon-16x16.png?v=2106" sizes="16x16">
<link rel="manifest" href="/manifest.json?v=2106">
<link rel="mask-icon" href="/safari-pinned-tab.svg?v=2106" color="#fd000c">
<link rel="shortcut icon" href="/favicon.ico?v=2106">
<meta name="apple-mobile-web-app-title" content="Krap">
<meta name="application-name" content="Krap">
<meta name="msapplication-TileColor" content="#ff0000">
<meta name="msapplication-TileImage" content="/mstile-144x144.png?v=2106">
<meta name="theme-color" content="#ff0000">
<link rel="stylesheet" href="css/reveal.min.css">
<link rel="stylesheet" href="css/theme/rok.css" id="theme">
<!-- Twitter Cards -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@rokmatwit">
<meta name="twitter:creator" content="@rokmatwit">
<meta name="twitter:image:src" content="http://krap.junglestar.org/p/1987-01.jpg">
<meta name="twitter:title" content="Compact Skateboarding History">
<meta name="twitter:description" content="An off-center, time-lined view, of a recent 'beyond-sport phenomena' that went global.">
<!-- Open Graph -->
<meta property="og:locale" content="en_US">
<meta property="og:type" content="article">
<meta property="og:title" content="Compact Skateboarding History">
<meta property="og:image" content="http://krap.junglestar.org/p/1987-01.jpg">
<meta property="og:description" content="An off-center, time-lined view, of a recent 'beyond-sport phenomena' that went global.">
<meta property="og:url" content="http://krap.junglestar.org/">
<meta property="og:site_name" content="Compact Skateboarding History">
<meta name="google-site-verification" content="Rt71Q1qGvbUviohh6n8KmtRoGUd-XeuuuKLBjCMvHO8" />
<!-- If the query includes 'print-pdf', include the PDF print sheet -->
<script>
if( window.location.search.match( /print-pdf/gi ) ) {
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'css/print/pdf.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
}
</script>
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
<style>
.hide{display:none;}
</style>
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<section data-autoslide="5000" >
<!-- logo BABY! k-rap.svg -->
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="svg8280" x="0px" y="0px" width="281.356px" height="193.783px" viewBox="-179.286 -120.172 281.356 193.783" enable-background="new -179.286 -120.172 281.356 193.783" xml:space="preserve">
<g id="layer1" transform="translate(-293.78641,-581.89101)">
<g id="g4955" transform="matrix(1.25,0,0,-1.25,376.28395,623.20929)">
<path id="path4957" d="M-1.53 18.028c13.316 2.94 18.42 14.54 16.94 31.47 c-1.568 18.004-12.741 41.964-32.07 39.938c-13.849-1.452-28.053-7.513-41.754-10.893c-14.577-3.596-28.379-6.727-41.754-9.68 c-3.922-3.137-10.182-3.939-10.892-10.29c28.827 8.01 43.632-40.873 28.441-59.905c-2.411-3.021-6.716-4.091-7.868-7.87 c24.936-3.713 30.43 24.12 26.63 45.387c5.553-9.857 6.997-30.398 0.604-40.544c14.865 2.6 17.85 19.91 15.73 37.52 c16.447 4.73 31.95 10.4 49.02 14.523C4.682 37.65 1.34 23.651-1.53 18.03" class="krap"/>
</g>
<g id="g4959" transform="matrix(1.25,0,0,-1.25,312.66307,601.53642)">
<path id="path4961" d="M-60.767 38.207c-0.369-0.034-0.717-0.089-0.605-0.605 c22.837-3.927 33.396-45.28 15.129-61.722C-15.803-16.896-28.703 44.324-60.767 38.21" class="krap"/>
</g>
<g id="g4963" transform="matrix(1.25,0,0,-1.25,324.5482,623.90854)">
<path id="path4965" d="M-49.702 17.377c-0.027 14.251-8.938 30.105-19.363 33.28 c-19.524 5.951-26.472-13.316-24.205-29.046c1.018-7.084 5.274-17.08 9.683-17.548c-7.981 9.423-12.499 42.7 6.05 44.78 C-57.277 51.118-47.307 18.53-57.57-0.172C-50.931 0.937-49.69 11.312-49.702 17.38" class="krap"/>
</g>
<g id="g4967" transform="matrix(1.25,0,0,-1.25,360.20408,629.15179)">
<path id="path4969" d="M-16.503 12.495c6.864 2.56 15.59 4.6 20.57 7.866c7.585 4.97 8.96 15.86 7.87 28.44 c-14.841-3.918-28.509-9.011-43.57-12.708c2.796-12.403-2.334-25.004-5.445-31.467C-31.208 7.809-23.734 9.797-16.503 12.49" class="krap"/>
</g>
<g id="g4971" transform="matrix(1.25,0,0,-1.25,316.5082,612.37317)">
<path id="path4973" d="M-57.188 28.117c-4.084-4.279-8.668-12.809-6.052-19.967 c6.191 2.55 10.388-2.115 12.709-5.447C-49.058 12.843-51.234 23.499-57.188 28.12" class="krap"/>
</g>
<g id="g4975" transform="matrix(1.25,0,0,-1.25,304.27345,638.24067)">
<path id="path4977" d="M-68.579 4.033c2.465-11.738 14.21 1.04 16.94 4.24 c1.851 2.16 8.71 7.55 7.26 13.312c-1.138 4.524-5.882 3.9-7.263 3.632C-56.161 24.332-69.825 9.965-68.579 4.03" class="krap"/>
</g>
<g id="g4979" transform="matrix(1.25,0,0,-1.25,293.78645,641.38654)">
<path id="path4981" d="M-78.344 1.104c0.039-9.506 14.196-5.7 18.16 0c-4.384 0.702-2.861 9.017-4.237 10.89 C-68.614 7.737-78.374 8.228-78.344 1.1" class="krap"/>
</g>
<g id="g4983" transform="matrix(1.25,0,0,-1.25,304.27345,642.78517)">
<path id="path4985" d="M-68.579-0.197C-71.5-14.75-61.858-10.2-52.241-6.248 c7.071 2.9 14 2.83 12.1 11.495C-50.295 15.974-56.485-3.54-68.579-0.197" class="krap"/>
</g>
</g>
<g>
<polygon points="-98.01,-92.95 -101.52,-74.83 -94.36,-74.83 -97.87,-92.95" class="krap"/>
<path d="M-122.83-98.605c-0.445-0.678-1.065-1.182-1.861-1.509c-0.796-0.327-1.849-0.492-3.159-0.492h-3.722v15.589 h4.072c1.264 0 2.27-0.176 3.02-0.526c0.749-0.352 1.322-0.854 1.721-1.51c0.397-0.655 0.667-1.462 0.807-2.422 c0.141-0.959 0.211-2.071 0.211-3.336c0-1.264-0.07-2.375-0.211-3.335C-122.092-97.105-122.385-97.926-122.83-98.605z" class="krap"/>
<path d="M-61.953-120.172h-105.333c-6.627 0-12 5.373-12 12v50.667c0 6.63 5.37 12 12 12h87.529l8.471 48v-48 h9.333c6.627 0 12-5.373 12-12v-50.667C-49.953-114.799-55.326-120.172-61.953-120.172z M-120.618-57.349l-6.671-21.347h-4.283 v21.347h-7.163v-49.998h11.516c8.427 0 12.64 4.89 12.64 14.676c0 2.903-0.457 5.396-1.369 7.48 c-0.913 2.084-2.517 3.757-4.811 5.021l7.725 22.823H-120.618z M-90.914-57.349l-2.106-10.745h-9.761l-2.106 10.745h-7.163 l11.166-49.998h5.969l11.165 49.998H-90.914z M-57.383-86.456c-0.258 1.569-0.808 3.032-1.651 4.39 c-0.983 1.639-2.294 2.915-3.933 3.827c-1.639 0.913-3.792 1.369-6.46 1.369h-3.651v19.522h-7.163v-49.998h10.744 c1.966 0 3.7 0.26 5.2 0.772c1.497 0.52 2.85 1.43 4.07 2.739c1.217 1.31 2.06 2.84 2.53 4.6 c0.468 1.75 0.7 4.13 0.7 7.127C-56.997-89.908-57.127-88.024-57.383-86.456z" class="krap"/>
<path d="M-64.476-98.113c-0.352-0.773-0.902-1.381-1.65-1.826c-0.749-0.444-1.826-0.667-3.23-0.667h-3.722v16.993 h3.44c1.451 0 2.575-0.21 3.371-0.631c0.796-0.421 1.38-0.994 1.756-1.721c0.374-0.725 0.597-1.603 0.667-2.633 c0.07-1.029 0.105-2.177 0.105-3.441c0-1.17-0.035-2.282-0.105-3.336C-63.914-96.427-64.125-97.341-64.476-98.113z" class="krap"/>
<path d="M-168.649-107.347h7.163v22.822h0.14l10.463-22.822h7.163l-9.762 20.013l11.586 29.985h-7.583l-8.146-22.19l-3.862 7.23 v14.958h-7.163V-107.347z"/>
</g>
</svg>
<!-- /logo -->
<h1>compact<br>skateboarding<br>history</h1>
<p class="fragment roll-in" >
<small>An off-center, time-lined view, of a recent 'beyond-sport phenomena' that went global.</small>
</p>
<p class="fragment roll-in" >
<a target="_blank" href="https://en.wikipedia.org/wiki/Fenqing"><small style="color: red;">⋆⋆⋆ a 愤青 production ⋆⋆⋆</small></a>
</p>
</section>
<section data-autoslide="6000" >
<h2>So you wanna know where it all came from... huh?</h2>
<!-- svg baby! -->
<svg class="i-down" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="168.619px" height="84.334px" viewBox="367.213 281.166 168.619 84.334" enable-background="new 367.213 281.166 168.619 84.334" xml:space="preserve">
<g>
<circle cx="410.2" cy="323.5" r="35.3" class="eyes"/>
<circle cx="491.2" cy="323.5" r="35.3" class="eyes"/>
<g id="eyes-up">
<path d="M410.22 289.83c-9.205 0-16.668 7.463-16.668 16.668s7.463 16.7 16.7 16.67c9.206 0 16.669-7.465 16.669-16.67 S419.426 289.8 410.2 289.83z M491.174 289.83c-9.205 0-16.668 7.462-16.668 16.668c0 9.2 7.5 16.7 16.7 16.7 c9.206 0 16.669-7.465 16.669-16.67C507.843 297.3 500.4 289.8 491.2 289.83z"/>
</g>
</g>
</svg>
<p></p>
<h3 class="fragment roll-in">
<blockquote class="up fragment roll-in">
It had to be learnt and cannot be taught.
</blockquote>
</h3>
<p class="fragment roll-in">
<small>by <a href="http://rokma.com">rokma</a> / <a href="http://twitter.com/rokmatwit">@rokmatwit</a></small>
</p>
</section>
<section data-autoslide="4000" >
<h2>heads up</h2>
<!-- svg baby! -->
<svg class="i-up" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="168.619px" height="84.334px" viewBox="367.213 281.166 168.619 84.334" enable-background="new 367.213 281.166 168.619 84.334" xml:space="preserve">
<g>
<circle cx="410.2" cy="323.5" r="35.3" class="eyes"/>
<circle cx="491.2" cy="323.5" r="35.3" class="eyes"/>
<g id="eyes-up">
<path d="M410.22 289.83c-9.205 0-16.668 7.463-16.668 16.668s7.463 16.7 16.7 16.67c9.206 0 16.669-7.465 16.669-16.67 S419.426 289.8 410.2 289.83z M491.174 289.83c-9.205 0-16.668 7.462-16.668 16.668c0 9.2 7.5 16.7 16.7 16.7 c9.206 0 16.669-7.465 16.669-16.67C507.843 297.3 500.4 289.8 491.2 289.83z"/>
</g>
</g>
</svg>
<h3 class="fragment roll-in">
It all started with nothing, and evolved very slowly, before it reached its present glory.
<blockquote class="fragment roll-in">
Lots of boring days with no motivations darkness you'd fill with imagination.
</blockquote>
</h3>
<h3 class="fragment roll-in">
it was there, yet un-thought, un-makeable. Then eventually...
<blockquote class="fragment roll-in">
Somebody landed it and learnt it, showing his world.
</blockquote>
</h3>
<h3 class="fragment roll-in">
<blockquote >
Be there and live it, was the only way of getting it.
</blockquote>
</h3>
<aside class="notes">
As then, still today need to pay bills... (hit 's' on your keyboard).
</aside>
</section>
<section data-state="pioneers">
<section data-state="pioneers-00">
<h2>pioneers</h2>
<h3 class="fragment roll-in">
The beginnings.
</h3>
<h3 class="fragment roll-in">
<blockquote>
Sidewalk surfing.
</blockquote>
</h3>
<h3 class="fragment roll-in">
A really underground subculture unbeknown to most.
<blockquote>
From surfing to skateboarding!
</blockquote>
</h3>
</section>
<section data-state="pioneers-01">
<h2>pioneers?</h2>
<p>
<a target="_blank" href="http://en.wikipedia.org/wiki/Pioneer">what?</a>
</p>
<small><em>noum</em></small>
<p>A person or entity who is among the earliest in any field, enterprise, or progress. One who goes before, as into the wilderness, opening the way for others to follow.</p>
<small><em>verb</em></small>
<p>To go before and prepare or open new ways</p>
<small><em>synonyms</em></small>
<p>Push the envelope | Break new ground</p>
</section>
<section data-state="pioneers-02" data-background="p/1987-01.jpg">
<p class="caption">Steve Alba. Skating a Backyard pool, Los Angeles suburbia </p>
</section>
<section data-state="pioneers-03" data-background="p/1987-02.jpg">
<p class="caption">Upland Skatepark, Los Angeles </p>
</section>
<section data-state="pioneers-04" data-background="p/1987-03.jpg">
<p class="caption">Max Bonassi, one of the founders of Bastard™, perhaps the most successful skate inspired clothing brand out of Italy. Rome. </p>
</section>
<section data-state="pioneers-05" data-background="p/1988-01.jpg">
<p class="caption">Etnies™ founder, Pierre Andrè Senizergues, freestyling his way during some european championship in Prague, Czechoslovakia</p>
</section>
<section data-state="pioneers-06" data-background="p/1988-02.jpg">
<p class="caption">Perhaps the first Italian Vert Contest in Viareggio. Fulvio Nelzi</p>
</section>
</section>
<section data-state="early-days" data-state="early-days-00">
<section>
<h2>early days</h2>
<h3 class="fragment roll-in">
End of the ’80 and streetskating is born.
<blockquote class="fragment roll-in">
Taking over public spaces...
</blockquote>
</h3>
<h3 class="fragment roll-in">
<blockquote class="fragment roll-in">
...and re-inventing them!
</blockquote>
</h3>
<h3 class="fragment roll-in">
Soon after, the first prohibitions.
<blockquote class="fragment roll-in">
Skateboarders are getting busted!
</blockquote>
</h3>
<h3 class="fragment roll-in">
Boards are still very wide and kinda noseless.
<blockquote class="fragment roll-in">
It’s backyard ramp time, for the lucky ones!
</blockquote>
</h3>
</section>
<section data-state="early-days-01" data-background="p/1987-04.jpg">
<p class="caption">Lance Mountain. Carlsbad, California</p>
</section>
<section data-state="early-days-02" data-background="p/1988-03.jpg">
<p class="caption">Kid skating some banked wall in the outskirt of town. Genova, Italy</p>
</section>
<section data-state="early-days-03" data-background="p/1989-01.jpg">
<p class="caption">Jeremy Henderson. Harlem Banks, NYC</p>
</section>
<section data-state="early-days-04" data-background="p/1989-05.jpg">
<p class="caption">Early days of skateboarding videos. Young Mike Vallely wallriding a rusted car found in a ditch near Milano. Italy</p>
</section>
<section data-state="early-days-05" data-background="p/1989-06.jpg">
<p class="caption">Mark Gonzales, early days of the Munster contests organized by Titus™ in Germany</p>
</section>
</section>
<section data-state="skate-everything" data-state="skate-everything-00">
<section>
<h2>skate-everything</h2>
<h3 class="fragment roll-in">
From NY to Amsterdam, from Los Angeles to Milano, Prague to Paris.
<blockquote class="fragment roll-in">
Skaters start to really kick asses.
</blockquote>
</h3>
<h3 class="fragment roll-in">
Jumping past long staircases, riding walls and handrails...
<blockquote class="fragment roll-in">
...ollies, non stop and full speed!
</blockquote>
</h3>
</section>
<section data-state="skate-everything-01" data-background="p/1990-01.jpg">
<p class="caption">Skaters attaching the sunlight clock monument in central Paris. </p>
</section>
<section data-state="skate-everything-02" data-background="p/1990-02.jpg">
<p class="caption">Street Skating on some parked car in Rimini, Italy</p>
</section>
<section data-state="skate-everything-03" data-background="p/1990-04.jpg">
<p class="caption">Carlo Lalumera. Vespa™ Ollie at Borromeo. Milano, Italy</p>
</section>
<section data-state="skate-everything-04" data-background="p/1990-05.jpg">
<p class="caption">Anything transitioned will be attacked! French skater in Paris outskirts</p>
</section>
</section>
<section data-state="wild-in-the-street" data-state="wild-in-the-street-00">
<section>
<h2>wild in the street</h2>
<h3 class="fragment roll-in">
Cities are seen as huge skateparks.
<blockquote class="fragment roll-in">
It’s streets invasion time...
</blockquote>
</h3>
<h3 class="fragment roll-in">
Skateboarding videos are getting popular.
<blockquote class="fragment roll-in">
Don’t leave your car unattended or it can be destroyed!
</blockquote>
</h3>
<h3 class="fragment roll-in">
Skateboarding explodes even in minor countries.
</h3>
</section>
<section data-state="wild-in-the-street-01" data-background="p/1989-03.jpg">
<p class="caption">Cooper Union Square attack. Manhattan, NYC</p>
</section>
<section data-state="wild-in-the-street-02" data-background="p/1990-03.jpg">
<p class="caption">Andrea Paulicelli. Wallride at Muretto. Milano</p>
</section>
<section data-state="wild-in-the-street-03" data-background="p/1990-06.jpg">
<p class="caption">Alessandro Melle. Torino, Italy.</p>
</section>
<section data-state="wild-in-the-street-04" data-background="p/1990-07.jpg">
<p class="caption">Alex Esposito, right in front of Duomo cathedral in Milano</p>
</section>
</section>
<section data-state="ramp-and-parks" data-state="ramp-and-parks-00">
<section>
<h2>ramp and parks</h2>
<h3 class="fragment roll-in">
<blockquote class="fragment roll-in">
Ramps appearing everywhere...
</blockquote>
</h3>
<h3 class="fragment roll-in">
Many skateparks are getting built.<br>
<blockquote class="fragment roll-in">
It's hard to stop skaters from taking over public facilities!
</blockquote>
</h3>
<h3 class="fragment roll-in">
The attitude is Punk and Irreverent.
</h3>
</section>
<section data-state="ramp-and-parks-01" data-background="p/1989-04.jpg">
<p class="caption">Cut, form Ancona, is cool enough to look into the camera, instead to where he’s gonna land. This ramp, built with stolen wood inside a squat, is open and free. Bologna, Italy.</p>
</section>
<section data-state="ramp-and-parks-01" data-background="p/1989-07.jpg">
<p class="caption">Girls are starting to skate too. Glasgow, Scotland</p>
</section>
<section data-state="ramp-and-parks-01" data-background="p/1991-01.jpg">
<p class="caption">Giorgio Zattoni, here 13 y.o., skates some miniramp in Italy</p>
</section>
<section data-state="ramp-and-parks-01" data-background="p/1992-01.jpg">
<p class="caption">Bruno Ferrari skating the freshly built free public skatepark at Gratosolio, Milano</p>
</section>
</section>
<section data-state="visiting-pros" data-state="visiting-pros-00">
<section>
<h2>visiting pros</h2>
<h3 class="fragment roll-in">
International demo tours bring american pros example.
<blockquote class="fragment roll-in">
It’s show time!
</blockquote>
</h3>
<h3 class="fragment roll-in">
Lots of kids get infected for life.
</h3>
</section>
<section data-state="visiting-pros-01" data-background="p/1989-02.jpg">
<p class="caption">Young Danny Way skating before abundant media in France</p>
</section>
<section data-state="visiting-pros-02" data-background="p/1991-02.jpg">
<p class="caption">Mark Gonzales during Bercy demo. Paris</p>
</section>
<section data-state="visiting-pros-03" data-background="p/1991-03.jpg">
<p class="caption">Steve Caballero. Demo in Riccione, Italy.</p>
</section>
<section data-state="visiting-pros-04" data-background="p/1991-04.jpg">
<p class="caption">Tony Hawk. Demo at the Eiffel Tower, Paris</p>
</section>
</section>
<section data-state="hit-mainstream" data-state="hit-mainstream-00">
<section>
<h2>hit mainstream</h2>
<h3 class="fragment roll-in">
Big company billboard ads with skaters appear.
Huge increase in media attention.
<blockquote class="fragment roll-in">
Play Tony Hawk videogame!
</blockquote>
</h3>
<h3 class="fragment roll-in">
Skateboarding phenomena is serving big brands youth-targeting campaigns
<blockquote class="fragment roll-in">
Skateboarding is going mainstream...
</blockquote>
</h3>
</section>
<section data-state="hit-mainstream-01" data-background="p/1993-01.jpg">
<p class="caption">A classic Bodè puppet, a cult icon from the early days of spray can art, today appears riding a skateboard.</p>
</section>
<section data-state="hit-mainstream-02" data-background="p/1995-01.jpg">
<p class="caption">Nike™ billboard is using a skateboarder for the first time. Christian Hosoi. Los Angeles.</p>
</section>
<section data-state="hit-mainstream-03" data-background="p/1998-01.jpg">
<p class="caption">Tony Hawk, now sponsored by Diesel™, interviewed by national TV after a demo in Treviso, Italy</p>
</section>
</section>
<section data-state="contemporary" data-state="contemporary-00">
<section>
<h2>contemporary</h2>
<h3 class="fragment roll-in">
Free cement skateparks age.
<blockquote class="fragment roll-in">
...yeah, keep skaters away from destroying public property!
</blockquote>
<h3 class="fragment roll-in">
Skater’s attitude is now loose and careless. Still, competition to be the best is real.
<blockquote class="fragment roll-in">
It’s about the latest trick and the coolest look...
</blockquote>
</h3>
</section>
<section data-state="contemporary-01" data-background="p/1996-01.jpg">
<p class="caption">Chad Muska skating the new free park in Huntington Beach.</p>
</section>
<section data-state="contemporary-02" data-background="p/1999-01.jpg">
<p class="caption">Daniel Cardone. Ancona, Italy</p>
</section>
<section data-state="contemporary-03" data-background="p/2000-01.jpg">
<p class="caption">Matteo Dinisio. Milano Centrale</p>
</section>
</section>
<section data-state="video-days" data-state="video-days-00">
<section>
<h2>video days</h2>
<h3 class="fragment roll-in">
Skateboarding get globalized thru Video. Kids learn from video and skate to make video.
<blockquote class="fragment roll-in">
Try 'til you film it cleanly landed!
</blockquote>
</h3>
<h3 class="fragment roll-in">
To pull it off consistenly, to body learn it, it’s not the focus anymore.
<blockquote class="fragment roll-in">
No need to enter competitions to be top...
</blockquote>
</h3>
<h3 class="fragment roll-in">
American pros come to Milano just to film video on massive marble.
</h3>
</section>
<section data-state="video-days-01" data-background="p/2002-01.jpg">
<p class="caption">Mike York filming for the Chocolate™ video in Milano Centrale</p>
</section>
<section data-state="video-days-02" data-background="p/2003-01.jpg">
<p class="caption">Eric Koston. Demo in Rome.</p>
</section>
</section>
<section data-state="skateboarders" data-state="skateboarders-00">
<h2>who's skateboarding here</h2>
<h3 class="fragment roll-in">
<blockquote>
Yo, thanks everybody...
</blockquote>
</h3>
<p class="small">
<span class="period pioneers">Steve Alba, L.A.suburbia • Upland Skatepark, L.A. • Max Bonassi at Nomentana Ramp, Rome • Pierre Andre Senizergues, Prague • Fulvio Nelzi at Viareggio, Italy • </span>
<span class="period earlydays">Lance Mountain at Danny Way's ramp, Carlsbad • Bruno Besta, Genova, Italy • Jeremy Henderson at Harlem banks, N.Y. • Mike Vallely at Rho, Milano • Mark Gonzales, Munster • </span>
<span class="period skateverything"> You?, Paris • You?, Milano Marittima, Italy • Carlo Lalumera at Miniduomo, Milano • You? Paris • </span>
<span class="period wildinthestreet"> You?, Cooper Union Square, N.Y. • Andrea Paulicelli at Muretto, Milano • Alex Melle, Torino • Alex Esposito at Duomo Milano • </span>
<span class="period rampandparks"> Cut skating a squat ramp during "Isola nel Cantiere", Bologna, Italy • she so aggro!, Glasgow • Giorgio Zattoni, Rimini, Italy • </span>
<span class="period visitingpros"> Danny Way in Paris • Mark Gonzales in Paris • Steve Caballero, Riccione, Italy • Tony Hawk in Paris • </span>
<span class="period hitmainstream"> Bodé at Gratosolio, Milano • Christian Hosoi on a Nike™ billboard, L.A. • Tony Hawk at 55DSL™ demo, Treviso, Italy • </span>
<span class="period contemporary"> Chad Muska at Huntington Beach • Daniel Cardone at Ancona, Italy • Matteo Dinisio at Milano Centrale • </span>
<span class="period videodays"> Mike Jork, Chocolate™ video in the making at Milano Centrale • filming Eric Koston at a demo, Rome </span>
</p>
</section>
<section data-state="e" data-state="e-00">
<!-- svg baby! -->
<svg class="i-down" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" width="168.619px" height="84.334px" viewBox="367.213 281.166 168.619 84.334" enable-background="new 367.213 281.166 168.619 84.334" xml:space="preserve">
<g>
<circle cx="410.2" cy="323.5" r="35.3" class="eyes"/>
<circle cx="491.2" cy="323.5" r="35.3" class="eyes"/>
<g id="eyes-up">
<path d="M410.22 289.83c-9.205 0-16.668 7.463-16.668 16.668s7.463 16.7 16.7 16.67c9.206 0 16.669-7.465 16.669-16.67 S419.426 289.8 410.2 289.83z M491.174 289.83c-9.205 0-16.668 7.462-16.668 16.668c0 9.2 7.5 16.7 16.7 16.7 c9.206 0 16.669-7.465 16.669-16.67C507.843 297.3 500.4 289.8 491.2 289.83z"/>
</g>
</g>
</svg>
<h1>the end.</h1>
<h3 class="fragment roll-in">
<blockquote style="text-align:center;" cite="http://speak.junglestar.org/">
Oh.. New beginning now...
</blockquote>
</h3>
<h4 class="fragment roll-in">
Now go walk like a pioneer, think what needs to be done next!
</h4>
<h4 class="fragment rool-in">
Really! That's all it takes.
</h4>
<h3 class="fragment roll-in">
<blockquote style="text-align:center;">
Just Make it!
</blockquote>
</h3>
<p class="fragment roll-in" >
<small>
愤青 <span class="hide">angry youth</span>
</small>
<info class="hide">
https://en.wikipedia.org/wiki/Fenqing
Fenqing (simplified Chinese: 愤青; traditional Chinese: 憤青; pinyin: Fènqīng), or "FQ" (abbreviation), which is itself an abbreviation for Fennu Qingnian (simplified Chinese: 愤怒青年; traditional Chinese: 憤怒青年; pinyin: Fènnù Qīngnián), means literally "angry youth". It mainly refers to leftist Chinese youth who display a high level of Chinese nationalism.[1] This term first appeared in Hong Kong in the 1970s, referring to those young people who were not satisfied with Chinese society and sought reform.[2] It has now evolved into a term used predominantly in Internet slang. Whether fenqing is derogatory or not usually depends on the person. Chinese critics often refer to them using the homophone characters "粪青"[3] which are pronounced identically but translate to "shit-youth". This is often changed further to fènfèn (粪粪) as a derogatory nickname.
</info>
</p>
</section>
</div>
</div>
<script src="lib/js/head.min.js"></script>
<script src="js/reveal.min.js"></script>
<script>
// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,
center: true,
slideNumber: true,
autoSlide: 8000,
autoSlideStoppable: true,
hideAddressBar: true,
transition: 'concave',
backgroundTransition: 'concave',
theme: 'rok',
// The "normal" size of the presentation, aspect ratio will be preserved
// when the presentation is scaled to fit different resolutions. Can be
// specified using percentage units.
width: 480, //960,
height: 900, //700,
// Factor of the display size that should remain empty around the content
margin: 0.1,
// Bounds for smallest/largest possible scale to apply to content
minScale: 0.1,
maxScale: 1
});
Reveal.configure({
mouseWheel: true,
keyboard: {
13: 'next' // go to the next slide when the ENTER key is pressed
}
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9JC2737F10"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-9JC2737F10');
</script>
</body>
</html>