-
Notifications
You must be signed in to change notification settings - Fork 0
/
elearning.html
216 lines (196 loc) · 12.3 KB
/
elearning.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="eLearning Gallery" />
<meta property="og:image" content="http://toddmez.site44.com/banner1.3.jpg" />
<meta property="og:description" content="a gallery of eLearning activities built in Storyline" />
<meta property="og:url" content="http://toddmez.site44.com/home.html" />
<title>Todd Mesewicz's Portfolio</title>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125841501-3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-125841501-3');
</script>
<!-- Bootstrap -->
<link href="css/bootstrap-4.0.0.css" rel="stylesheet">
<link href="css/stylesEL.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet">
<link rel="stylesheet" href="js/aos-master/dist/aos.css">
<script src="js/aos-master/dist/aos.js"></script>
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Anton|Merriweather|Open+Sans:700" rel="stylesheet">
<link href="js/lightGallery-master/dist/css/lightgallery.css" rel="stylesheet">
<link href="js/lightGallery-master/dist/css/lg-transitions.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-dark navbar-custom navbox" data-aos="slide-down" data-aos-offset="200" data-aos-easing="ease-in-sine" data-aos-duration="200" >
<a class="navbar-brand" href="#"><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation"><h1><span style="font-style:italic; font-weight:300; font-size:.8em;"></span> <span style="font-style:normal; font-weight:500;">Todd Mesewicz</span></h1></button></a>
<button class="navbar-toggler btn-success1" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<div class="col-sm-12 col-md-12 col-lg-12 col-xl-12">
<!--First Card -->
<div class="card text-white bg-dark mb-3">
<div class="card-body">
<h5 class="card-title">Recent Accomplishments</h5>
<p class="card-text">
<ul>
<li>Developed specific workflows to improve media development such as LMS API content distribution and bulk front loading of placeholder content.</li>
<li>Trained members of the team on best practices on topics such as video editing, ftp, thumbnail creation.</li>
<li>Served as a support liason for both technical assistance and LMS support.</li>
</ul>
</p> <p class="card-text"><small class="text-muted"></small></p>
</div>
</div>
<!--Middle Card -->
<div class="card text-white bg-dark mb-3">
<div class="card-body">
<h5 class="card-title">Past Achievements</h5>
<p class="card-text"><ul>
<li>Implemented a complete video production pipeline for an online graduate school and within a year developed over 200 unique and feature rich presentations to drive financial aid process, supplement student nursing orientations and increase teacher online presence.</li>
<li>Developed responsive user navigation for university’s LMS system Canvas.</li>
<li>Created fully branded responsive digital documentation, interactive guides and eBooks with supporting tutorial video screen casts.</li>
</ul>
<p class="card-text"><small class="text-muted"></small></p>
</p>
</div>
</div>
<!--Last Card -->
<div class="card text-white bg-dark mb-3">
<div class="card-body">
<h5 class="card-title">Todd's Resume/CV</h5>
<p class="card-text">Click to download my resume in <a href="media/misc/ToddMesewicz_resume.pdf" target="_blank">PDF format</a></p>
<p class="card-text">Click to download my resume in <a href="media/misc/ToddMesewicz_resume.docx" target="_blank">Word format</a></p>
<p class="card-text"><small class="text-muted"></small></p>
</div>
</div>
</div>
</div>
</nav>
<!-- Start of Storylines -->
<div class="mt-2" style="background:rgba(229,229,229,.3);">
<button class="navbar-toggler btn-blue" type="button" data-toggle="collapse" data-target="#navbarToggleGD" aria-controls="navbarToggleGD" aria-expanded="false" aria-label="Toggle navigation">
<h1><span style="font-weight:500;font-style:oblique;">e</span><span style="font-weight:700;">Learning</span></h1></button>
<div class="collapse show" id="navbarToggleGD">
<div class="navbar navbar-dark navbar-custom bg01">
<div class="col-sm-12 col-md-12 col-lg-12 col-xl-12 ml-2" id="mezgal1">
<a id="open-mf" data-src="media/id_process/storyboards/sb_mf.png" href="media/id_process/storyboards/sb_mf.png">
<img src="media/interactives/thumbs/all_thumbs-assets/MFtsb.png" class="Intgal" alt="Storyboard for Muscle Fibers" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-mf" data-src="media/interactives/MuscleFibers/index.html" href="media/interactives/MuscleFibers/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/MF.png" class="Intgal" alt="Muscle Fibers" data-aos="flip-up" data-aos-delay="100">
</a>
<!-- <a data-iframe="true" height="200" width="300" id="open-mc"
data-src="media/interactives/MuscleContraction/index.html" href="media/interactives/MuscleContraction/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/MFt.png" class="Intgal" alt="Muscle Contraction" data-aos="flip-up" data-aos-delay="200">
</a> -->
<a data-iframe="true" height="200" width="300" id="open-mc" data-src="media/id_process/storyboards/sb_rop.pdf" href="media/id_process/storyboards/sb_rop.pdf">
<img src="media/interactives/thumbs/all_thumbs-assets/ropsb.png" class="Intgal" alt="The Role of Play in Development. Rise eLearning" data-aos="flip-up"
data-aos-delay="100">
</a>
<a data-iframe="true" height="200" width="300" id="open-mc" data-src="media/interactives/RoleofPlayinDevelopment/index.html" href="media/interactives/RoleofPlayinDevelopment/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/rop.png" class="Intgal" alt="The Role of Play in Development. Rise eLearning" data-aos="flip-up"
data-aos-delay="100">
</a>
<a data-iframe="true" id="open-cr" data-src="media/id_process/storyboards/sb_cm.pdf" href="media/id_process/storyboards/sb_cm.pdf">
<img src="media/interactives/thumbs/all_thumbs-assets/cmtsb.png" class="Intgal" alt="Storyline on Conflict Resolution Interactive eLearning" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-cr" data-src="media/interactives/ConflictResolution/index.html" href="media/interactives/ConflictResolution/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/CMt.png" class="Intgal" alt="Storyline on Conflict Resolution Interactive eLearning" data-aos="flip-up" data-aos-delay="100">
</a>
<a id="open-mt" data-src="media/id_process/storyboards/sb_mt.png" href="media/id_process/storyboards/sb_mt.png">
<img src="media/interactives/thumbs/all_thumbs-assets/Mttsb.png" class="Intgal" alt="Storyboard on Membrane Transport" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-mt" data-src="media/interactives/MembraneTransportTrans/index.html" href="media/interactives/MembraneTransportTrans/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/MTt.png" class="Intgal" alt="Storyline on Membrane Transport" data-aos="flip-up" data-aos-delay="100">
</a>
<a id="open-vt" data-src="media/id_process/storyboards/sb_vt.png" href="media/id_process/storyboards/sb_vt.png">
<img src="media/interactives/thumbs/all_thumbs-assets/VTtsb.png" class="Intgal" alt="Storyboard for Vesicular Transport" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-vt" data-src="media/interactives/VesicularTransport/index.html" href="media/interactives/VesicularTransport/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/VTt.png" class="Intgal" alt="Storyline on Vesicular Transport" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-gd" data-src="media/id_process/storyboards/sb_gd.pdf" href="media/id_process/storyboards/sb_gd.pdf">
<img src="media/interactives/thumbs/all_thumbs-assets/GDtsb.png" class="Intgal" alt="Storyline on Growth and Development" data-aos="flip-up" data-aos-delay="100">
</a>
<a data-iframe="true" id="open-gd" data-src="media/interactives/GrowthandDevelopment/index.html" href="media/interactives/GrowthandDevelopment/index.html">
<img src="media/interactives/thumbs/all_thumbs-assets/GDt.png" class="Intgal" alt="Storyline on Growth and Development Interactive eLearning" data-aos="flip-up" data-aos-delay="100">
</a>
<div id="mezgal1">
<a data-iframe="true" id="open-gd" data-src="media/id_process/Inst_Tech_Ref_Sheet_v2.1.pdf" href="media/id_process/Inst_Tech_Ref_Sheet_v2.1.pdf">
<img src="media/id_process/all_thumbs-assets/ID1.png" class="Intgal" alt="Guide to free software and Blooms Mapping" data-aos="flip-up"
data-aos-delay="100">
</a>
<a data-iframe="true" id="open-pdf" data-src="media/id_process/autocad.pdf" href="media/id_process/autocad.pdf">
<img src="media/id_process/all_thumbs-assets/ID2.png" class="Intgal" alt="Student guide to downloading Autodesk software for home use" data-aos="flip-up" data-aos-delay="100">
</a>
</div>
<div id="mezgal1">
<a id="open-gd" href="https://vimeo.com/371999266">
<img src="media/id_process/all_thumbs-assets/gswmss.png" class="Intgal" alt="Overview of Microsoft SWAY" data-aos="flip-up"
data-aos-delay="100">
</a>
<a id="open-gd" href="https://vimeo.com/328057754">
<img src="media/id_process/all_thumbs-assets/dpo.png" class="Intgal" alt="Overview of media development process" data-aos="flip-up"
data-aos-delay="100">
</a>
<a id="open-gd" href="https://vimeo.com/328057702">
<img src="media/id_process/all_thumbs-assets/sib.png" class="Intgal" alt="Navigating Dropbox Folder" data-aos="flip-up"
data-aos-delay="100">
</a>
<a id="open-gd" href="https://vimeo.com/328057794">
<img src="media/id_process/all_thumbs-assets/frp.png" class="Intgal" alt="Search Smart Image Base" data-aos="flip-up"
data-aos-delay="100">
</a>
</div>
</div>
</div>
</div> <!--end of row-->
</div> <!--end of container-->
</div> <!--end of navbar-->
</div> <!--end of collapse-->
<nav class="navbar navbar-dark navbar-custom">
<button class="navbar-toggler btn-success1 btn-block" type="button" data-toggle="collapse" data-target="#navbarToggleGD" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</nav>
</div> <!--end of fadebox-->
</div> <!--end of collapse-->
</div> <!--end of fade box-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery-3.2.1.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/popper.min.js"></script>
<script src="js/bootstrap-4.0.0.js"></script>
<script src="js/aos-master/dist/aos.js"></script>
<script>
AOS.init({
easing: 'ease-in-out-sine',
duration: 600,
});
</script>
<script src="js/lightGallery-master/dist/js/lightgallery-all.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#mezgal1").lightGallery({
mode:'lg-soft-zoom',
cssEasing : 'cubic-bezier(0.25, 0, 0.25, 1)',
share: false,
thumbnails: false,
download: false,
autoplayControls: false,
fullScreen: true,
zoom: true,
closeable: true,
iframeMaxWidth: '1000px',
});});
</script>
</body>
</html>