This repository has been archived by the owner on Jan 25, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
203 lines (188 loc) · 8.86 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
<!DOCTYPE html>
<html lang="nl">
<head>
<title>Open-source Lesslides</title>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles/screen-16x10.css">
<link rel="stylesheet" href="styles/innoversity.css">
</head>
<body class="shower list">
<header class="caption">
<h1>Open-source lesslides</h1>
<p>
<a href="http://ruben.verborgh.org/">Ruben Verborgh</a>,
<a href="https://www.linkedin.com/in/estherdeloof/">Esther De Loof</a>,
<a href="https://www.linkedin.com/in/bramdejaegher/">Bram De Jaegher</a>
</p>
</header>
<div class="title slide" id="cover">
<a>
<img src="images/innoversity-logo.svg" alt="Innoversity Challenge" class="logo">
</a>
<h2>Open-source lesslides</h2>
<h3>Hoe interactief en aanpasbaar lesmateriaal<br>
afstanden binnen onderwijs kan verkleinen</h3>
<p>
<a href="http://ruben.verborgh.org/">Ruben Verborgh</a>,
<a href="https://www.linkedin.com/in/estherdeloof/">Esther De Loof</a>,
<a href="https://www.linkedin.com/in/bramdejaegher/">Bram De Jaegher</a>
<a href="https://creativecommons.org/licenses/by/4.0/" class="license">
<img src="images/cc-by.svg" alt="This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.">
</a>
</p>
</div>
<div class="white slide" id="overhead-projector">
<figure>
<img src="images/overhead-projector.jpg" alt="" class="cover">
<figcaption class="white">
CC BY-SA 3.0
<a href="https://en.wikipedia.org/wiki/Overhead_projector#/media/File:OHP-sch.JPG">Wikipedia</a>
</figcaption>
</figure>
</div>
<div class="slide" id="team">
<h2>Innoversity Challenge team</h2>
<div class="person">
<img src="images/Bram.png">
<p class="name"><a href="https://www.linkedin.com/in/bramdejaegher/">Bram De Jaegher</a></p>
<p class="job">masterstudent</p>
<p class="faculty">Faculteit Bio-ingenieurswetenschappen</p>
</div>
<div class="person">
<img src="images/ruben.jpg">
<p class="name"><a href="http://ruben.verborgh.org/">Ruben Verborgh</a></p>
<p class="job">postdoctoraal onderzoeker</p>
<p class="faculty">Faculteit Ingenieurswetenschappen en Architectuur</p>
</div>
<div class="person">
<img src="images/esther.jpg">
<p class="name"><a href="https://www.linkedin.com/in/estherdeloof/">Esther De Loof</a></p>
<p class="job">doctoraatsstudente</p>
<p class="faculty">Faculteit Psychologie en Pedagogische Wetenschappen</p>
</div>
</div>
<div class="slide" id="html">
<h2>Maak slides zoals websites</h2>
<img src="images/html-slides.svg" alt="">
</div>
<div class="slide" id="github">
<h2>Bewerk slides zoals open-source</h2>
<img src="images/open-source.svg" alt="">
</div>
<div class="slide" id="twitter">
<h2>Integratie met sociale media</h2>
<blockquote class="twitter-tweet" lang="en"><p lang="en" dir="ltr">Really insightful and well-made short video about the future of education and learning. See <a href="http://t.co/0KElIWXS">http://t.co/0KElIWXS</a></p>— Daphne Koller (@DaphneKoller) <a href="https://twitter.com/DaphneKoller/status/260974670470316033">October 24, 2012</a></blockquote>
</div>
<div class="slide" id="youtube">
<h2>YouTube-clips naadloos embedden</h2>
<iframe width="820" height="400" src="https://www.youtube.com/embed/U6FvJ6jMGHU?version=3&start=1197&end=1206&rel=0" frameborder="0" allowfullscreen></iframe>
</div>
<div class="slide" id="graph">
<h2>Interactie met grafieken</h2>
<div id="chart"></div>
</div>
<div class="white slide" id="ufo">
<figure>
<img src="images/students.jpg" alt="" class="cover">
<figcaption class="white">
<a href="http://deredactie.be/cm/vrtnieuws/binnenland/1.2182974">Belga</a>
</figcaption>
</figure>
</div>
<div class="slide" id="students">
<h2>Impact voor studenten</h2>
<ul>
<li>
De <strong>discussie</strong> komt dichter bij het lesmateriaal.
</li>
<li>
Je kan veel sneller <strong>feedback</strong> geven.
</li>
<li>
HTML-slides werken op <strong>ieder toestel</strong>.
<ul>
<li>laptop, smartphone, tablet…</li>
<li>zonder software te installeren</li>
</ul>
</li>
</ul>
</div>
<div class="slide" id="lecturers">
<h2>Impact voor lesgevers</h2>
<ul>
<li>
<strong>Feedback</strong> krijgt een lagere drempel en komt sneller.
<ul>
<li>nu komt feedback vaak niet, of te laat</li>
</ul>
</li>
<li>
Slides kunnen organisch <strong>groeien</strong>.
<ul>
<li>oplossingen voor nu en volgende jaren</li>
</ul>
</li>
<li>
Gedeelde slides leiden tot sterke <strong>internationale visibiliteit</strong>.
</li>
</ul>
</div>
<div class="slide" id="ugent">
<h2>Impact voor UGent</h2>
<ul>
<li>
Slides kunnen <strong>multidisciplinair</strong> naar elkaar linken.
</li>
<li>
De <strong>relevantie</strong> van onderwijsmateriaal wordt versterkt.
<ul>
<li>antwoord op MOOCs</li>
</ul>
</li>
<li>
Open lesmateriaal brengt directe <strong>maatschappelijke valorisatie</strong>.
<ul>
<li>effent de weg voor <strong>economische valorisatie</strong></li>
</ul>
</li>
</ul>
</div>
<div class="slide" id="incubator">
<img class="avatar" alt="Ruben Verborgh" style="top: 200px; left: 215px" src="images/ruben.jpg">
<img class="avatar" alt="Esther De Loof" style="top: 185px; left: 375px" src="images/esther.jpg">
<img class="avatar" alt="Bram De Jaegher" style="top: 180px; left: 530px" src="images/Bram.png">
<img class="avatar" alt="Myrtle Verhaeven" style="top: 190px; left: 685px" src="http://images.weserv.nl/?url=images.pitchero.com%2Fui%2F572556%2F1359563793_0.jpg&w=200&h=200&t=square&q=40">
<img class="avatar" alt="Stijn Van Hoey" style="top: 235px; left: 835px" src="https://media.licdn.com/dms/image/C4D03AQFQ9ANAeEts8Q/profile-displayphoto-shrink_800_800/0?e=1531958400&v=beta&t=vbgQPcVtl4SaAtLqv7WFMrKdvNPq6Ip7S2iY_cevoco">
<img class="avatar" alt="Wouter Naessens" style="top: 370px; left: 855px" src="https://media.licdn.com/dms/image/C4D03AQFOEjd2jAGXsQ/profile-displayphoto-shrink_800_800/0?e=1531958400&v=beta&t=NICrIICVEZJ4MYB_sfwgVkpU0Xy4RRKzSltmU2TjFJQ">
<img class="avatar" alt="Alain Verstraete" style="top: 465px; left: 735px" src="http://www.tiaft.org/data/uploads/portraits/alain.jpg">
<img class="avatar" alt="Stefaan Cottenier" style="top: 500px; left: 580px" src="http://images.weserv.nl/?url=i1.rgstatic.net%2Fii%2Fprofile.image%2FAS%253A272469755953174%25401441973261035_l%2FStefaan_Cottenier.png&w=200&h=200&t=square&q=40">
<img class="avatar" alt="Marc Brysbaert" style="top: 500px; left: 420px" src="http://www.frontiersin.org/files/Profile%20Library/11201/Thumb_203_203.jpg?v=6412">
<img class="avatar" alt="Clio Janssens" style="top: 480px; left: 265px" src="https://media.licdn.com/dms/image/C5603AQExd4k0WxXLZQ/profile-displayphoto-shrink_800_800/0?e=1531958400&v=beta&t=7L06B3dBYuedOeaHrQDCYWfl62d5tpyXEGjlQYeT-p8">
<img class="avatar" alt="Dries Vanacker" style="top: 420px; left: 130px" src="https://media.licdn.com/dms/image/C4D03AQEdxEsUVVRdpQ/profile-displayphoto-shrink_800_800/0?e=1531958400&v=beta&t=3U18Jo5A2YiLj1XA-1dQoHHRk3GXL5t2AFgQHugAa5w">
<img class="avatar" alt="Michiel Stock" style="top: 295px; left: 110px" src="https://media.licdn.com/dms/image/C4D03AQHS8snrhLxpCg/profile-displayphoto-shrink_800_800/0?e=1531958400&v=beta&t=KRdlSJlpjogOeRT77tGGhOrgif8rvMzjOcAAULH-YYg">
<div class="avatar next" style="top: 345px; left: 490px"></div>
<h2 class="next">Incubator voor open-source slides</h2>
</div>
<div class="white slide" id="next">
<figure>
<img src="images/ufo.jpg" alt="" class="cover">
<figcaption class="white">
<a href="http://communicatiehuis.be/realisatie-kunstwerk-klimaatparcours-gent/">Thomas Lommée</a>
</figcaption>
</figure>
<p>
<a href="https://twitter.com/intent/tweet?button_hashtag=Innoversity" class="twitter-hashtag-button" data-url="https://github.com/OpenWebslides/InnoversityChallenge/" data-dnt="true">Tweet #Innoversity</a>
</p>
</div>
<div class="progress"></div>
<footer class="badge">
<a href="https://github.com/OpenWebslides/InnoversityChallenge">Fork me on Github</a>
</footer>
<script src="scripts/shower.min.js"></script>
<script src="http://platform.twitter.com/widgets.js"></script>
<script src="scripts/canvasjs.min.js"></script>
<script src="scripts/grafieken.js"></script>
</body>
</html>