This repository was archived by the owner on Jan 25, 2024. It is now read-only.
Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
758 lines (702 loc) · 28.1 KB
/
Copy pathindex.html
File metadata and controls
758 lines (702 loc) · 28.1 KB
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
<!DOCTYPE html>
<html lang="nl">
<head>
<title>Open Webslides</title>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="styles/screen-16x10.css" id="style">
<link rel="stylesheet" href="styles/custom.css">
</head>
<body class="shower list">
<header class="caption">
<h1>Open Webslides binnen de UGent</h1>
<h2>Broodje Martinnovatie</h2>
<p>
<a href="http://ruben.verborgh.org/">Ruben Verborgh</a> &
<a href="https://be.linkedin.com/in/estherdeloof">Esther De Loof</a>,
<a href="http://www.ugent.be/">Universiteit Gent</a>
</p>
<p>
Bekijk de <a href="Preview/">voorbereidende slides</a>.
</p>
</header>
<section class="title slide" id="title">
<h2>Open Webslides binnen de UGent</h2>
<p>
<a href="https://ruben.verborgh.org/">Ruben Verborgh</a>
&
<a href="https://be.linkedin.com/in/estherdeloof">Esther De Loof</a>
<span style="float: right">
<a href="http://bit.ly/martinnovatie">bit.ly/martinnovatie</a>
</span>
</p>
</section>
<section class="slide" id="intro">
<h2>Wat als lesmateriaal aan de UGent…</h2>
<ul>
<li class="next">…meeging met z'n tijd?</li>
<li class="next">…werkte op ieder toestel?</li>
<li class="next">…beter werd door feedback van studenten?</li>
<li class="next">…naar andere cursussen kon verwijzen?</li>
<li class="next">…het onderzoek van de lesgever meer zichtbaar maakte?</li>
</ul>
</section>
<section class="slide" id="projector">
<img src="images/projector.jpg" alt="[foto van een diaprojector]" class="cover">
</section>
<section class="slide" id="powerpoint">
<h2>PowerPoint-slides zijn de nieuwe diaprojectors</h2>
<ul>
<li class="next">YouTube-filmpjes, tweets, interactiviteit… inbedden is niet eenvoudig.</li>
<li class="next">Slides vereisen specifieke software en werken niet op alle toestellen.</li>
<li class="next">Feedback van studenten verwerken is tijdrovend.</li>
<li class="next">Directe links tussen cursussen leggen kan technisch niet.</li>
<li class="next">Inspanningen om slides beter te maken blijven vaak onzichtbaar.</li>
</ul>
</section>
<section class="slide" id="summary">
<h2>Webslides: cursusmateriaal van de toekomst<br> met de technologie van vandaag</h2>
<ul>
<li class="next">Webslides kunnen alles wat <strong>websites</strong> kunnen.</li>
<li class="next">Webslides werken op <strong>alle toestellen</strong>, mobiel of vast.</li>
<li class="next"><strong>Suggesties van studenten</strong> toevoegen kan met één klik.</li>
<li class="next"><strong>Linken</strong> naar <a href="https://rubenverborgh.github.io/WebFundamentals/architecture/#url-http-html">andere cursussen</a> is eenvoudig.</li>
<li class="next">Extra <strong>zichtbaarheid</strong> door slides <em>optioneel</em> op het Web te plaatsen.</li>
</ul>
</section>
<section class="slide" id="Eerste intro vraag">
<iframe src="https://www.mentimeter.com/s/69d4190006f57aacde779d5544594735/8f22068bb31f" height="500" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 55 84 01)</ul>
</section>
<section class="slide" id="Tweede intro vraag">
<iframe src="https://www.mentimeter.com/s/69d4190006f57aacde779d5544594735/713c2641175d" height="500" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 55 84 01)</ul>
</section>
<section class="toc slide" id="toc">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="toc slide" id="toc-wat">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li class="current"><a href="#toc-wat">Wat zijn Open Webslides?</a>
<ul>
<li class="current"><a href="#toc-wat">Webslides: een overzicht</a></li>
<li><a href="#toc-open">De invulling van “open”</a></li>
<li><a href="#toc-voordelen">Voor- en nadelen</a></li>
</ul>
</li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="webslides">
<h2>Webslides zijn lesslides die gemaakt worden met webtechnologie</h2>
<ul>
<li>Ze zien er uit als <strong>gewone slides</strong>, en kunnen alles wat andere slides ook kunnen.
<ul>
<li>tekst, afbeeldingen, animaties…</li>
<li>afdrukken, omzetten naar PDF…</li>
</ul>
</li>
<li>Webslides gebruiken <strong>dezelfde technologie</strong> als websites.
<ul>
<li>onderliggende opmaaktalen: <a href="https://developer.mozilla.org/en-US/docs/Web/HTML">HTML</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS</a>…</li>
<li>Je ziet de technologie niet, en hoeft ze niet te kennen.</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="webslides-figuur">
<img src="images/OverviewDesign.svg" alt="">
</section>
<section class="slide" id="waarom">
<h2>Slides kunnen alles wat het web kan</h2>
<ul>
<li>Weinig technologieën <strong>evolueren</strong> zo snel als het web.</li>
<li>PowerPoint-slides volgen de evolutie van een <strong>gesloten</strong> softwarepakket.
<ul>
<li>Probleem van de grootste gemene deler:<br>
<em>werken de functies die ik wil gebruiken overal?</em>
</li>
<li>Een typisch probleem is dat <em>videos</em> niet overal afspelen.</li>
</ul>
</li>
<li>Kiezen voor het web maakt de <strong>nieuwste technologieën</strong> snel en overal beschikbaar.
<ul>
<li>Iets leuks gezien online? <em>Gebruik het meteen!</em></li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="tweet">
<h2>Bespreek een tweet met studenten</h2>
<p>Welke argumentatiestijl volgt deze conversatie?</p>
<blockquote class="twitter-tweet" data-lang="nl">
<p>U bent waar Toonbeeld voor de goede waarden en normen, waarde rector <a href="https://twitter.com/torfsrik">@torfsrik</a> . Ik bezorg zeker OESO rapport. Inhoud is niet onbelangrijk</p>— John Crombez (@johncrombez)
<a href="https://twitter.com/johncrombez/status/795697687609872384">7 november 2016</a>
</blockquote>
</section>
<section class="slide" id="youtube">
<h2>Toon een specifiek YouTube-fragment</h2>
<iframe width="800" height="450" src="https://www.youtube.com/embed/C3WzPD2iMKc?start=475&end=486&rel=0&showinfo=0&autohide=1" allowfullscreen></iframe>
</section>
<section class="slide" id="facebook">
<h2>Interageer met een Facebook-bericht</h2>
<p>Vertel dit aan je vrienden en familie:</p>
<div class="fb-post" data-href="https://www.facebook.com/ugent/posts/1232246436834490" data-width="800" data-show-text="true">
<blockquote cite="https://www.facebook.com/ugent/posts/1232246436834490" class="fb-xfbml-parse-ignore">
<p>Laatstejaars en hun ouders zijn van harte welkom op de infosessie 'Straks student aan de UGent' op 19 november:...</p>
Gepost door <a href="https://www.facebook.com/ugent/">Universiteit Gent</a>
op <a href="https://www.facebook.com/ugent/posts/1232246436834490">maandag 7 november 2016</a>
</blockquote>
</div>
</section>
<section class="slide" id="padlet">
<h2>Interactie via Padlet</h2>
<iframe src="https://padlet.com/embed/ituq0w336qcl" frameborder="0" style="width:100%;height:450px;display:block"></iframe>
</section>
<section class="slide" id="Mentimeter">
<h2>Interactie via Mentimeter</h2>
<iframe src="https://www.mentimeter.com/s/22b6718aa98a08cb588f9f7ea09b8719/aee2d80e0a9e" height="440" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 14 93 27)</ul>
</section>
<section class="toc slide" id="toc-open">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li class="current"><a href="#toc-wat">Wat zijn Open Webslides?</a>
<ul>
<li><a href="#toc-wat">Webslides: een overzicht</a></li>
<li class="current"><a href="#toc-open">De invulling van “open”</a></li>
<li><a href="#toc-voordelen">Voor- en nadelen</a></li>
</ul>
</li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="open">
<h2>“Open” heeft meerdere betekenissen</h2>
<p>
Met “open” duiden we meerdere mogelijkheden aan:
</p>
<ul>
<li>gebruik van <a href="#open-technologie">open technologieën</a></li>
<li>publiceren van slides op het <a href="#open-publicatie">open web</a></li>
<li>slides openstellen voor <a href="#open-feedback">feedback van studenten</a></li>
</ul>
<p>
Lesgevers kiezen <em>zelf</em>
wat zij onder “open” verstaan.
</p>
</section>
<section class="slide" id="open-technologie">
<h2>Het web bestaat uit open technologieën</h2>
<ul>
<li><strong>gratis</strong> te gebruiken</li>
<li>keuze uit <strong>verschillende browsers</strong></li>
<li>keuze uit <strong>verschillende editors</strong></li>
</ul>
<div class="next">
<blockquote class="twitter-tweet" data-lang="nl"><p lang="en">
This is for everyone <a href="https://twitter.com/hashtag/london2012?src=hash">#london2012</a> <a href="https://twitter.com/hashtag/oneweb?src=hash">#oneweb</a> <a href="https://twitter.com/hashtag/openingceremony?src=hash">#openingceremony</a> <a href="https://twitter.com/webfoundation">@webfoundation</a> <a href="https://twitter.com/w3c">@w3c</a></p>— Tim Berners-Lee (@timberners_lee) <a href="https://twitter.com/timberners_lee/status/228960085672599552">July 27, 2012</a>
</blockquote>
</div>
</section>
<section class="slide" id="open-publicatie">
<h2>Je kan slides eenvoudig publiek maken</h2>
<ul>
<li><strong>Lesgevers bepalen zelf</strong> wie slides kan zien:
<ul>
<li>bepaalde UGent-studenten via <a href="http://helpdesk.ugent.be/webhosting/casintro.php">CAS</a></li>
<li>alle UGent-medewerkers via <a href="http://helpdesk.ugent.be/webhosting/casintro.php">CAS</a></li>
<li>iedereen, net zoals een typische website</li>
</ul>
</li>
<li>Uiteraard kan je een PDF-bestand ook publiek zetten, maar…
<ul>
<li>de gebruikerservaring en integratie zijn minder goed</li>
<li>de interactiviteit gaat verloren</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="open-feedback">
<h2>Slides openstellen voor feedback</h2>
<blockquote>
<p>
Beste Professor,
</p>
<p>
Zou het kunnen dat in hoofdstuk 3 op slide 107 (versie van oktober)<br>
het woord “indirect” dient gewijzigd te worden in “direct”?
</p>
<p>
Met vriendelijke groeten,
</p>
<p>
Jan Janssens
</p>
</blockquote>
</section>
<section class="slide" id="open-feedback-nieuw">
<h2>Webslides openstellen voor feedback</h2>
<blockquote>
<h3>Overzicht wijzigingen</h3>
<p>
Wijziging voorgesteld door Jan Janssens:<br>
<em><del>Indirecte</del> <ins>Directe</ins> rede is de letterlijke weergave
van een citaat in een zin.</em>
</p>
<p>
<a href="#open-feedback-nieuw">slide bekijken</a> –
<a href="#open-feedback-nieuw">accepteren</a> –
<a href="#open-feedback-nieuw">weigeren</a>
</p>
</blockquote>
</section>
<section class="slide" id="open-feedback-figuur">
<h2>Webslides openstellen voor feedback</h2>
<img src="images/cocreatie.svg" alt="">
</section>
<section class="slide" id="open-feedback-uitleg">
<h2>Feedback verwerken kan sneller en eenvoudiger</h2>
<ul>
<li>PowerPoint-slides worden opgeslagen in een <strong>binair formaat</strong>.
<ul>
<li>Een wijziging kan het hele bestand veranderen.</li>
<li>Verschillen vinden is moeilijk, zeker over meerdere versies heen.</li>
<li><em>Track changes</em> is moeilijk met meerdere versies.</li>
</ul>
</li>
<li>Webslides worden opgeslagen als <strong>broncode</strong>.
<ul>
<li>Een wijziging verandert slechts een klein stuk van het bestand.</li>
<li>Tools om broncode samen te voegen bestaan al jaren.</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="versionering">
<h2>Webslides gebruiken een versiesysteem</h2>
<img src="images/versionering.svg" alt="">
</section>
<section class="toc slide" id="toc-voordelen">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li class="current"><a href="#toc-wat">Wat zijn Open Webslides?</a>
<ul>
<li><a href="#toc-wat">Webslides: een overzicht</a></li>
<li><a href="#toc-open">De invulling van “open”</a></li>
<li class="current"><a href="#toc-voordelen">Voor- en nadelen</a></li>
</ul>
</li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="voordelen-studenten">
<h2>Voordelen voor studenten</h2>
<ul>
<li>Webslides werken op <strong>ieder toestel</strong></li>
<li>De discussie kan <strong>overal</strong> plaatsvinden
<ul>
<li>link naar slides vanop Facebook, Twitter…</li>
</ul>
</li>
<li>Cursussen blijven meer <strong>up-to-date</strong></li>
<li><strong>Feedback</strong> geven is eenvoudig</li>
<li>Leren door <strong>co-creatie</strong></li>
<li>Deel <strong>annotaties</strong> met medestudenten</li>
</ul>
</section>
<section class="slide" id="voordelen-lesgevers">
<h2>Voordelen voor lesgevers</h2>
<ul>
<li>eenvoudig gebruik van <strong>multimedia en web</strong></li>
<li>beheer <strong>samen met collega’s</strong></li>
<li><strong>actuele slides</strong> door snelle updates
<ul>
<li>meerdere versies onderhouden is geen probleem meer</li>
</ul>
</li>
<li><strong>(internationale) erkenning</strong> door publieke aanwezigheid
<ul>
<li>slides kunnen gedeeld worden op Twitter</li>
<li>internationale collega's kunnen linken naar slides en feedback geven</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="voordelen-ugent">
<h2>Voordelen voor de UGent</h2>
<ul>
<li><strong>kruisbestuiving</strong> tussen verschillende cursussen
<ul>
<li><em>multiperspectivisme</em></li>
</ul>
</li>
<li>bevorderen van <strong>activerend onderwijs</strong></li>
<li>grotere <strong>betrokkenheid</strong> van huidige en toekomstige studenten</li>
<li><strong>maatschappelijke</strong> valorisatie</li>
<li><strong>economische</strong> valorisatie</li>
</ul>
</section>
<section class="slide" id="nadelen">
<h2>Mogelijke nadelen</h2>
<ul>
<li>vereist voorlopig meer <strong>technische kennis</strong>
<ul>
<li>binnen de UGent worden tools ontwikkeld</li>
<li>sommige lesgevers gebruiken nu reeds LaTeX-slides</li>
</ul>
</li>
<li>gebruik van <strong>auteursrechterlijk beschermd materiaal</strong> is moeilijker
<ul>
<li>binnen de UGent CAS-omgeving: <em>geen probleem</em></li>
<li>op het publieke web: <em>citaatrecht</em></li>
</ul>
</li>
</ul>
</section>
<section class="toc slide" id="toc-plannen">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li class="current"><a href="#toc-plannen">Wat zijn de UGent-plannen?</a>
<ul>
<li class="current"><a href="#toc-plannen">Innoversity Challenge</a></li>
<li><a href="#toc-toekomst">Geplande ontwikkelingen</a></li>
<li><a href="#toc-pilootprojecten">Pilootprojecten</a></li>
</ul>
</li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="innoversity-challenge">
<h2>Innoversity Challenge: “Open Webslides” was 1 van de 4 winnende ideeën</h2>
<ul>
<li>Ieder winnend team krijgt ondersteuning om hun project uit te werken:
<ul>
<li>financieel</li>
<li>organisatorisch</li>
<li>personeel</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="Two_steps">
<h2>Innoversity Challenge: Twee ontwikkelingslijnen</h2>
<ul>
<li>Technische ontwikkeling
<ul>
<li>toegankelijke editor met UGent sjabloon</li>
<li>integratie met Minerva en CAS</li>
</ul>
</li>
<li>Educatieve ontwikkeling
<ul>
<li>mindset</li>
<li>interactieve webtools</li>
<li>co-creatie bij verschillende groepen</li>
</ul>
</li>
</ul>
</section>
<section class="toc slide" id="toc-toekomst">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li class="current"><a href="#toc-plannen">Wat zijn de UGent-plannen?</a>
<ul>
<li><a href="#toc-plannen">Innoversity Challenge</a></li>
<li class="current"><a href="#toc-toekomst">Geplande ontwikkelingen</a></li>
<li><a href="#toc-pilootprojecten">Pilootprojecten</a></li>
</ul>
</li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="ontwikkelomgeving">
<h2>Een ontwikkelomgeving voor webslides</h2>
<ul>
<li>Webslides bouwen <strong>met de hand</strong> vereist technologische kennis
<ul>
<li>voordeel: focus op structuur</li>
</ul>
</li>
<li>Een <strong>grafische editor</strong> biedt een bekende omgeving
<ul>
<li>uitdaging: focus op structuur behouden</li>
</ul>
</li>
<li><strong>Interactiviteit toevoegen</strong> (YouTube, Twitter, Facebook…) met één klik
<ul>
<li>ieder nieuw web-element kan meteen op een slide gezet worden</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="samenwerkingsomgeving">
<h2>Een samenwerkingsomgeving voor webslides</h2>
<ul>
<li><strong>samen slides bewerken</strong> met collega's</li>
<li>eenvoudig <strong>aanpassingen van studenten</strong> accepteren of weigeren</li>
<li><strong>verschillende versies</strong> naast elkaar beheren en synchroniseren</li>
</ul>
</section>
<section class="slide" id="discussieomgeving">
<h2>Een discussieomgeving voor webslides</h2>
<ul>
<li>discussie <strong>op de slides</strong>
<ul>
<li>commentaren <em>toevoegen</em></li>
<li>commentaren <em>delen</em></li>
<li><em>zichtbaar</em> en onzichtbaar maken van commentaren</li>
</ul>
</li>
<li>discussie <strong>buiten de slides</strong>
<ul>
<li>commentaren <em>vinden</em> en <em>aggregeren</em> van andere sites</li>
</ul>
</li>
</ul>
</section>
<section class="toc slide" id="toc-pilootprojecten">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li class="current"><a href="#toc-plannen">Wat zijn de UGent-plannen?</a>
<ul>
<li><a href="#toc-plannen">Innoversity Challenge</a></li>
<li><a href="#toc-toekomst">Geplande ontwikkelingen</a></li>
<li class="current"><a href="#toc-pilootprojecten">Pilootprojecten</a></li>
</ul>
</li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="didactische_kaders1">
<h2>Didactisch kader</h2>
<ul>
<li>co-creatie door <strong>studenten</strong>
<ul>
<li>zullen studenten wel <em>bijdragen</em>?</li>
<ul>
<li>bijdrages volgen een power-curve</li>
<li>incentive structuur mogelijk (traceerbaar)</li>
</ul>
<li>zal er geen <em>overload</em> aan lesmateriaal ontstaan?</li>
<li>wat is de <em>finale cursus</em> en hoe is die afgebakend?</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="didactische_kaders2">
<h2>Didactisch kader</h2>
<ul>
<li>drempels bij <strong>docenten</strong>
<ul>
<li>openstaan voor correcties</li>
<li>overload van suggesties?</li>
<li>hoe omgaan met ongepaste opmerkingen?</li>
<li>de cursus mag ook niet te perfect worden</li>
<ul>
<li>opstapje naar flipped classrooom</li>
</ul>
</ul>
</li>
</ul>
</section>
<section class="slide" id="cocoon">
<h2>COCOON-project</h2>
<ul>Het COCOON-project brengt pioniers samen die experimenteren met interactief lesmateriaal en co-creatie.
<li>
<strong><a href="http://rubenverborgh.github.io/WebFundamentals/">Web Fundamentals</a></strong>,
een module uit het vak <a href="http://studiegids.ugent.be/2016/NL/studiefiches/C003779.pdf">Webdevelopment</a>
</li>
<li>
<strong><a href="https://bovi-analytics.github.io/BigDataForDairyResearch/">Reproduction, Obstetrics and Herd Health</a></strong>
aan de <a href="https://www.ugent.be/di/nl">Faculteit Diergeneeskunde</a>
</li>
<li>
<strong><a href="#voorbeelden">De slides die je nu bekijkt</a> 😉</strong>
</li>
<li>Integratie met <a href="http://zephyr.ugent.be/main/learning_path/lp_controller.php?cidReq=WEBINARFLIPPINGTHECL&action=view&lp_id=17011">flipped classroom</a> en <a href="https://perusall.com/">social annotations</a></li>
<li>Co-creatie in de lerarenopleiding aan de VUB</li>
</ul>
</section>
<section class="toc slide" id="toc-start">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li class="current"><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a>
<ul>
<li class="current"><a href="#toc-start">Online ontwikkeltools</a></li>
<li><a href="#toc-code">Aan de slag met code</a></li>
<li><a href="#toc-migratie">Bestaande slides migreren</a></li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="Slides.com">
<h2>Online editor voor webslides</h2>
<ul>Voor wie geen HTML of Markdown adept is, zijn er verschillende online editors die toelaten webslides te maken in een grafische interface.
<li>In deze <a href="#Slides.comDemo">demo</a> geven we een voorbeeld van hoe je webslides kan maken via <a href="https://slides.com/">Slides.com</a> (gratis versie).</li>
</ul>
</section>
<section class="slide" id="Slides.comDemo">
<iframe src="https://www.youtube.com/embed/V-Ath-3BRw8?start=0&end=351;cc_load_policy=1&hl=en&iv_load_policy=3&disablekb=1&rel=0&showinfo=0&autohide=1" height="480" width="820"></iframe>
</section>
<section class="slide" id="Slides.com Mentimeter">
<h2>Uw mening uit de preview</h2>
<iframe src="https://www.mentimeter.com/s/22b6718aa98a08cb588f9f7ea09b8719/15283c92d54c" height="440" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 14 93 27)</ul>
</section>
<section class="toc slide" id="toc-code">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li class="current"><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a>
<ul>
<li><a href="#toc-start">Online ontwikkeltools</a></li>
<li class="current"><a href="#toc-code">Aan de slag met code</a></li>
<li><a href="#toc-migratie">Bestaande slides migreren</a></li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="GitHub">
<h2>UGent GitHub sjabloon voor webslides</h2>
<ul>Docenten die een basiskennis hebben van de opmaaktalen <a href="https://developer.mozilla.org/en-US/docs/Web/HTML">HTML</a> of <a href="https://daringfireball.net/projects/markdown/">Markdown</a> kunnen meteen hun eerste webslides maken via bv. <a href="https://github.com/OpenWebSlides/EmptySlidedeck">dit GitHub-sjabloon</a>.
<li>Om het gemakkelijker te maken hebben we er ook een <a href="#GitHubDemo">demo</a> bij voorzien.</li>
</ul>
</section>
<section class="slide" id="GitHubMentimeter">
<h2>Uw mening uit de preview</h2>
<iframe src="https://www.mentimeter.com/s/22b6718aa98a08cb588f9f7ea09b8719/cf09b310e330" height="440" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 14 93 27)</ul>
</section>
<section class="slide" id="GitHubDemo">
<iframe src="https://www.youtube.com/embed/NvWTjEdKVfM?start=0&end=351;cc_load_policy=1&hl=en&iv_load_policy=3&disablekb=1&rel=0&showinfo=0&autohide=1" height="480" width="820"></iframe>
</section>
<section class="slide" id="vergelijking">
<h2>Vergelijking online slide-mogelijkheden</h2>
<table>
<tr>
<td> </td>
<th>Slides.com</th>
<th>Office 365</th>
<th>Open Webslides</th>
</tr>
<tr class="next">
<th>platform</th>
<td>browser</td>
<td>browser</td>
<td>browser</td>
</tr>
<tr class="next">
<th>editor</th>
<td>grafisch</td>
<td>grafisch</td>
<td>tekst (voorlopig)</td>
</tr>
<tr class="next">
<th>evolutie</th>
<td>moeilijk</td>
<td>moeilijk</td>
<td>makkelijk</td>
</tr>
<tr class="next">
<th>co-creatie</th>
<td>gelijktijdig</td>
<td>gelijktijdig</td>
<td>versie-gebaseerd</td>
</tr>
</table>
<!-- <p class="next"> -->
<!-- <label><input id="old-template" type="checkbox"> vorige huisstijl</label> -->
<!-- </p> -->
<!-- <script> -->
<!-- var templateSwitch = document.getElementById('old-template'); -->
<!-- var mainStyle = document.getElementById('style'); -->
<!-- var newTemplate = mainStyle.href; -->
<!-- var oldTemplate = '//rubenverborgh.github.io/InnoversityChallengeCoachingDays/styles/screen-16x10.css'; -->
<!-- templateSwitch.addEventListener('change', function () { -->
<!-- mainStyle.href = templateSwitch.checked ? oldTemplate : newTemplate; -->
<!-- }); -->
<!-- </script> -->
</section>
<section class="toc slide" id="toc-migratie">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li class="current"><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a>
<ul>
<li><a href="#toc-start">Online ontwikkeltools</a></li>
<li><a href="#toc-code">Aan de slag met code</a></li>
<li class="current"><a href="#toc-migratie">Bestaande slides migreren</a></li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="migratie">
<h2>Migratie vanuit Powerpoint</h2>
<ul>
<li>Dit is grotendeels <strong>mogelijk</strong></li>
<ul>
<li>De inhoud en een deel van de layout kan <strong>automatisch</strong> overgenomen worden</li>
</ul>
<li>Maar zal sowieso <strong>aanpassingen</strong> vergen</li>
<ul>
<li>Noodzaak om <strong>inhoud en opmaak</strong> te scheiden</li>
<li>Benutten van <strong>webtools</strong> zoals links, embedde content etc.</li>
</ul>
</ul>
</section>
<section class="toc slide" id="recap">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li><a href="#toc-wat">Wat zijn Open Webslides?</a></li>
<li><a href="#toc-plannen">Wat zijn de UGent-plannen?</a></li>
<li><a href="#toc-start">Hoe kan ik vandaag aan de slag?</a></li>
</ul>
</section>
<section class="slide" id="end">
<h2>Open Webslides binnen de UGent</h2>
<ul>
<li>Op <strong>Open Webslides</strong> kan je rekenen voor
<ul>
<li>interactiviteit en multimedia</li>
<li>co-creatie</li>
<li>een open platform voor onderwijsinnovatie</li>
</ul>
</li>
<li><strong>Je kan reeds aan de slag</strong> mits enige technische vaardigheid
<ul>
<li>UGent werkt aan een gebruiksvriendelijke interface</li>
</ul>
</li>
</ul>
</section>
<section class="slide" id="Laatste_vraag">
<iframe src="https://www.mentimeter.com/s/69d4190006f57aacde779d5544594735/0fc2efc5e4ab" height="500" width="820"></iframe>
<ul class="center">Doe mee op <a href="https://www.menti.com/d4101a/0">www.menti.com</a> (code 55 84 01)</ul>
</section>
<div class="progress"></div>
<footer class="badge">
<a href="https://github.com/OpenWebslides/BroodjeMartinnovatie">Fork me on GitHub</a>
</footer>
<script src="scripts/shower.min.js"></script>
<script async src="//platform.twitter.com/widgets.js"></script>
<script async src="//connect.facebook.net/nl_BE/sdk.js#xfbml=1&version=v2.8&appId=214807838538922"></script>
</body>
</html>