-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
439 lines (420 loc) · 28.4 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
<!DOCTYPE html>
<!--
HELLOOO! If you're looking through here we should be friends :') add me on insta at @ashleychuwu and say hi!
|￣￣￣￣￣￣￣￣￣￣￣|
I hope you are
having a good day!
|＿＿＿＿＿＿＿＿＿＿＿|
(\__/) ||
(•ㅅ•) ||
/ づ)
() ()
-->
<html>
<head>
<meta charset='utf-8'>
<title> Ashley C</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="formattedstyle.css">
<link rel="icon" href="img/logo.png">
<script src="https://kit.fontawesome.com/378ad4ae00.js" crossorigin="anonymous"></script>
<script src="./js/funfact.js"></script>
<script src="preloader.js"></script>
<script src="./js/anim-typerwriter.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-JWF0MGNBDN"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-JWF0MGNBDN');
</script>
</head>
<!-- <div class="preloader-wrapper">
<div class="preloader">
<img src="https://media2.giphy.com/media/lcwrrsfs4Px6w/200.gif" alt="Page Loading">
</div>
</div> -->
<body>
<div id="loading">
<img src="https://images.weserv.nl/?url=i.imgur.com/M1raXX3.png&il">
</div>
<div id="website">
<div id="home">
<!-- Flashcard -->
<div style="position: absolute; left: 8vw; top: 7vh; padding-right: 2.5%; border-color: black; border: 3px solid; border-radius: 2px; background-color: white; box-shadow: 5px 10px #101114">
<div>
<!-- <div class="highlight"></div> -->
<h1 id="name">Ashley Chu <span style="font-size: 1.4rem; padding-top: 12px; padding-left: 1.5vw;">ʅʕ•ᴥ•ʔʃ</span></h1>
</div>
<h1 style="font-size: 0.8rem; display:block; margin-bottom:0px;">🐻 EECS @ UC Berkeley</h1>
<h1 style="font-size: 0.8rem; margin-top: 2px; margin-bottom: 0px; display:block;">👩🏻💻 She/Her/Hers</h1>
<h1 style="font-size: 0.8rem; margin-top: 2px;display:block; margin-bottom: 15px; ">📫 ashchu [at] berkeley [dot] edu</h1>
<div style="justify-content: center; display:inline-flex">
<div class="min-button" style="margin-left: 3vw; background-color: #e8fdf5;"><a href="#about"><span>About</span></a></div>
<div class="min-button" style="margin: 1vw; margin-top: 0; margin-right: 0;background-color: #f5c0a2;"><a href="#project"><span>Projects</span></a></div>
<div class="min-button" style="margin: 1vw;margin-top:0; background-color: #dedef0;"><a href="https://theuselessweb.com/"><span>Click Me</span></a></div>
</div>
<!-- <a href="https://corgiorgy.com"></a> -->
</div>
<!-- icons -->
<div id="links">
<a href="https://ashchu.github.io/foodJournal">🍔</a>
<a href="https://swe.berkeley.edu">⚙️</a>
<!-- WIP RIGHT NOW SORRY -->
<!-- <a href="stories.html">📓</a> -->
<a href="https://wiry-frigate-2f2.notion.site/SP23-CS-184-Resources-0882fce86dff4fa694655b94b65135c6">📝</a>
<a href="photos.html">📸</a>
</div>
<!-- Fun Fact -->
<div id="funfact-reveal">
<span id="ffspan">You look nice today!</span>
</div>
<button class="avg-button" id="funfact" onclick="addFact()">Fun Fact</button>
<!-- Images -->
<section>
<!-- <div id="diamond"></div> -->
<!-- Bottom Image -->
<div id="profile2-box"></div>
<div id="profile-box"></div>
<div>
<img style="left: 87vw; top:70vh; height: auto; max-width:11%; width:11%; position:relative;" src="img/grid2.png">
<div id="profile2">
<img src="img/hack.jpg">
</div>
</div>
<img style="left: 68vw; top:16vh; max-width: 13%; width: 13%; position:absolute; height: auto;" src="img/grid.png">
<!-- Top image -->
<div>
<div id="profile">
<img src="img/me.jpg">
</div>
<img style="left: 82vw; top:36vh; position:absolute; width:8%" src="https://media.giphy.com/media/37raDfjV7EUotj32d9/giphy.gif">
<img style="left:30vw; top:20vh; position: absolute; width: 8%;" src="https://media.giphy.com/media/1xNXxyjhta0WA09O6B/giphy.gif">
</div>
</section>
<!-- Advice -->
<div>
<button class="avg-button" id="advice" onclick="addAdvice()">Advice</button>
<div id="advice-reveal">
<span style="padding-top:5%; padding-right: 60%;">def advice():</span>
<span style="padding-left: 12%; top: 13%; padding-bottom: 10%;">
step1 = "Spread your work into steps everyday".split(" ")
<br>
step2 = "Remember the ;".split(" ")
<br>
step3 = "Bring smiles to others".split(" ")
<br>
success = "💖"
<br>
return step1[0] + step3[1] + step1[5] + step2[2] + step2[0] + step3[2] + success + step1[1] + step1[2]
<br>
<br>
print(advice())
<br>
<br>
</span>
<br>
<span style="top: 80%; padding: 0; padding-top: 10px; padding-left: 60px; text-align: center; font-weight: 900; line-height: 1rem;">
Spread smiles everyday; <br>Remember to 💖 your work
</span>
</div>
</div>
<!-- This is my Bio -->
<div style="width: 33vw; overflow: scroll; position: absolute; left: 29vw; max-height:380px; top: 41vh; border-color: black; border: 3px solid; border-radius: 2px; background-color: #dcedc2; box-shadow: 10px 10px #101114">
<h1 style="width: 100%; position: absolute; display:block">
<a class="typewrite" data-period="2000" data-type='[ "Hello!", " My name is Ashley.", "Nice to meet you :)"]'>
<span class="wrap"></span>
</a>
</h1>
<div id="profile-desc">
<span>I'm a senior studying electrical engineering and computer science student at
<a class="light" href="https://www.eecs.berkeley.edu/">UC Berkeley</a>
(go bears!). Last summer, I interned at
<a class="light" href="https://disneyanimation.com">Disney Animation</a> in Burbank, CA on their Pipeline Infrastructure team.
</span>
<span>
I am extremely passionate about
diversity in <a class="light" href="https://shestems.netlify.app/">STEM initiatives</a> + education accesibility
and in love with storytelling + graphics. I'm pretty active on VSCO(de) (yes, both the IDE and photo app) and writing what's on my mind.
I'm also a <a class="light" href="https://www.yelp.com/user_details?userid=rW3wSY-ypfNI8b4SY9Hcpw">hobbyist food critic</a>, sticker collector,
and Niki fan.
</span>
</div>
</div>
<div style="position: relative;">
<div class="socials" style="background-color: #d4a5a5;">
<div style="width:100%; align-content: center;">
<!-- <span style="text-align:center; margin-left:25%">Find me on:</span> -->
<!-- <br> -->
<!-- <a href="assets/resume.pdf"><i id="icon-spacing" class="far fa-file-alt"></i></a> -->
<a href="https://github.com/ashchu"><i id="icon-spacing" class="fab fa-github-alt"></i></a>
<a href="https://linkedin.com/in/ashley-chu"><i id="icon-spacing" class="fab fa-linkedin-in"></i></a>
<a href="https://instagram.com/imagirlwhocodes"><i id="icon-spacing" class="fab fa-instagram"></i></a>
<a href="https://facebook.com/ashley.chu.750"><i id="icon-spacing" class="fab fa-facebook-f"></i></a>
</div>
</div>
</div>
</div>
<div id="about">
<div class="desc">
<p class="title"><span class="hight">About Me 😄</span></p>
<p style="font-size: 1.15rem;">
<span style="font-size: 0.95rem;text-align: center; font-style: italic;">I talked a little bit about myself above, but I'll give a little more formal summary of who I am below!</span>
<br>
<br>
As a senior at UC Berkeley, I've enjoyed working as an academic intern for <a class="light" href="https://inst.eecs.berkeley.edu/~cs61a/sp19/academic-interns.html">CS61A</a> and <a class="light" href="https://cs61bl.org/su20/about">CS61B</a> and being actively a part of
<a class="light" href="https://swe.berkeley.edu/">SWE</a>,
<a class="light" href="https://www.codeology.club/about">Codeology</a>, and
<a class="light" href="https://awe.berkeley.edu/">AWE</a> on campus.
<br>
<br>
In high school, I worked as an instructor assistant for
<a class="light" href="https://www.kodewithklossy.com/">Kode With Klossy</a> and created
<a class="light" href="https://shestems.netlify.app/">She STEMs</a>, a STEM summer camp and workshop series I started in 2018 to empower marginalized genders to feel confident and capable through STEM.
<br>
<br>
I've been fortunate to have my studies supported by organizations and companies like
<a class="light" href="https://www.amazonfutureengineer.com/">Amazon</a>, the
<a class="light"href="https://esafoundationscholars.com">Entertainment Software Association</a>,
<a class="light" href="https://www.pge.com/en_US/residential/in-your-community/education-programs/grants-and-scholarships/bright-mind-scholarships/bright-mind-scholarships.page?WT.mc_id=Vanity_educationprograms">PG&E</a>,
<a class="light"href="https://pbwc.org/scholarship-program/">PBWC</a>,
<a class="light" href="https://bio-rad.com">Bio-Rad</a>, and several others.
I am extremely grateful for their contributions, support, and mentorship towards my undergraduate education.
<br>
<br>
In the future, I hope to explore computer graphics and new media to understand and create ways to better connect the world.
<br>
<br>
</p>
</div>
<div class="desc" style="background-color: #e4f2f0">
<p class="title"><span class="hight">What I'm Up To 💪</span></p>
<p class="descTitle">TA, <a href="https://cs184.eecs.berkeley.edu/sp23">CS 184 Computer Graphics</a><span style="float: right;font-size: 14px;">Jan 2023 - Present</span></p>
<p class="descText">This spring, I'm teaching CS184 for the first time. This was one of my favorite courses at Berkeley, and I'm excited for what the semester has in store! You can view some of my <a href="https://wiry-frigate-2f2.notion.site/SP23-CS-184-Resources-0882fce86dff4fa694655b94b65135c6">teaching resources here.</a></p>
<p class="descTitle">President, <a href="https://swe.berkeley.edu">UCB Society of Women Enginers Section</a><span style="float: right;font-size: 14px;">Aug 2020 - Present</span></p>
<p class="descText">SWE has been my home for the past 4 years! SWE's mission is to advance the careers and journeys of women and non-binary students pursuing engineering. I oversee SWE's 40 officers and 350+ members to provide a professional and academic community for marginalized genders pursuing engineering on campus.💜</p>
<p class="descTitle">Project Member, <a href="https://codeology.club">Codeology</a> <span style="float: right;font-size: 14px;">Feb 2020 - Present</span></p>
<p class="descText">Codeology was one of the first spaces on campus that helped me explore a variety of computer science discplines. Each semester, I work on a fun technical project with a small team. You can see some of the projects below :)</p>
<p class="descTitle">Animator, <a href="https://ucbugg.com">UCBUGG (3D Modeling & Animation)</a> <span style="float: right;font-size: 14px;">Aug 2020 - Present</span></p>
<p class="descText">In UCBUGG, I learn the basics of the animation pipeline from story to rigging, shading, lighting, and compositing using primarily Maya and Renderman. You can see a few below in my projects section.</p>
<br>
<br>
</div>
<div class="desc">
<p class="title"><span class="hight">What I've Done 💫</span></p>
<p class="descTitle">Production Technology Intern, <a href="https://disneyanimation.com/interns-apprentices/">Walt Disney Animation Studios</a><span style="float: right;font-size: 14px;">May 2022 - Aug 2022</span></p>
<p class="descText">Animation and graphics were my spark into the world of technology, so finally being able to work at a studio that formed so much of my chidlhood memories was a dream! I worked on the internal pipeline infrasturcture technology team that fuels the versioining of assets across the studio. Using OpenTelemetry, I learned about the importance of telemetry data for client-side services and how to integrate them.</p>
<p class="descTitle">Software Development Engineering Intern, <a href="https://aws.amazon.com/">Amazon Web Services</a><span style="float: right;font-size: 14px;">June 2021 - Aug 2021</span></p>
<p class="descText">I returned to Amazon's internal builder tools team, Amazon Security Automated Patching (ASAP), where I developed an error reporting notification service to help customers resolve their pipeline deployment issues and increase awareness about the state of their deployment pipelines using Java and AWS Services. As a former AFE intern, I also helped onboard the team's first-year AFE interns and assisted them with their project.</p>
<p class="descTitle">Core Server Engineering Intern, <a href="https://careers.wbgames.com/studios/boston/">Warner Bros. Games Boston</a>
<span style="float: right; font-size: 14px;">Jan 2021 - June 2021</span>
</p>
<p class="descText">For 6 months, I interned with Warner Bros. Games on their Game of Thrones: Conquest mobile game. I had a blast learning about the underlying AWS that goes into hosting, running, and tracking games, and all the details within engineering aside from gameplay that happen in the games industry. </p>
<p class="descTitle">Software Development Engineering Intern, <a href="https://aws.amazon.com">Amazon Web Services</a><span style="float: right; font-size: 14px;">May 2020 - Aug 2020</span></p>
<p class="descText">During my 14-week internship, I worked with the Developer Tools organization. I worked on the software and systems that help Amazon’s millions of internal hosts to be automatically patched with the latest security updates to keep them current and secured. My team manages the host security to allow Amazon engineers to focus on their services, code changes, and new features to the customer.
<br>
<br>
I specifically worked on two customer features: one feature to patch multiple hosts and another feature to display the security status on my team's portal built primarily using React JS and Ruby on Rails.
</p>
<p class="descTitle">Professional Development & Mentorship Officer, <a href="https://awe.berkeley.edu">Association of Women in EE&CS (AWE)</a><span style="float: right;font-size: 14px;">Aug 2020 - Dec 2021</span></p>
<p class="descText">As an officer, I work on preparing women in EE&CS at Berkeley to achieve their career goals and work with companies to provide educational experiences for members. The prior year, I also led AWE's mentorship program, transitiong from in-person to a remote format where I increased connectivity through Slack engagement, mentorship rewards, and themed challenges each month.</p>
<p class="descTitle">Executive Director, <a href="https://shestems.netlify.app/">She STEMs <span style="float: right; font-size: 14px;">2017-2020</span></a></p>
<p class="descText">I started She STEMs in my junior year of high school after I felt isolated and uncomfortable at hackathons and in my computer science class. I wanted to create a safe space where students can learn about computer science and engineering in a comfortable setting and explore all that computer science can do. The program started out as scrappy workshops at my local library and eventually led to a two-week summer camp with company tours and speakers at Facebook, Google X, and Intuitive Surgical. Our program wouldn't have been possible without the support of NCWIT AspireIT and LITAS for Girls.</p>
<p class="descTitle">Instructor Assistant, <a href="https://kodewithklossy.com">Kode With Klossy</a> <span style="float: right; font-size: 14px;">Summer 2018, Summer 2019</span></p>
<p class="descText">For two years, I taught alongside three instructors in San Francisco (2019) and Denver (2018) to teach a group of 25 girls about web applications (HTML, CSS, JS, Ruby on Rails) over the course of two weeks. I helped mentor students, assist with conceptual and coding support, and organized daily logistics.</p>
<p class="descTitle"> Research Apprentice, San Jose State University<span style="float: right; font-size: 14px">2018</span></p>
<p class="descText">I worked with Professor Youngsoo Kim and was advised under Jyosori Manaswitha. Engaged in developing an Acceleration Overlay for novice students. Worked with Python on FGPAS via Jupyter Notebooks and designed a Python overlay on the Xilinix PYNQ-Z1 board.</p>
<p class="descTitle">Organizer, <a href="https://girlconchicago.com">GirlCon</a><span style="float: right; font-size: 14px">2018 - 2019</span></p>
<p class="descText">As sponsorship director and national director, I worked with a team of high school students to organize a one-day conferenced demonstrating how STEM intersects with a variety of industries. Facilitated communications with corporate sponsors and influencers including Karlie Kloss and Sheryl Sandberg.</p>
<p class="descTitle">Marketing Intern, <a href="https://chicktech.org">ChickTech</a><span>2017 - 2018</span></p>
<p class="descText">I helped develop marketing material and contacted potential sponsors for ChickTech's first annual conference, ACT-W.</p>
<br>
<br>
</div>
<div class="desc" style="background-color: #f6e7e6; padding-bottom: 30px;">
<p class="title" id="project"><span class="hight">What I've Built 🛠</span></p>
<div class="parentFlex">
<div class="childFlex">
<a href="https://www.youtube.com/watch?v=69Yvn6kf_P8">
<div class="boxForm">
<img class="proj-img" src="img/fleeting.png">
<p>Fleeting</p>
<span>A teddy bear attempts their great escape.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">Maya</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">Renderman</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">AE</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<a href="https://www.youtube.com/watch?v=13DgBv8zRok">
<div class="boxForm">
<img class="proj-img" src="img/spineless.png">
<p>Spineless</p>
<span>3D animated short featuring a plant named Meatball.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">Maya</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">Renderman</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">AE</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<a href="https://lunaapp.netlify.com">
<div class="boxForm">
<img class="proj-img" src="img/luna.png">
<p>Luna App</p>
<span>A period tracker web app to demystify menstruation.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">HTML</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">CSS</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">JS</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<a href="https://bit.ly/ashchuvscodeology">
<div class="boxForm">
<img class="proj-img" src="img/vscodeology.png">
<p>Vscodeology</p>
<span>iOS App that idenitifies 5-color <br> HEX palettes based on images.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">Swift</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">Python</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">Flask</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<a href="https://bit.ly/ashchumoviereviews">
<div class="boxForm">
<img class="proj-img" src="img/sentiments.png">
<p>Predicting Movie Review Sentiments</p>
<span>Data analytics project predicting <br>sentiments of films via movie reviews.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">Python</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">BS4</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">NLTK</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<!-- <a href="https://she-quality.netlify.com"> -->
<div class="boxForm">
<img class="proj-img" src="img/shequality.png">
<p>She-Quality</p>
<span>VR Web-App simulating the experience <br>of women in the workplace.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">HTML</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">CSS</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">JS</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #ffb4ac; ">A-Frame</span>
</div>
</div>
<!-- </a> -->
</div>
<div class="childFlex">
<!-- <a href="https://play.google.com/store/apps/details?id=appinventor.ai_chabot_trivia.Chabot&amp;hl=de"> -->
<div class="boxForm">
<img class="proj-img" src="img/web.png"/>
<p>Chabot: Explore the Galaxy!</p>
<span>Android app built with team to teach science.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #c06c84; ">Java</span>
</div>
</div>
<!-- </a> -->
</div>
<div class="childFlex">
<a href="https://hearstmuseum.berkeley.edu/exhibit/exploring-california-indigenous-food-practices-traditional-acorn-mush">
<div class="boxForm">
<img class="proj-img" src="img/acorns.png">
<p>Passing Down Indigenous Knowledge</p>
<span>Created an exhibit for HA192CU regarding <br>Indigenous food sovereignty and educating <br>youth about indigenous food processes.</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">Swift</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">Python</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #82c4c3; ">Flask</span>
</div>
</div>
</a>
</div>
<div class="childFlex">
<span id="projectid" onclick="addProject()">
<!-- <a href="https://hearstmuseum.berkeley.edu/exhibit/exploring-california-indigenous-food-practices-traditional-acorn-mush"> -->
<div class="boxForm">
<img class="proj-img" src="images/hmm.png">
<p>Misc Projects!</p>
<span>Here's to the unfinished, broken, and prototyped projects. <br> Click for a random project I attempted!</span>
<div class="boxDesc">
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #75b79e; ">HTML</span>
<span style="border-radius: 4px; color: white;padding: 5px; font-style: normal; font-size: 14px; margin-right: 10px; background-color: #f5b971; ">CSS</span>
</div>
</div>
</span>
</div>
</div>
</div>
<br>
<br>
</div>
</div>
</div>
<div class="descT" style="background-color: white">
<p class="title"><span class="hight">What I've learned 🤓</span></p>
<div id="courses">
<p class="descTitle bclass">Here are some of my favorite classes :)</p>
<p class="descText">HA190F: Visual Activism</p>
<ul class="descText" style="font-style:normal;">
<li><a href="https://docs.google.com/presentation/d/1bTmXyJ6sDDToXwkQgrd_iCtRJulAT91SOzFH75PqSM0/edit?usp=sharing">Favorite works shared</a></li>
</ul>
<p class="descText">CS194-26: Computational Photograhy & Computer Vision</p>
<ul class="descText" style="font-style:normal;">
<li><a href="https://inst.eecs.berkeley.edu/~cs194-26/fa22/upload/files/projFinalAssigned/cs194-26-acg/">Final Project</a></li>
<li><a href="https://inst.eecs.berkeley.edu/~cs194-26/fa22/upload/files/proj3/cs194-26-acg/">Project 3 | Morphing</a></li>
<li><a href="https://inst.eecs.berkeley.edu/~cs194-26/fa22/upload/files/proj2/cs194-26-acg/">Project 2 | Fun with Filters</a></li>
<li><a href="https://inst.eecs.berkeley.edu/~cs194-26/fa22/upload/files/proj1/cs194-26-acg/">Project 1 | Colorizing B&W Images</a></li>
</ul>
<!-- <ul class="descText" style="margin-left: -25%; font-style:normal;">
</ul> -->
<p class="descText">CS184: Computer Graphics</p>
<ul class="descText" style="font-style:normal;">
<li><a href="https://somaniarushi.github.io/184-final/website/">Project 5 | Final: Windsock Simulation</a></li>
<ul><li><a href="https://cs184.eecs.berkeley.edu/sp22/docs/final_showcase">Project Showcase</a></ul>
<li><a href="https://ashchu.github.io/cs184-project4/">Project 4 | Cloth Simulation</a></li>
<li><a href="https://ashchu.github.io/cs184proj3-2/">Project 3 Part 2 | Pathtracer (Materials & Environment)</a></li>
<li><a href="https://ashchu.github.io/cs184proj3-1/">Project 3 Part 1 | Pathtracer (Light & Shading)</a></li>
<li><a href="https://ashchu.github.io/cs184project2">Project 2 | Mesh Editor</a></li>
<li><a href="https://ashchu.github.io/cs184project1">Project 1 | Rasterizer</a></li>
</ul>
<p class="descText">NWMedia 166: Critical Practices: People, Places, Participation</p>
<ul class="descText" style="font-style:normal;">
<li><a href="https://docs.google.com/presentation/d/1OFOGS5iW7_YqWJjAkfMv_uNfEzX_4SK5ctSxGypOFes/edit?usp=sharing">My superpower: light the floor!</a></li>
<li><a href="https://docs.google.com/presentation/d/1o7-eswZNnl1YNt3ORbbH5M8w4P3NmOsXHzEp4Y2Lfq0/edit?usp=sharing">Reflection Pool</a></li>
</ul>
</div>
</div>
<!-- <div class="desc" style="background-color: #ffecda">
<p class="title"><span class="hight">When I've Failed</span></p>
<span style="width: 50%; padding-top: 10px; font-size: 0.95rem;text-align: center; font-style: italic;">It's easy to read a list of random things someone's did, and I feel like it's important to be realistic too! <br> So, here's some of the failures and bumps I've had along the way.</span>
<br>
<br>
</div>
</div> -->
<div id="footer">
<div style="margin-left: 18vw; padding-top:2vh; font-size: 0.9rem;">
Design inspired by <a href="https://slim.computer">Sarah Lim</a> ❤️
<span style="margin-left: 17vw;">
Check out my <a href="https://github.com/ashchu" style="font-style: italic;">source code</a> on Github or peek at my <a href="https://ashleyc.netlify.app" style="font-style: italic;">first website</a>.
</span>
</div>
</div>
</body>
</html>