-
Notifications
You must be signed in to change notification settings - Fork 0
/
wsc.html
143 lines (126 loc) · 8.75 KB
/
wsc.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
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<meta name="robots" content="max-snippet:-1,max-image-preview:standard,max-video-preview:-1" />
<link rel="stylesheet" href="/style.css" />
<link rel="manifest" href="/manifest.webmanifest" />
<!-- SEO -->
<title>WorkSource Coastal - Derek Perry - derek-perry.com</title>
<meta name="description" content="Derek Perry - Interactive Design : Game, Graphic, and Web - derek-perry.com" />
<meta property="og:image" content="https://derek-perry.com/media/banner.jpg" />
<meta property="og:image:width" content="2560" />
<meta property="og:image:height" content="1440" />
<meta property="og:image:alt" content="Banner for derek-perry.com" />
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:title" content="WorkSource Coastal - Derek Perry - derek-perry.com" />
<meta property="og:description" content="Derek Perry - Interactive Design : Game, Graphic, and Web - derek-perry.com" />
<meta property="og:site_name" content="Derek Perry - derek-perry.com" />
<meta property="og:url" content="https://derek-perry.com/wsc" />
<link rel="canonical" href="https://derek-perry.com/wsc" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@_derekperry" />
<meta name="twitter:title" content="WorkSource Coastal - Derek Perry - derek-perry.com" />
<meta name="twitter:description" content="Derek Perry - Interactive Design : Game, Graphic, and Web - derek-perry.com" />
<meta name="twitter:image" content="https://derek-perry.com/media/banner.jpg" />
<meta name="twitter:image:width" content="2560" />
<meta name="twitter:image:height" content="1440" />
<meta name="twitter:image:alt" content="Banner for derek-perry.com" />
<!-- Favicon -->
<meta name="theme-color" content="#689915" />
<link rel="icon" type="image/png" sizes="32x32" href="https://derek-perry.com/favicon/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="https://derek-perry.com/favicon/favicon-16x16.png" />
<link rel="mask-icon" href="https://derek-perry.com/favicon/safari-pinned-tab.svg" color="#689915" />
<link rel="shortcut icon" href="https://derek-perry.com/favicon/favicon.ico" />
<link rel="icon" href="https://derek-perry.com/favicon/icon-32x32.png" sizes="32x32" />
<link rel="icon" href="https://derek-perry.com/favicon/icon-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon" sizes="180x180" href="https://derek-perry.com/favicon/apple-touch-icon.png" />
<link rel="apple-touch-icon" href="https://derek-perry.com/favicon/icon-180x180.png" />
<meta name="msapplication-TileImage" content="https://derek-perry.com/favicon/icon-270x270.png" />
<meta name="msapplication-TileColor" content="#689915" />
<meta name="msapplication-config" content="https://derek-perry.com/favicon/browserconfig.xml" />
<!-- Analytics (Plausible) -->
<script defer data-domain="derek-perry.com" src="https://plausible.io/js/plausible.js"></script>
</head>
<body id="wsc" role="main">
<header id="header" role="banner">
<a href="https://derek-perry.com" title="Derek Perry" id="headerlogo">
<picture>
<source srcset="/media/logo.webp" height="50px" width="50px" type="image/webp">
<source srcset="/media/logo.png" height="50px" width="50px" type="image/png"><img height="50px" width="50px" src="/media/logo.png" alt="Derek Perry's Logo">
</picture>
<h1>Derek Perry</h1>
</a>
<h2 id="headerdescription">
<a href="https://derek-perry.com" title="Interactive Design Works by Derek Perry">Interactive Design</a>: <span id="descroles"><a href="https://derek-perry.com#games" title="Games by Derek Perry">Game</a>, <a href="https://derek-perry.com#graphics" title="Graphics by Derek Perry">Graphic</a>, & <a href="https://derek-perry.com#websites" title="Websites by Derek Perry">Web</a></span>
</h2>
</header>
<main role="main">
<article id="work">
<section id="summary">
<h2>WorkSource Coastal</h2>
<p><em>July, 2018 - April, 2021</em></p>
<ul>
<li>Website Design</li>
<li>Website Development</li>
<li>Video Editing</li>
</ul>
</section>
<section id="software">
<h2>Software Used:</h2>
<p>Adobe After Effects, Adobe Illustrator, Adobe Photoshop, HTML and CSS, Web Server</p>
</section>
<section id="overview">
<h2>Work Overview:</h2>
<p>Job sourcing business in the Savannah, Georgia area needed services including website design, graphic design, motion graphics, IT services, and social media assistance.</p>
<hr>
<img src="/media/wsc0_home.jpg" alt="WorkSource Coastal – Website Homepage Screenshot">
<p>WorkSource Coastal – Website Homepage Screenshot</p>
<hr>
<video controls loop preload="auto" poster="/media/wsc0_psa.jpg" alt="WorkSource Coastal - MySource PSA Video">
<source src="/media/wsc0_psa.mp4" type="video/mp4" />
</video>
<p>MySource PSA/Hiring Campaign Advertisement Video</p>
<hr>
<video controls autoplay muted loop preload="auto" poster="/media/wsc1_poster.jpg" alt="WorkSource Coastal - Hiring Campaign Video Poster - Variation 1">
<source src="/media/wsc1_poster.mp4" type="video/mp4" />
</video>
<p>Hiring Campaign Video Poster which played on displays in convention booths - Variation 1</p>
<hr>
<video controls autoplay muted loop preload="auto" poster="/media/wsc2_poster.jpg" alt="WorkSource Coastal - Hiring Campaign Video Poster - Variation 2">
<source src="/media/wsc2_poster.mp4" type="video/mp4" />
</video>
<p>Hiring Campaign Video Poster which played on displays in convention booths - Variation 2</p>
<hr>
<video controls autoplay muted loop preload="auto" poster="/media/wsc3_poster.jpg" alt="WorkSource Coastal - Hiring Campaign Video Poster - Variation 3">
<source src="/media/wsc3_poster.mp4" type="video/mp4" />
</video>
<p>Hiring Campaign Video Poster which played on displays in convention booths - Variation 3</p>
<hr>
<video controls loop preload="auto" poster="/media/wsc4_poster.jpg" alt="WorkSource Coastal - Hiring Campaign Video Poster with Voice">
<source src="/media/wsc4_poster.mp4" type="video/mp4" />
</video>
<p>Hiring Campaign Video Poster which played on displays in convention booths - Variation 1 with audio/voice of person speaking</p>
</section>
</article>
</main>
<footer id="footer" role="contentinfo">
<section id="footerlinks">
<p>GitHub: <a href="https://github.com/derek-perry" target="_blank" rel="noopener noreferrer" title="derek-perry on GitHub">derek-perry</a></p>
<p>LinkedIn: <a href="https://linkedin.com/in/derek-perry" target="_blank" rel="noopener noreferrer" title="derek-perry on LinkedIn">derek-perry</a></p>
<p>YouTube: <a href="https://youtube.com/@derek-perry" target="_blank" rel="noopener noreferrer" title="@derek-perry on YouTube">@derek-perry</a></p>
<p>Twitch: <a href="https://twitch.tv/derekperry" target="_blank" rel="noopener noreferrer" title="derekperry on Twitch">derekperry</a></p>
<p>Twitter: <a href="https://twitter.com/_derekperry" target="_blank" rel="noopener noreferrer" title="_derekperry on Twitter">_derekperry</a></p>
<p>ArtStation: <a href="https://artstation.com/derekperry" target="_blank" rel="noopener noreferrer" title="derekperry on ArtStation">derekperry</a></p>
<p>Mastodon: <a href="https://mastodon.gamedev.place/@dp" target="_blank" rel="me" title="@dp on Mastodon.gamedev.place">@[email protected]</a></p>
<br>
<p>Email: <a href="mailto:[email protected]" target="_blank" title="Email Derek Perry (Work: [email protected])" rel="noopener">[email protected]</a></p>
</section>
<section id="footerlegal">
<p>© 2024 <a href="https://derek-perry.com" title="Derek Perry">Derek Perry</a> | <a href="/privacy" title="Privacy Policy">Privacy Policy</a></p>
</section>
</footer>
</body>
</html>