-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
462 lines (445 loc) · 25.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
<!DOCTYPE HTML>
<head>
<title>Ray Balhorn - Portfolio - Media Design Specialist</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="/favicon.ico" />
<!-- Meta Tags-->
<meta name="keywords" content="Ray Balhorn, Website Design, Web, Internet, Blu-Ray, Video, Compression, Programming, PHP, Javascript" />
<meta name="description" content="Ray Balhorn, a Web Designer & Media Specialist based in Salt Lake City, UT" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- CSS -->
<link href="/main.css?ver=21" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css"> <!-- GLightbox -->
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> <!-- aos -->
<!-- Javascript -->
<script src="https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js"></script> <!-- GLightbox -->
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script><!-- aos -->
</head>
<body>
<div id="header">
<a href="/"><img src="/img/rb_logo_paint.png" alt="logo" /></a>
<div class="container">
<div class="title">Media Engineer, Cloud Solutions Architect - Irvine, CA</div>
</div>
</div>
<div id="experience">
<div class="container">
<!-- <h2>Experience</h2> -->
<div class="item" data-aos="fade-right" data-aos-duration="2000">
<div class="description left">
<h2>Media Cloud Solutions Architect</h2>
<p>
AWS CSA Certified
</p>
<p>
10 years professional live streaming experience
</p>
<p>
8 years operational, engineering, and program management experience
</p>
<p>
Architected a multi-cloud based infrastructure for live streaming and on demand delivery
</p>
<p>
Understanding of digital media and broadcast specifications and standards (HLS, RTMP, Dash, codecs, 608/708, etc.)
</p>
</div>
<img src="/img/portfolio/aws_800x500.png" alt="csa" class="right">
</div>
<div class="item" data-aos="fade-left" data-aos-duration="1000">
<div class="description right">
<h2>Product Management / Solutions Manager</h2>
<p>
Master’s Degree - Instructional Design and Education Technology
</p>
<p>
3+ Years Product Management / Solutions Management
</p>
<p>
7 years user experience and user interaction design experience
</p>
<p>
Experience with Agile, Waterfall, Scrum, and other project based development strategies
</p>
</div>
<img src="/img/portfolio/lep_800x500.png" alt="project" class="left">
</div>
<div class="item" data-aos="fade-right" data-aos-duration="1000">
<div class="description left">
<h2>Software Engineer / Developer</h2>
<p>
10 years programming and development experience
</p>
<p>
6 years user experience and user interaction design experience
</p>
<p>
Deep understanding of AWS SDK and application integration
</p>
<p>
Proficient in advanced javascript (Node, Typescript, Angular, etc.)
</p>
<p>
Architected highly scalable and available pub-sub, and API based applications
</p>
</div>
<img src="/img/portfolio/novel_mobile_800x500.png" alt="project" class="right">
</div>
</div>
<br class="clear" />
</div>
<div id="portfolio">
<div class="container">
<h2>Portfolio</h2>
<p>A sampling of the many media projects I have worked on</p>
<ul class="portfolio">
<li><a href="/img/portfolio/aws_800x500.png"
data-title="LDS General Conference AWS workflow"
data-project-type="Project / Team Managment"
data-description="For years, LDS General Conference was an in house, on-premise production. The task our team was handed, was to design a workflow that used Amazon Web Service's web computing and storage to produce all the necessary media files and distribtuion capabilities all within one cloudbased eco system. Doing this involved a lot of systems to talk to one another using APIs. In the end, we have saved a lot of man hours, reduced deliverable deadlines, as well as reduced on-premise systems"
data-gallery="portfolio"
data-aos="zoom-in"
data-aos-duration="500"
class="img glightbox">
<img src="/img/portfolio/aws_150x150.png" alt="aws workflow" />
</a>
</li>
<li><a href="/img/portfolio/lep_800x500.png"
data-title="Live Event Portal"
data-project-type="API Design, Website Design, Instructional Design"
data-description=" The Live Event Portal allows broadcast operations personnel easily add all the resouces necessary for online streaming in one location. This not only enters time based event settings to the live encoders for several CDNs, but also creates assets in our digital asset management system - Brightcove."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="50"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/lep_150x150.png" alt="live event website" />
</a>
</li>
<li><a href="/img/portfolio/ipadclass-800x500.png"
data-title="iPad Class Activities"
data-project-type="Instructional Design, Website Design"
data-description="This was a complete instructional design implementation from the top down for my Masters Capstone project. This project utilizes ADDIE principles of instructional design. A full portfolio of evidences and proceedures was kept to chronicle the process this project underwent."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="100"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ipadclass-150x150.png" alt="ipadclassactivities website" />
</a>
</li>
<li><a href="/img/portfolio/ehsl-new-800x500.png"
data-title="EHSL (development)"
data-project-type="Instructional Design, Website Design"
data-description="This is a new development of the Eccles Health Sciences Library's main website. This project has gone from multiple prototypes and wireframe models to simplify the interface for easier access, usability, and accessibility. Since this site is under development, access is restricted to view the project directly."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="150"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ehsl-new-150x150.png" alt="EHSL (development) website" />
</a>
</li>
<li><a href="/img/portfolio/ehsl_800x500.png"
data-title="EHSL"
data-project-type="Website Design"
data-description="This was one of the largest project I have worked on. In collaboration with other programmers, I was tasked to redesign the look and feel of the existing Eccles Health Sciences Library's website. I was given some specific branding instructions to keep the website in line with the existing University of Utah website, but overall the design was my own."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="200"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ehsl_150x150.png" alt="EHSL website" />
</a>
</li>
<li><a href="/img/portfolio/ecg_800x500.png"
data-title="ECG Learning Center"
data-project-type="Instructional Design, Website Design"
data-description="This was a complete update to an older site, which the author wanted me to give an "modern" look and enhance its educational value. We also wanted it to work on mobile devices as much as possible. I worked with the content expert, Dr. Yanowitz, to create interactive quizzes to accompany the curriculum content and updated the images in his collection. I created a responsive layout for the content that works perfectly for this site, something many students who use this website have been very appreciative of."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="250"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ecg_150x150.png" alt="ECG website" />
</a>
</li>
<li><a href="https://www.youtube-nocookie.com/embed/HOT7QVQx4Z0"
data-type="video"
data-source="youtube"
data-title="The Tops of The Mountains"
data-project-type="Video Production"
data-description="The Tops of the Mountains: An Illustrated History of Utah, was a documentary created by Panacom Productions about the history of Utah and debuted on KBYU and KSL in 1996; the year Utah celebrated its centennial. This documentary featured many of the state's premier historians and was hosted by Merlin Olsen."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="300"
class="video img glightbox">
<img src="/img/portfolio/tops_150x150.png" alt="The Tops of the Mountains" />
</a>
</li>
<li><a href="/img/portfolio/apcmcloud_800x500.png"
data-title="A+ Computer Medik Cloud Services"
data-project-type="Website Design"
data-description="I created the website and logo design for the cloud services page for A+ Computer Medik. This website is a front end for information and login to the main cloud services entry. The design objective for this site was to be clean, fast, and simple."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="350"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/apcmcloud_150x150.png" alt="APCM cloud services website" />
</a>
</li>
<li><a href="/img/portfolio/intelpayroll_800x500.png"
data-title="IntelPayroll"
data-project-type="Website Design"
data-description="I created the website and logo design for a payroll services and insurance firm. This firm used dynamic validation forms for instant feedback and a complete custom content management system that I built from the ground up. (website no longer available)"
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="400"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/intelpayroll_150x150.png" alt="IntelPayroll website" />
</a>
</li>
<li><a href="/img/portfolio/legacy_800x500.png"
data-title="Legacy (Demo)"
data-project-type="DVD Authoring"
data-description="This was a demonstration for the LDS Church, showcasing the complexity possible for DVD Authoring. Animations were created for each transition within the scene selection to ensure the right number of pages were flipped forward or backward. A Language selection page allowed several language track to be activated."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="450"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/legacy_150x150.png" alt="Legacy Demo" />
</a>
</li>
<li><a href="https://www.youtube.com/watch?v=mGLEDYSCcHA"
data-type="video"
data-source="youtube"
data-title="Waiting for the Next Shoe to Drop"
data-project-type="Video Production"
data-description="A web series, featuring Dr. Edward Clark of Primary Children's Hospital, about his views and concerns for Health Care reform."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="500"
class="video img glightbox">
<img src="/img/portfolio/shoedrop_150x150.png" alt="Waiting for the Next Shoe to Drop" />
</a>
</li>
<li><a href="/img/portfolio/everett_ruess_print.jpg"
data-title="Lost Forever: Everett Ruess"
data-project-type="DVD Authoring, Print Design"
data-description="I created all menus and interactivity for this DVD, as well as professional encoding of the video for this film. In addition, I created the DVD insert that was professionally printed to be used for the finished commercial release."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="550"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/everettruess_150x150.jpg" alt="Lost Forever: Everett Ruess DVD insert design" />
</a>
</li>
<li><a href="/img/portfolio/ehsl_mobile_800x500.png"
data-title="EHSL Mobile"
data-project-type="Mobile Website Design, Logo Design"
data-description="The Eccles Health Sciences Library mobile format website works with dynamic drop down panels for advanced fluid navigation, but also gracefully degrades to work perfectly on older phones that do not support it."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="600"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ehsl_mobile_150x150.png" alt="EHSL mobile website" />
</a>
</li>
<li><a href="/img/portfolio/novel_800x500.png"
data-title="NOVEL"
data-project-type="Website Design, Video Compression"
data-description="The Neuro-Ophthalmology Virtual Education Library (NOVEL) is the premier resource for Neuro-Ophthalmology. This website is used to host the numerous videos showing patient case videos, to help train professionals and students."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="650"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/novel_150x150.png" alt="NOVEL mobile website" />
</a>
</li>
<li><a href="/img/portfolio/novel_mobile_800x500.png"
data-title="NOVEL Mobile Beta"
data-project-type="Mobile Website Design"
data-description="The Neuro-Ophthalmology Virtual Education Library (NOVEL) beta website is able to serve up and stream mobile videos from the Neuro-Ophthalmology Virtual Education Library. This should work on most modern phones, but due to the changing nature of mobile video technology, it may have some issues. It's still in beta and not feature complete."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="700"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/novel_mobile_150x150.png" alt="NOVEL mobile website" />
</a>
</li>
<li><a href="/img/portfolio/outsourced_logo_800x500.png"
data-title="Outsourced CPAs"
data-project-type="Logo Design"
data-description="I created a vector logo design for Outsourced CPAs using Adobe Illustrator to allow for the greatest flexibility for use (web, print, video, etc.)."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="750"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/outsourced_logo_150x150.png" alt="Outsourced CPAs logo design" />
</a>
</li>
<li><a href="/img/portfolio/ehsl-blog_800x500.png"
data-title="EHSL Blog"
data-project-type="Website Design"
data-description="I created a custom, fully compliant, and responsive theme for this WordPress blog from scratch. This theme utilizes my custom "base" theme with extra styling using a sub theme. This works wonderfully on mobile devices and is fully ADA and section 508 compliant."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="800"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ehsl-blog_150x150.png" alt="EHSL blog" />
</a>
</li>
<li><a href="/img/portfolio/ehsl-e-logo_800x500.png"
data-title="EHSL Logo"
data-project-type="Logo Design"
data-description="In 2010 the Eccles Health Sciences Library wanted to re-brand itself, and I was asked to create a new logo. This logo was not used, because University Marketing wanted us to stay with the Health Sciences logo rather than create our own brand. Nevertheless, this logo was well received. This logo was made to highlight the health sciences with the use of the caduceus, and the backdrop is pages of a book being unbound, which is important because I wanted to stress that EHSL is not a traditional library of books, but also online."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="850"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/ehsl-e-logo_150x150.png" alt="EHSL Logo" />
</a>
</li>
<li><a href="/img/portfolio/kiosk-800x500.png"
data-title="Kiosks"
data-project-type="Video Production, Animation, DVD Authoring"
data-description="In 2002 Salt Lake City hosted the Winter Olympics. Because of the expected uptick in tourism, the LDS Church revamped its "Temple Square" in downtown Salt Lake City, to showcase its beliefs. I was contracted to help create interactive kiosks utlizing touch screens that interact with a DVD player to play video content. I created animated content, edited video content at a CMX editing studio, and authored the final DVDs that interact with the touch screen displays."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="900"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/kiosk-150x150.png" alt="Kiosks" />
</a>
</li>
<li><a href="/img/portfolio/avery_800x500.png"
data-title="ST. Avery Construction"
data-project-type="Website Design"
data-description="I created this site using a javascript image gallery with database back end to maintain all metadata for each project."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="950"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/avery_150x150.png" alt="ST. Avery website" />
</a>
</li>
<li><a href="/img/portfolio/brenda_800x500.jpg"
data-title="Designs By Brenda"
data-project-type="Website Design"
data-description="This was a custom design website utilizing my own customized content management system to track projects to be used as a portfolio. There were also several forms to help manage information gathering for prospective clients. (website no longer available)"
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="1000"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/brenda_150x150.jpg" alt="Designs By Brenda website" />
</a>
</li>
<li><a href="https://www.youtube.com/watch?v=7qgM88QzhEo"
data-type="video"
data-source="youtube"
data-title="Editing Samples (2000)"
data-project-type="Video Production"
data-description="This is a selection of TV commercials and corporate content edited in early 2000. These clips, admitadely, is not the best content to pull from, but these were the ones I found available. More to come as I find more of my master tapes."
data-aos="zoom-in"
data-aos-duration="500"
data-aos-delay="1050"
class="video img glightbox">
<img src="/img/portfolio/editing-2000_150x150.png" alt="Editing 2000" />
</a>
</li>
<!-- <li><a href="/img/portfolio/computermedic_800x500.png"
data-glightbox="title:Description Bottom; description: You can set the position of the description"
class="img glightbox"
data-gallery="portfolio">
<img src="/img/portfolio/computermedic_150x150.png" alt="A+ Computer Medic website" />
</a>
</li> -->
<!-- <li><a href="/img/portfolio/computermedic_800x500.png"
data-title="A+ Computer Medic"
data-description=" Website Design:: Simple website with basic contact and location info. More robust options are available but not maintained by the client. Mobile version of the website is also available." class="img glightbox" data-gallery="portfolio"><img src="/img/portfolio/computermedic_150x150.png" alt="A+ Computer Medic website" /></a></li> -->
<!--video <li><a href="#player"
data-title="My Demo"
data-description=" Video Production:: A compilation of various video production projects I have worked on. It covers Camera work, Editing and Animation (the demo is very dated)." class="video" class="img glightbox" data-gallery="portfolio"><img src="/img/portfolio/computermedic_150x150.png" alt="A+ Computer Medic website" /></a></li>-->
</ul>
<!-- <ul>
<li>The Church of Jesus Christ of Latter-day Saints</li>
<li>The University of Utah</li>
<li>Utah Transit Authority</li>
<li>Evans and Sutherland</li>
<li>American Indian Services</li>
<li>Utah Women's Health Coalition</li>
<li>Community Faces of Utah</li>
<li>Beacher Films</li>
<li>Lavoi Communications</li>
<li>Eye Care for Kids Foundation</li>
<li>Mel Hardman Productions</li>
<li>PictureDisk</li>
<li>Dental Education Corporation</li>
<li>St. Avery Construction</li>
<li>A+ Computer Medic</li>
</ul> -->
</div>
<br class="clear" />
</div>
<div id="footer">
<div class="container">
<img src="img/rb_logo_paint_footer.png" alt="rb logo" class="logo" />
<div class="footer_text">© 2020 Ray Balhorn<br />
Salt Lake City, Utah</div>
</div>
</div>
</div> <!-- end content container -->
</div> <!-- end website container -->
<!-- GLightbox -->
<script type="text/javascript">
const glightbox = GLightbox({
touchNavigation: true,
loop: true,
autoplayVideos: true,
onOpen: () => {},
beforeSlideLoad: (slide, data) => {},
plyr: {
css: 'https://cdn.plyr.io/3.5.6/plyr.css', // Default not required to include
js: 'https://cdn.plyr.io/3.5.6/plyr.js', // Default not required to include
ratio: '4:3',
config: {
muted: false,
hideControls: false,
youtube: {
noCookie: true,
rel: 0,
showinfo: 0,
iv_load_policy: 3,
modestbranding: 1
}
}
}
});
</script>
<!-- aos -->
<script>
AOS.init();
</script>
<!-- Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-1271015-13', 'rbmediadesign.com');
ga('send', 'pageview');
</script>
</body>
</html>