-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdesign.html
375 lines (372 loc) · 24.4 KB
/
design.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
<!DOCTYPE html>
<html lang = "en">
<head>
<title>Matthew Prock</title>
<meta charset="UTF-8">
<meta name="description" content="This is the design work section
portfolio website. It contains links to illustrations I've made at
the Michigan Daily and independently.">
<meta name="author" content="Matthew Prock">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href = "/style/style.css" rel = "stylesheet">
<link href = "/style/dstyle.css" rel = "stylesheet">
<!-- fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Averia+Libre:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Molengo&display=swap" rel="stylesheet">
</head>
<body id = "designpagebody">
<div id = "pagetop"></div>
<header class = "header">
<a href = "index.html" class = "logo">matthew prock</a>
<nav id = "navbar" class = "navbar">
<input class = "menu-btn" id = "menu-btn" type = "checkbox">
<label class = "menu-icon" for = "menu-btn">
<span class = "nav-icon"></span>
</label>
<ul class = "menu">
<li> <a href = "index.html"> Home </a></li>
<li><a href = "about.html"> About me </a></li>
<li><a href = "design.html"> Design work </a></li>
<li><a href = "research.html"> Research </a></li>
</ul>
</nav>
</header>
<div id = "container">
<h1 id = "deswork"> Design Work </h1>
<!-- <div id = "deslinks">
<a href = "#tmd"> The Michigan Daily</a>
<a href = "#ind"> Independent Work</a>
</div> -->
<div id = "tmd"></div>
<h1 class = "sechead"><a href = "https://www.michigandaily.com/" target
= "_blank"> The Michigan Daily </a> </h1>
<div class = "wrapper">
<div class = "box1">
<a href = "https://specials.michigandaily.com/2024/bside/american/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/americancover.png"
alt = "The text 'The AMERICAN B-Side' written across a blue sky.
'AMERICAN' is written in blue bubble letters filled with stars on a banner,
which a bald eagle is carrying in its mouth. The illustration is colorful and cartoonish.">
</a>
<a href = "https://www.michigandaily.com/arts/style/running-alone-together/"
target = "_blank"> The American B-Side-- Cover </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/arts/b-side/searching-for-genius-in-bennington-vermont-the-secret-history-of-donna-tartt/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/vermont.png"
alt = "A vintage postcard reading 'Greetings from VERMONT',
with snowy mountains and a building from the Bennington College campus in the background.
Each letter in the word 'Vermont' has important items from the book The Secret History drawn in it,
along with its author Donna Tartt in the 'M'. The illustration is warm and drawn in a cartoonish style.">
</a>
<a href = "https://www.michigandaily.com/arts/b-side/searching-for-genius-in-bennington-vermont-the-secret-history-of-donna-tartt/"
target = "_blank"> Searching for genius in Bennington, Vermont: The secret history of Donna Tartt </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/arts/b-side/on-waiting-to-die-in-southwest-texas/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/texas.png"
alt = "A vintage postcard reading 'Greetings from TEXAS / Remember the Alamo!',
with a sunset in the background. Each letter in the word 'Texas' contains significant
aspects or moments in Texas culture in it. The illustration is drawn in a cartoonish style.">
</a>
<a href = "https://www.michigandaily.com/arts/b-side/on-waiting-to-die-in-southwest-texas/"
target = "_blank"> On waiting to die in southwest Texas</a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/arts/b-side/take-me-home-bryant-denny-to-the-place-i-belong-alabama/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/alabama.png"
alt = "A postcard reading 'Greetings from ALABAMA', with scenic buildings
and nature from Alabama written in the letters; the 'M' contains a picture of Nick Saban.
In the foreground is an Alabama runningback, and in the background is the Bama football stadium.
The illustration is warm and drawn in a cartoon style.">
</a>
<a href = "https://www.michigandaily.com/arts/b-side/take-me-home-bryant-denny-to-the-place-i-belong-alabama/"
target = "_blank"> Take me home, Bryant-Denny, to the place I belong: Alabama </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/arts/b-side/illinois-the-land-of-chicagoish/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/illinois.png"
alt = "A vintage postcard reading 'Greetings from ILLINOIS',
with Navy Pier in the background. Each letter in the word 'Illinois'
contains pop culture or a significant landmark from Chicago in it.
The illustration is drawn in a cartoonish style.">
</a>
<a href = "https://www.michigandaily.com/arts/style/running-alone-together/"
target = "_blank"> Illinois: The land of Chicago(ish) </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/arts/books/longing-for-childlike-wonder-pick-up-a-childrens-book/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/scholastic.png"
alt = "A young girl flipping through the pages of a chapter book at her school's
Scholastic Book Fair. The illustration is warm and colorful, and drawn in a cartoonish style.">
</a>
<a href = "https://www.michigandaily.com/arts/books/longing-for-childlike-wonder-pick-up-a-childrens-book/"
target = "_blank"> Longing for childlike wonder? Pick up a children’s book </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/arts/style/running-alone-together/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/run.png"
alt = "A girl wearing athletic clothes and over-ear headphones standing outside.
She has thought bubbles above her head, and music notes floating around her.
The illustration is colorful and cartoonish.">
</a>
<a href = "https://www.michigandaily.com/arts/style/running-alone-together/"
target = "_blank"> Running alone (together) </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/arts/style/the-longchamp-craze-on-campus-bags-are-the-newest-form-of-self-expression/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/longchamp.png"
alt = "A girl walking outside with a Longchamp Le Pliage tote over one shoulder. The illustration is colorful and cartoonish.">
</a>
<a href = https://www.michigandaily.com/arts/style/the-longchamp-craze-on-campus-bags-are-the-newest-form-of-self-expression/"
target = "_blank"> The Longchamp craze on campus: Bags are the newest form of self-expression </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/statement/looking-for-walden-in-midtown-manhattan/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/moon.png"
alt = "A full moon at night, overlooking a forest
on one side and a city on the other side.
The illustration is colorful and cartoonish.">
</a>
<a href = "https://www.michigandaily.com/statement/looking-for-walden-in-midtown-manhattan/"
target = "_blank"> The Dispatch Edition:
Looking for Walden in Midtown Manhattan </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/statement/two-sides-of-the-same-coin/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/coin.png"
alt = "A coin split down the middle, with a roman
temple on one side and the U.S. coat of arms on the other.
The illustration is drawn in a simple, cartoon style.">
</a>
<a href = "https://www.michigandaily.com/statement/two-sides-of-the-same-coin/"
target = "_blank"> The Dispatch Edition: Two sides of the
same coin </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/statement/neon-nights-in-korea/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/unis.png"
alt = "Split down the middle, an American university
campus on the left and a Korean university campus on
the right. The illustration is colorful and cartoonish.">
</a>
<a href = "https://www.michigandaily.com/statement/neon-nights-in-korea/"
target = "_blank"> The Dispatch Edition: Neon nights in
Korea </a>
</div>
<div class = "box2">
<a href = "https://michigandaily.com/news/campus-life/back-from-the-dead-how-discontinued-majors-have-evolved-over-time/"
target = "_blank">
<img class = "tmd_covers"
src = "imgs/tmd_imgs/zombies.png" alt = "">
</a>
<a href = "https://michigandaily.com/news/campus-life/back-from-the-dead-how-discontinued-majors-have-evolved-over-time/"
target = "_blank"> Back from the dead: How discontinued majors
have evolved over time </a>
<!-- TODO: add alt text -->
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/news/ann-arbor/ev-carshare-pilot-program-drives-change-in-ann-arbor/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/ev.png"
alt = "A group of University of Michigan students
and Ann Arbor residents crowded around an electric
vehicle recharging in front of a house.
The illustration is colorful and cartoonish.">
</a>
<a href = "https://www.michigandaily.com/news/ann-arbor/ev-carshare-pilot-program-drives-change-in-ann-arbor/"
target = "_blank"> EV carshare pilot program drives change in
Ann Arbor </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/news/government/a-look-at-the-biden-harris-administrations-investments-in-michigan/"
target = "_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/mimap.png"
alt = "A map of Michigan with clean flowing water,
construction equipment, lead pipes being replaced,
and a high-speed Internet tower scattered across it.
The illustration is simple and drawn in a cartoonish style.">
</a>
<a href = "https://www.michigandaily.com/news/government/a-look-at-the-biden-harris-administrations-investments-in-michigan/"
target = "_blank"> ‘Fixing the damn roads’: A look at the Biden
administration’s investments in Michigan </a>
</div>
<div class = "box1">
<a href =
"https://specials.michigandaily.com/bside/2024/beef/"
target="_blank">
<img class = "tmd_covers" src = "imgs/tmd_imgs/beef_side.png"
alt = ""></a>
<a class = "article" href =
"https://specials.michigandaily.com/bside/2024/beef/"
target="_blank"> The B(eef) Side- Cover </a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/whats-the-deal-with-seinfeld-a-beef-about-nothing/"
target="_blank"><img class = "tmd_covers"
src = "imgs/tmd_imgs/seinfeld.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/whats-the-deal-with-seinfeld-a-beef-about-nothing/"
target="_blank"> The B(eef) Side- What's the deal with Seinfeld: a beef about nothing </a>
</div>
<div class = "box1">
<a class = "article" href =
"https://www.michigandaily.com/arts/style/everything-i-loved-and-hated-at-the-met-gala/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/metgala.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/arts/style/everything-i-loved-and-hated-at-the-met-gala/"
target="_blank"> Everything I loved and hated at the Met Gala </a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/news/government/robert-f-kennedy-jr-to-appear-on-michigans-presidential-ballot-in-november/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/rkennedy.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/news/government/robert-f-kennedy-jr-to-appear-on-michigans-presidential-ballot-in-november/"
target="_blank"> Robert F. Kennedy Jr. to appear on Michigan’s presidential ballot in November </a>
</div>
<div class = "box1">
<a class = "article" href =
"https://www.michigandaily.com/opinion/the-cost-of-the-college-town-charm/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/ctc.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/opinion/the-cost-of-the-college-town-charm/"
target="_blank"> The cost of the college town charm</a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/arts/digital-culture/first-person-shooter-games-part-1-who-are-we-shooting/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/doom.png" alt = ""></a>
<a class = "article" href =
"https://www.michigandaily.com/arts/digital-culture/first-person-shooter-games-part-1-who-are-we-shooting/"
target="_blank"> First-person shooter games part 1: Who are we shooting?</a>
</div>
<div class = "box1">
<a class = "article" href =
"https://www.michigandaily.com/opinion/investing-in-the-infinite-the-value-of-space-exploration/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/rocket.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/opinion/investing-in-the-infinite-the-value-of-space-exploration/"
target="_blank"> Investing in the infinite: The value of space exploration</a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/news/government/new-house-map-combats-racial-gerrymandering-in-michigan-legislature/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/gerrymander.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/news/government/new-house-map-combats-racial-gerrymandering-in-michigan-legislature/"
target="_blank"> New House map combats racial gerrymandering in Michigan legislature</a>
</div>
<div class = "box1">
<a class = "article" href =
"https://www.michigandaily.com/opinion/columns/graduate-programs-without-licensure-pathways-are-robbing-their-students/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/licensure.png" alt = ""></a>
<a class = "article" href =
"https://www.michigandaily.com/opinion/columns/graduate-programs-without-licensure-pathways-are-robbing-their-students/"
target="_blank"> Graduate programs without licensure pathways are robbing their students</a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/opinion/columns/climate-havens-arent-safe-from-climate-change/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/climate_haven.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/opinion/columns/climate-havens-arent-safe-from-climate-change/"
target="_blank"> ‘Climate havens’ aren’t safe from climate change </a>
</div>
<div class = "box1">
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/dan-and-phil-like-actual-soulmates/"
target="_blank"><img class = "tmd_covers"
src = "imgs/tmd_imgs/dan_phil.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/dan-and-phil-like-actual-soulmates/"
target="_blank"> Best Friends B-Side- Dan and Phil: ‘Like actual soulmates’</a>
</div>
<div class = "box2">
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/ferris-buellers-day-off-is-about-saving-a-friend-not-skipping-school/"
target="_blank"> <img class = "tmd_covers"
src = "imgs/tmd_imgs/bueller.png" alt = ""> </a>
<a class = "article" href =
"https://www.michigandaily.com/arts/b-side/ferris-buellers-day-off-is-about-saving-a-friend-not-skipping-school/"
target="_blank"> Best Friends B-Side- ‘Ferris Bueller’s Day Off’ is about saving a friend, not skipping school</a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/opinion/columns/the-false-hope-of-the-humble-blue-bin/"
target = "_blank">
<img class = "tmd_covers"
src = "imgs/tmd_imgs/recyc.png" alt = "">
</a>
<a href = "https://www.michigandaily.com/opinion/columns/the-false-hope-of-the-humble-blue-bin/"
target = "_blank"> The false hope of the humble blue bin </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/news/research/new-model-of-glioblastoma-cells-could-lead-to-more-treatment-options/"
target = "_blank">
<img class = "tmd_covers"
src = "imgs/tmd_imgs/glio.png" alt = "">
</a>
<a href = "https://www.michigandaily.com/news/research/new-model-of-glioblastoma-cells-could-lead-to-more-treatment-options/"
target = "_blank"> New model of glioblastoma cells could lead
to more treatment options </a>
</div>
<div class = "box1">
<a href = "https://www.michigandaily.com/opinion/why-a-fractured-ann-arbor-is-good-for-umich-students/"
target = "_blank">
<img class = "tmd_covers"
src = "imgs/tmd_imgs/diag.png" alt = "">
</a>
<a href = "https://www.michigandaily.com/opinion/why-a-fractured-ann-arbor-is-good-for-umich-students/"
target = "_blank"> Why a fractured Ann Arbor is good for
UMich students </a>
</div>
<div class = "box2">
<a href = "https://www.michigandaily.com/news/government/annual-mi-healthy-climate-plan-report-shows-movement-toward-state-wide-goals/"
target = "_blank">
<img class = "tmd_covers"
src = "imgs/tmd_imgs/scale.png" alt = "">
</a>
<a href = "https://www.michigandaily.com/news/government/annual-mi-healthy-climate-plan-report-shows-movement-toward-state-wide-goals/"
target = "_blank"> Annual MI Healthy Climate Plan report shows
movement toward state-wide goals </a>
</div>
</div>
<div id = "disclaimer">
<h2> The Michigan Daily is the campus newspaper of The University of
Michigan; the paper is financially independent from the University,
striving for journalistic integrity on a campus without a
journalism major. New copies of The Daily are printed weekly
and distributed across Ann Arbor, while the paper's website
updates with new stories every day.
</h2>
</div>
<!-- <div id = "ind"></div> -->
<!-- <h1 class = "sechead"> Independent Design Work</h1> -->
<!-- TODO: INDEPENDENT WORK PORTFOLIO HERE -->
</div>
</body>
</html>