warp/index.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>