-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
239 lines (224 loc) · 15.6 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
<!DOCTYPE html>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-115987385-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-115987385-1');
</script>
<title>Siddharth Karia</title>
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
</head>
<body data-spy="scroll" data-target="#sidenavbarlist" data-offset="100">
<div id="mainmessage" class="parallax-window" data-parallax="scroll" data-image-src="images/covernew_3_animated_opacity_crop_2.webp" data-speed="0.4" data-position="center top">
<div id="hiimsid" class="row">
<div id="imsidp" class="col-md-6">
<span class="heavier blue">Hi! I'm Sid.</span>
</div>
</div>
<div id="message" class="row">
<div id="messagep" class="col-md-4">
<p id="imastudent">I'm a software engineer and UC Berkeley grad who loves developing, designing, and creating great products and content.
</p>
<a id="movedown"><i class="arrow down"></i></a>
</div>
</div>
</div>
<div id="software" class="container-fluid">
<div id="software-row" class="row">
<div id="sidenavbarcol" class="col-md-4 col-lg-3 py-5"> <!-- this is column stuff for the side nav bar -->
<div id="sidenavbar" class="row justify-content-center">
<div id="sidenavbarimagediv" class="col-6 col-lg-8"> <!-- this is column stuff for the image on the side-->
<img class="img-fluid rounded-circle" src="images/headshot_resize.jpg" />
</div>
<div class="w-100 mb-4"></div>
<div id="sidenavbarlist" class="list-group list-group-side-nav">
<a class="list-group-item list-group-item-action" href="#upto"><span>What I'm up to</span></a>
<a class="list-group-item list-group-item-action" href="#wasupto"><span>What I've done</span></a>
<a class="list-group-item list-group-item-action" href="#coolprojects"><span>Projects</span></a>
<a class="list-group-item list-group-item-action" href="#toplinks"><span>Links</span></a>
<!-- <a class="list-group-item list-group-item-action" href="#list-item-4">Item 4</a> -->
</div>
</div>
</div>
<div id="columncontent" class="col-md-8 col-lg-9 bg-white py-5">
<div class="contentsection container p-3" id="section1">
<h3 id="softwaredeveloper" class="goldtext">I'm a developer, designer, product enthusiast, and entrepreneur.|</h3>
</div>
<div class="contentsection container p-3" id="section2">
<h3 id="upto">What I'm up to right now</h3>
<div class="exp pl-3 ml-md-3">
<h4>Software Engineer @ <a target="_blank" href="https://tiktok.com">TikTok</a></h4>
<h5>2022-Present</h5>
<p>I am currently an Android software engineer II on the Privacy Product team owning and designing systems that power all of the launch popups in all of the TikTok apps. Native Android development, system design, monitoring, etc.</p>
<div class="row no-gutters mt-4">
<div class="col-lg-3">
<img style="opacity: 0.70;" class="img-fluid" src="images/tiktok.png" />
</div>
</div>
</div>
</div>
<div class="contentsection container p-3" id="section3">
<h3 id="wasupto">What I've done</h3>
<div class="exp pl-3 ml-md-3">
<h4>Software Engineer @ <a target="_blank" href="https://wish.com">Wish</a></h4>
<h5>2021-2022</h5>
<p>I was a full-stack software engineer on the Android team working on high-impact end-to-end features across areas like Brands and Merchants, Videos, and Wish Local. Worked with native Android (Kotlin, MVI/MVVM), Python, MongoDB, etc.</p>
<div class="row no-gutters mt-4">
<div class="col-lg-3">
<img style="opacity: 0.70;" class="img-fluid" src="images/wish_logo.png" />
</div>
</div>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Co-founder @ <a target="_blank" href="https://amni.io">Amni</a></h4>
<h5>2020-2021</h5>
<p>Amni was the second major pivot of our team-of-four's startup. Accepted to Berkeley Skydeck's hotdesk 2020, we were building a unique savings/microinvestment platform. As co-founder, engineer, and product owner, I lead the front-end development of our product.</p>
</div>
<div id="educationdiv" class="mb-4 pb-1 ml-md-3">
<img id="eduicon" class="d-inline-block mr-2 align-middle" src="images/icons/education.png" height="40px" width="40px"/>
<h4 id="education" class="d-inline align-middle">I graduated from UC Berkeley as an EECS major and Regents' scholar in December 2020.</h4>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Software Engineer Intern @ <a target="_blank" href="https://uber.com">Uber</a></h4>
<h5>Summer 2020</h5>
<p>I was a backend engineer on the Core Services team, working on the new user platform that handles all user traffic and data. I created a modular, scalable, efficient library/API layer on top of the users service to improve ease of integration by other microservices at Uber. <i>All</i> services in Uber's backend plan to use this new layer to handle <i>all</i> of Uber's user data. Golang, gRPC, Protobuf, Bazel (code gen).</p>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Software Engineer Intern @ <a target="_blank" href="https://uber.com">Uber</a></h4>
<h5>Summer 2019</h5>
<p>This was my first summer at Uber, and I was on the Driver Experience team working as a mobile engineer. I worked on a new rating and tipping screen in the Uber Android app (native code), while at the same time spearheading the use of a mobile framework that drastically improved code quality and efficiency, and paved the way for a shift in Uber's Android architecture.</p>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Co-lead Product Manager and Android Lead @ <a target="_blank" href="https://asuc.org/berkeley-mobile/">Berkeley Mobile</a></h4>
<h5>Freshman year till senior year</h5>
<p>As co-product manager and project lead, I spearheaded a year-long redesign of the most popular UC Berkeley campus mobile app, leading a team of 15+ engineers and designers. Handle aspects from feature planning and sprint planning to writing product specs and helping out engineers and designers when needed. My first pure-product role helped me express my product mindset, take a leadership role, and learn a lot of UX techniques that I was never taught.</p>
<p>As Android Lead as well, I lead our 5-developer Android team in making the core Android architecture design decisions and planning out our sprints. I built a significant portion of the redesigned app from scratch, working on a lot of the complicated features from the ground up: local map search, an entire Google Maps-esque map UI and flow, multi-threading for app responsiveness. I also lead the client development of Study Pact, the app's study group feature, within a month. We use a clean MVVM design pattern with UI and data separation.</p>
<div class="row no-gutters">
<div class="col-lg-5">
<img style="opacity: 0.85;" class="img-fluid" src="images/berkeley mobile 2.png" />
</div>
</div>
</div>
<!-- <img class="d-inline-block" src="images/icons/berkeley.png" height="46px" width="46px" /> -->
<div class="exp pl-3 ml-md-3">
<h4>Software Engineer Intern @ <a target="_blank" href="https://eyelevel.">Eyelevel.ai</a></h4>
<h5>Summer 2018</h5>
<p>Eyelevel.ai is Berkeley Skydeck incubated, and they brought me on as their first software intern back in 2018 to implement their entire web application and dashboard. I learned JavaScript, React, and Redux over a weekend (although, still had a lot to learn), and got to work. With a great mentor teaching me code practices and clean design, I was able to finish a significant portion of the fully-dynamic, interactive, full-stack web application over a summer.</p>
</div>
</div>
<div class="contentsection container p-3" id="section3">
<h3 id="coolprojects">Some cool things I've made</h3>
<div class="exp pl-3 ml-md-3">
<h4>PullQueue, a useful slack bot for pull reviews <a target="_blank" class="codelink" href="https://github.com/sidkaria/pullqueue">[code]</a></h4>
<p>I spent a couple weekends building this slack bot which is currently in use at Wish. It organizes all GitHub pull request links sent via slack message inside a channel into a giant pinned message that acts like a "queue." You can see all pending PRs, complete them by removing from the queue, and receive reminders every day on how many pending PRs there are. And the app does all this without any running persistent storage. Constantly in development :)</p>
<div class="row no-gutters">
<div class="col-lg-5">
<img style="opacity: 0.85;" class="img-fluid" src="images/pullqueue.gif" />
</div>
</div>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Altruist <a target="_blank" class="codelink" href="https://github.com/sidkaria/altruist-mobile">[code]</a></h4>
<p>The Amni team's first inspiration and furthest progress in a venture. We engineered a demo/MVP for an end-to-end volunteer service hour reporting platform; our initial technical push being a mobile app. Uses React Native, Django backend, GCP.</p>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Crowd.ai <a target="_blank" class="codelink" href="https://github.com/sidkaria/crowd.ai">[code]</a></h4>
<p>This was part of a 5G/AI innovation class at Berkeley, but turned out to be quite an amazing product demo. Essentially a real-time Waze for foot-traffic. It uses location data and light geospatial analysis to give accurate location crowd sizes and popularity (for people who use the app). I coded it end-to-end with React Native, Google Cloud Functions, and Firebase.</p>
</div>
<div class="exp pl-3 ml-md-3">
<h4>TRON project for CalHacks (we won the sponsor prize) <a target="_blank" class="codelink" href="https://github.com/sidkaria/tronbois">[code]</a></h4>
<p>My two other friends and I teamed up to create a secure IoT based, and blockchain incentivized data submission platform with a mobile interface (lot of buzzwords there, I know). I worked on the mobile with native Android and helped out with our node.js backend, while others worked with TRON's blockchain software and raspberry pi IoT data.</p>
</div>
<div class="exp pl-3 ml-md-3">
<h4>Chargo <a target="_blank" class="codelink" href="https://play.google.com/store/apps/details?id=us.chargo.chargo&hl=en_US">[play store link]</a></h4>
<p>My first pursued startup, and the result of the month-long program in summer 2016 called MIT Launch (now LaunchX). It was a way for people walking around cities to pick up chargers at restaurants, use them for free within a couple hours, and return them to another Chargo location. We did make some cool progress on the app and launched a test run in Cambridge with restaurants.</p>
<div class="row no-gutters">
<div class="col-lg-5">
<img style="opacity: 0.85;" class="img-fluid" src="images/chargo.jpg" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- <div id="music" class="container-fluid text-center bg-dark p-5">
<h3 id="musician" class="lightblue">I also make music!</h3>
<div id="music-row" class="row justify-content-left">
<div id="musiccol2" class="col-md-4 text-center py-5">
<img src="images/hesitate.jpg" class="img-fluid" />
</div>
<div id="musiccol1" class="col-md-4 text-center py-5">
<img src="images/reflect.jpg" class="img-fluid" />
</div>
<div id="musiccol1" class="col-md-4 text-center py-5">
</div>
</div>
</div> -->
<footer class="container-fluid py-4">
<ul id="toplinks" class="text-center p-3">
<li><a target="_blank" href="mailto:[email protected]"><img class="iconimage" height="30px" width="30px" src="images/icons/email.svg"/></a></li>
<li><a target="_blank" href="https://github.com/sidkaria"><img class="iconimage" height="30px" width="30px" src="images/icons/github.svg"/></a></li>
<li><a target="_blank" href="https://www.linkedin.com/in/siddharth-karia/"><img class="iconimage" height="30px" width="30px" src="images/icons/linkedin.svg"/></a></li>
<li><a target="_blank" href="http://instagram.com/sid.karia"><img class="iconimage" height="30px" width="30px" src="images/icons/instagram.svg"/></a></li>
<li><a target="_blank" href="https://open.spotify.com/artist/4Bwfpdtc6zG41L2GyIKCnE"><img class="iconimage" height="30px" width="30px" src="images/icons/spotify.svg"/></a></li>
</ul>
<ul class="row justify-content-center mb-4">
<!-- <li class="col-sm-2 text-center"><a class="footerlink" href="contact.html">contact me</li> -->
<!-- <li class="col-sm-2 text-center"><a class="footerlink" target="_blank" href="http://www.linkedin.com/in/siddharth-karia/">linkedin</li> -->
<li class="col-sm-2 text-center"><a class="footerlink" href="files/Siddharth Karia - Resume.pdf">resume</a></li>
</ul>
<div id="copyright" class="col text-center">
© 2020 <a class="footerlink" href="http://www.siddharthkaria.com">Siddharth Karia</a>. All rights reserved.
</div>
</footer>
</body>
<script src="https://code.jquery.com/jquery-3.5.1.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script type="text/javascript" src="js/changeheader.js"></script>
<script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js"></script>
<script src="js/jquery.scrollTo.min.js"></script>
<script src="js\parallax.js-1.5.0\parallax.js"></script>
<script type="text/javascript">
$("#sidenavbarlist .list-group-item").on('click', function(event) {
// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {
// Prevent default anchor click behavior
event.preventDefault();
// Store hash
var hash = this.hash;
// Using jQuery's animate() method to add smooth page scroll
// The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 400, function(){
// Add hash (#) to URL when done scrolling (default click behavior)
window.location.hash = hash;
});
} // End if
});
window.sr = ScrollReveal({duration : 1000});
sr.reveal('#hiimsid', {origin : 'left', delay : 200});
sr.reveal('#messagep', {origin : 'right', delay : 800});
sr.reveal('.circlelines', 100);
sr.reveal('#movedown2', {delay : 600});
sr.reveal('#sidenavbarimagediv', {delay : 300});
sr.reveal('#headshotdiv', {origin : 'left', delay : 100, viewFactor : 0.4});
sr.reveal('#headshotmessage', {origin : 'right', delay : 500, viewFactor : 0.4});
// sr.reveal('#section2', {viewFactor : 0.25, reset : true})
$("#movedown").click(function() {
$('html, body').animate({
scrollTop: $("#software").offset().top
}, 700);
});
</script>
</html>