-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
154 lines (132 loc) · 7.49 KB
/
index.html
File metadata and controls
154 lines (132 loc) · 7.49 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Eric Suen - Senior Platform & Backend Engineer</title>
<meta name="description" content="Senior platform engineer who owned deployment infrastructure for ~1,000 engineers at Block. 10+ years building deployment systems, backend services, and distributed coordination layers in Go and Python.">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<meta property="og:title" content="Eric Suen - Senior Platform & Backend Engineer">
<meta property="og:description" content="Senior platform engineer who owned deployment infrastructure for ~1,000 engineers at Block. 10+ years building deployment systems, backend services, and distributed coordination layers in Go and Python.">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Eric Suen - Senior Platform & Backend Engineer">
<meta name="twitter:description" content="Senior platform engineer who owned deployment infrastructure for ~1,000 engineers at Block. 10+ years building deployment systems, backend services, and distributed coordination layers in Go and Python.">
<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=Inter:wght@400;500;600&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="shared.css">
<style>
.container { max-width: 680px; }
h1 { margin-bottom: 16px; }
.tagline {
font-size: 0.95rem;
color: var(--text-secondary);
margin-bottom: 16px;
}
.links {
display: flex;
flex-wrap: wrap;
gap: 20px;
font-size: 0.9rem;
}
.links a {
color: var(--text-secondary);
text-decoration: none;
transition: color 0.15s;
}
.links a:hover { color: var(--accent); }
.links .separator {
color: var(--border);
user-select: none;
}
section { margin-bottom: 48px; }
h2 {
margin-bottom: 20px;
padding-bottom: 8px;
border-bottom: 1px solid var(--border);
}
.project { margin-bottom: 24px; }
.project:last-child { margin-bottom: 0; }
.project-header {
display: flex;
justify-content: space-between;
align-items: baseline;
flex-wrap: wrap;
gap: 4px;
margin-bottom: 2px;
}
.project-name { font-weight: 600; font-size: 1rem; }
.project-tech { font-size: 0.85rem; color: var(--text-tertiary); }
.project-description {
font-size: 0.95rem;
color: var(--text-secondary);
line-height: 1.7;
}
@media (max-width: 600px) {
.project-header {
flex-direction: column;
gap: 0;
}
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>Eric Suen</h1>
<p class="tagline">Senior platform engineer · Owned deployment infrastructure for ~1,000 engineers at Block · Go, Kubernetes, distributed systems</p>
<p class="tagline" style="font-size: 0.9rem; color: var(--text-tertiary);">Currently exploring senior backend and platform engineering roles in SF and remote.</p>
<div class="links">
<a href="mailto:esuen8@gmail.com">Email</a>
<span class="separator">/</span>
<a href="https://linkedin.com/in/sueneric" target="_blank" rel="noopener">LinkedIn</a>
<span class="separator">/</span>
<a href="https://github.com/esuen" target="_blank" rel="noopener">GitHub</a>
</div>
</header>
<section id="projects">
<h2>What I've been building lately</h2>
<div class="project">
<div class="project-header">
<span class="project-name"><a href="https://github.com/esuen/launchpad" target="_blank" rel="noopener" style="color: inherit; text-decoration: none; border-bottom: 1px solid var(--border); transition: border-color 0.15s;">Launchpad</a></span>
<span class="project-tech">Go, Kubernetes, Helm, GitHub Actions, Postgres, Prometheus, Grafana</span>
</div>
<p class="project-description">
A deployment tracking platform built to mirror what a strong startup runs in production. A Go API backed by Postgres, deployed to Kubernetes via Helm with GitOps through Argo CD, automated CI/CD, HTTPS ingress, and full observability through Prometheus and Grafana. Features environment separation (staging/production) with declarative deployments where git is the single source of truth. <a href="https://github.com/esuen/launchpad" target="_blank" rel="noopener" style="color: var(--accent); text-decoration: none; font-size: 0.9rem;">See the project →</a>
</p>
</div>
<div class="project">
<div class="project-header">
<span class="project-name"><a href="astral-rift.html" style="color: inherit; text-decoration: none; border-bottom: 1px solid var(--border); transition: border-color 0.15s;">Astral Rift</a></span>
<span class="project-tech">Unreal Engine 5, C++, HLSL, Python, JAX</span>
</div>
<p class="project-description">
Your shields are your weapons. A multiplayer space combat game where every trigger pull costs you the defenses that keep you alive, built entirely in C++ on Unreal Engine 5. Eight ships across five factions, 20 abilities, 5 game modes, and neural network bots trained via reinforcement learning across 50 billion+ steps—with automated evaluation that diagnoses behavioral gaps and tunes reward shaping across 23 training phases. Client-side prediction with server reconciliation and lag compensation. 375+ automated tests. <a href="astral-rift.html" style="color: var(--accent); text-decoration: none; font-size: 0.9rem;">See the project →</a>
</p>
</div>
<div class="project">
<div class="project-header">
<span class="project-name"><a href="barbell-5x5.html" style="color: inherit; text-decoration: none; border-bottom: 1px solid var(--border); transition: border-color 0.15s;">Barbell 5x5</a></span>
<span class="project-tech">Swift, SwiftUI, iOS, watchOS</span>
</div>
<p class="project-description">
An app that knows what workout you should do today, tells you exactly what weight to load, and gets out of the way. 8 built-in programs, HealthKit readiness scoring, Apple Watch companion, and 50+ exercises with animated form guides. <a href="barbell-5x5.html" style="color: var(--accent); text-decoration: none; font-size: 0.9rem;">See the project →</a>
</p>
</div>
<div class="project">
<div class="project-header">
<span class="project-name">Pickleball Rally Clipper</span>
<span class="project-tech">Python, YOLOv8, OpenCV</span>
</div>
<p class="project-description">
I play a lot of pickleball and got tired of scrubbing through hours of match footage to find key rallies. I'm building a computer vision pipeline that cuts dead time from recordings, identifies shot types (dinks, drives, drops, lobs, overheads, counters), measures ball velocity, and uses pose estimation to compare player form against professional technique. Built on a custom-trained YOLOv8 model with YOLOv8-Pose for joint tracking. In development—demo coming soon.
</p>
</div>
</section>
<footer>
<p>San Francisco Bay Area</p>
</footer>
</div>
</body>
</html>