160 lines
8.8 KiB
HTML
160 lines
8.8 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
|
<title>Hi Warp Team, I'm August!</title>
|
||
|
|
<script type="module" src="/src/index.ts"></script>
|
||
|
|
<link rel="preconnect" href="https://rsms.me/">
|
||
|
|
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
|
||
|
|
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/hack-font@3/build/web/hack.css">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<div class="background">
|
||
|
|
<div class="dots">
|
||
|
|
<div class="page">
|
||
|
|
<div>
|
||
|
|
<h1 class="accent"> Hi Warp Team!</h1>
|
||
|
|
<h1> i'm <span class="august-accent">august</span></h1>
|
||
|
|
<p>I love your product and want to help build the terminal of the future</p>
|
||
|
|
<code class="intro-prompt accent">$ <span class="echo">echo </span><span id="typed"></span></code>
|
||
|
|
</div>
|
||
|
|
<img class="chevron" aria-hidden="true" src="/chevron.svg">
|
||
|
|
</div>
|
||
|
|
<div class="page">
|
||
|
|
<div class="about-menu">
|
||
|
|
<h1>what <span class="august-accent">am I</span>?</h1>
|
||
|
|
<p id="about">
|
||
|
|
I am a skilled Rust and Typescript <a href="#engineer"
|
||
|
|
class="august-accent-underline">engineer</a> who has
|
||
|
|
collaborated with global teams to
|
||
|
|
bring developers <a href="#together">together</a>, applies her skills to build
|
||
|
|
<a href="#beautiful">beautiful</a> products, and spends her free time <a
|
||
|
|
href="#tinkering">tinkering</a> and growing her skills.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="about-display">
|
||
|
|
<div class="about" id="engineer">
|
||
|
|
<div id="george" class="george widget">
|
||
|
|
<div class="traffic-lights">
|
||
|
|
<span class="dot red"></span>
|
||
|
|
<span class="dot yellow"></span>
|
||
|
|
<span class="dot green"></span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<p class="accent">
|
||
|
|
This <a href="https://git.augustkline.com/august/warp" target="_blank"
|
||
|
|
rel="noreferer">site</a> was written in plain
|
||
|
|
Typescript, and this
|
||
|
|
demo is an <a href="https://git.augustkline.com/august/george-emu" target="_blank"
|
||
|
|
rel="noreferer">emulator</a> i wrote from
|
||
|
|
scratch in Rust that was compiled to WASM and runs
|
||
|
|
hand-written assembly in the browser at native speed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="about" id="together">
|
||
|
|
<img class="widget train" src="/train.svg" />
|
||
|
|
<p class="accent">
|
||
|
|
At my last job with <a href="https://thecodingtrain.com/" target="_blank"
|
||
|
|
rel="noreferer">The Coding
|
||
|
|
Train</a> I worked with
|
||
|
|
a
|
||
|
|
global team of designers and educators to bring coding education to tens of thousands of
|
||
|
|
monthly
|
||
|
|
active users. I led implementation of the <a href="https://thecodingtrain.com/showcase"
|
||
|
|
target="_blank" rel="noreferer">Passenger
|
||
|
|
Showcase</a>, which enabled hundreds of creative coders to have their projects featured
|
||
|
|
on
|
||
|
|
the
|
||
|
|
site.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="about" id="beautiful">
|
||
|
|
<img class="widget"
|
||
|
|
src="https://upload.wikimedia.org/wikipedia/commons/e/e2/New_York_Daniel_Rozin_%22The_Wooden_Mirror%22_%285060453987%29.jpg" />
|
||
|
|
<p class="accent">I'm both a talented engineer and creatively-driven. I studied at NYU ITP's
|
||
|
|
undergrad program,
|
||
|
|
Interactive Media Arts, where I applied my engineering skills to the arts, creating <a
|
||
|
|
href="https://soundpaint.vercel.app" target="_blank" rel="noreferer">interactive musical
|
||
|
|
watercolors</a>, <a href="https://github.com/augustkline/childhoodstegify"
|
||
|
|
target="_blank" rel="noreferer">hidden message poetry</a>, and <a
|
||
|
|
href="https://github.com/augustkline/traceomancy" target="_blank"
|
||
|
|
rel="noreferer">networked oracles</a>, just to name a
|
||
|
|
few
|
||
|
|
projects.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="about" id="tinkering">
|
||
|
|
<img src="/blinkenlights.jpeg" class="widget" />
|
||
|
|
<p class="accent">
|
||
|
|
For fun I like to play with <a href="https://git.augustkline.com/august/george-hardware"
|
||
|
|
target="_blank" rel="noreferer">hardware</a>, and lately I've
|
||
|
|
been
|
||
|
|
developing <a href="https://git.augustkline.com/august/fuzzy" target="_blank"
|
||
|
|
rel="noreferer">fuzzy</a>, a programming
|
||
|
|
language
|
||
|
|
for
|
||
|
|
my homemade computer <a href="https://git.augustkline.com/august/george" target="_blank"
|
||
|
|
rel="noreferer">george</a>. Other
|
||
|
|
spare-time projects I've written include <a href="https://github.com/augustkline/aurchive"
|
||
|
|
target="_blank" rel="noreferer">svg
|
||
|
|
canvases</a>, <a href="https://git.augustkline.com/august/birdkov" target="_blank"
|
||
|
|
rel="noreferer">generative audio
|
||
|
|
markov
|
||
|
|
chains</a>, and <a href="https://github.com/augustkline/ephemeral-chat" target="_blank"
|
||
|
|
rel="noreferer">ephemeral chat
|
||
|
|
apps</a>.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="page">
|
||
|
|
<div class="page-desc left">
|
||
|
|
<span class="accent"><code>man</code> for the future of coding</span>
|
||
|
|
<h1>here's a <span class="august-accent">feature idea</span>...</h1>
|
||
|
|
<p>I read up on your interview process and figured I'd skip straight to the best part!</p>
|
||
|
|
<p>The terminal of the future should blur the lines between TUI and GUI.</p>
|
||
|
|
<p>Here, I imagined an enhanced user interface for <code>man</code> that respects the developer and
|
||
|
|
doesn't
|
||
|
|
switch
|
||
|
|
contexts
|
||
|
|
or change their workflow.</p>
|
||
|
|
<p>(and <a href="https://git.augustkline.com/august/manserve" target="_blank"
|
||
|
|
rel="noreferer">here's</a> a little server I wrote
|
||
|
|
just
|
||
|
|
for
|
||
|
|
this demo)</p>
|
||
|
|
</div>
|
||
|
|
<div id="man-demo">
|
||
|
|
<div class="terminal widget" id="man-terminal">
|
||
|
|
<div class="traffic-lights">
|
||
|
|
<span class="dot red"></span>
|
||
|
|
<span class="dot yellow"></span>
|
||
|
|
<span class="dot green"></span>
|
||
|
|
</div>
|
||
|
|
<div id="results"></div>
|
||
|
|
<form id="man-input">
|
||
|
|
<code>~</code>
|
||
|
|
<input type="text" name="command" autocomplete="off" placeholder="Try typing `man pwd`" />
|
||
|
|
<input type="submit" hidden />
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="page">
|
||
|
|
<div>
|
||
|
|
<h1>Let's work <span class="august-accent">together</span></h1>
|
||
|
|
<p>Shoot me an <a href="mailto:me@augustkline.com">email</a> and let's set up an interview</p>
|
||
|
|
<p>I'm really excited to bring my skills to your team!</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|