<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
		<meta name="theme-color" content="#000000">
		<link rel="icon" href="/assets/icons/pb.ico?v=Sp5RAyOijV2fFmdv" sizes="16x16 32x32 48x48">
		<link rel="apple-touch-icon" href="/assets/icons/pb-180.png?v=FPfbxUul0jap4E6I">
		<title>Paul Bakaus</title>
		<link rel="preload" href="/assets/fonts/Tiny5-Regular.woff2?v=2jNZOqxy3lh8rAYk" as="font" type="font/woff2" crossorigin>
		<link rel="preload" href="/assets/fonts/DepartureMono-Regular.woff2?v=W0_tHaqQcIqpxu4R" as="font" type="font/woff2" crossorigin>
		<style>@font-face{font-family:"Tiny5";src:url("/assets/fonts/Tiny5-Regular.woff2?v=2jNZOqxy3lh8rAYk") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Tiny5";src:url("/assets/fonts/Tiny5-Regular-ext.woff2?v=iK2xN5IHPFNM5Ltt") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Departure Mono";src:url("/assets/fonts/DepartureMono-Regular.woff2?v=W0_tHaqQcIqpxu4R") format("woff2");font-weight:400;font-style:normal;font-display:swap}</style>
		<link rel="stylesheet" type="text/css" href="/assets/css/demo.css?v=DOKZWYY1WXGTduXO">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-iso.css?v=2R05PFmpJsxrcZ0k">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-shelf.css?v=0TTEWew-v5sXUOTS">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-road.css?v=dbJNZdwLsj4-VBvI">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-mission.css?v=phWLVAWSg8mG_1dV">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-voyage.css?v=mnf2e88GUJKDaSgk">
		<link rel="stylesheet" type="text/css" href="/assets/css/demo-speaking.css?v=OEdqYSQMuCusNvYj">
		<script>(function(h){h.classList.add('js');try{if(sessionStorage.getItem('pb-arrive'))h.classList.add('is-arriving');if(localStorage.getItem('pb-motion')==='still')h.classList.add('is-still','is-reduced');}catch(e){}})(document.documentElement);</script>
		<meta name="description" content="Building AI tools. Writing about code, creativity, and the creator economy. A tech exec who still ships.">
    <link rel="icon" href="https://www.paulbakaus.com/content/images/size/w256h256/2026/09/pb-384.png" type="image/png">
    <link rel="canonical" href="https://www.paulbakaus.com/">
    <meta name="referrer" content="origin-when-cross-origin">
    
    <meta property="og:site_name" content="Paul Bakaus">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Paul Bakaus">
    <meta property="og:description" content="Building AI tools. Writing about code, creativity, and the creator economy. A tech exec who still ships.">
    <meta property="og:url" content="https://www.paulbakaus.com/">
    <meta property="og:image" content="https://www.paulbakaus.com/content/images/size/w1200/2025/05/ChatGPT-Image-May-15--2025--04_53_53-PM-1.png">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Paul Bakaus">
    <meta name="twitter:description" content="Building AI tools. Writing about code, creativity, and the creator economy. A tech exec who still ships.">
    <meta name="twitter:url" content="https://www.paulbakaus.com/">
    <meta name="twitter:image" content="https://www.paulbakaus.com/content/images/size/w1200/2025/05/ChatGPT-Image-May-15--2025--04_53_53-PM.png">
    <meta name="twitter:site" content="@pbakaus">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="800">
    
    <script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "WebSite",
    "publisher": {
        "@type": "Organization",
        "name": "Paul Bakaus",
        "url": "https://www.paulbakaus.com/",
        "logo": {
            "@type": "ImageObject",
            "url": "https://www.paulbakaus.com/content/images/size/w256h256/2026/09/pb-384.png",
            "width": 60,
            "height": 60
        }
    },
    "url": "https://www.paulbakaus.com/",
    "name": "Paul Bakaus",
    "image": {
        "@type": "ImageObject",
        "url": "https://static.ghost.org/v4.0.0/images/publication-cover.jpg",
        "width": 1200,
        "height": 482
    },
    "mainEntityOfPage": "https://www.paulbakaus.com/",
    "description": "Building AI tools. Writing about code, creativity, and the creator economy. A tech exec who still ships."
}
    </script>

    <meta name="generator" content="Ghost 6.72">
    <link rel="alternate" type="application/rss+xml" title="Paul Bakaus" href="https://www.paulbakaus.com/writing/rss/">
    <style id="gh-members-styles">.gh-post-upgrade-cta-content,
.gh-post-upgrade-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-align: center;
    width: 100%;
    color: #ffffff;
    font-size: 16px;
}

.gh-post-upgrade-cta-content {
    border-radius: 8px;
    padding: 40px 4vw;
}

.gh-post-upgrade-cta h2 {
    color: #ffffff;
    font-size: 28px;
    letter-spacing: -0.2px;
    margin: 0;
    padding: 0;
}

.gh-post-upgrade-cta p {
    margin: 20px 0 0;
    padding: 0;
}

.gh-post-upgrade-cta small {
    font-size: 16px;
    letter-spacing: -0.2px;
}

.gh-post-upgrade-cta a {
    color: #ffffff;
    cursor: pointer;
    font-weight: 500;
    box-shadow: none;
    text-decoration: underline;
}

.gh-post-upgrade-cta a:hover {
    color: #ffffff;
    opacity: 0.8;
    box-shadow: none;
    text-decoration: underline;
}

.gh-post-upgrade-cta a.gh-btn {
    display: block;
    background: #ffffff;
    text-decoration: none;
    margin: 28px 0 0;
    padding: 8px 18px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
}

.gh-post-upgrade-cta a.gh-btn:hover {
    opacity: 0.92;
}</style><script async src="https://js.stripe.com/v3/"></script>
    
    <link href="https://www.paulbakaus.com/webmentions/receive/" rel="webmention">
    <script defer src="/public/cards.min.js?v=ShRHxgy4po8zN-Wf"></script>
    <link rel="stylesheet" type="text/css" href="/public/cards.min.css?v=WwnU9jw5ancNC8Gc">
    <script defer src="/public/comment-counts.min.js?v=oFYkaGLdiMqB8VN9" data-ghost-comments-counts-api="https://www.paulbakaus.com/members/api/comments/counts/"></script>
    <script defer src="/public/member-attribution.min.js?v=AKG4hWena9j3yX3I"></script>
    <script defer src="/public/ghost-stats.min.js?v=vFcCUf6ZQ0Hyhc8h" data-stringify-payload="false" data-datasource="analytics_events" data-storage="localStorage" data-host="https://www.paulbakaus.com/.ghost/analytics/api/v1/page_hit"  tb_site_uuid="155b035f-b71d-407b-a9d2-6c323202359d" tb_post_uuid="undefined" tb_post_type="null" tb_member_uuid="undefined" tb_member_status="undefined" tb_gift_link=""></script><style>:root {--ghost-accent-color: #691bf8;}</style>
    <!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XKEL5SB106"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-XKEL5SB106');
</script>
		<template id="pb-portal"><meta name="generator" content="Ghost 6.72">
    <link rel="alternate" type="application/rss+xml" title="Paul Bakaus" href="https://www.paulbakaus.com/writing/rss/">
    <script defer src="https://www.paulbakaus.com/content/files/ghost-apps/portal/portal.min.js" data-i18n="true" data-ghost="https://www.paulbakaus.com/" data-key="65f476ccef5b456baa5054e1fd" data-api="https://www.paulbakaus.com/ghost/api/content/" data-locale="en" crossorigin="anonymous"></script><script async src="https://js.stripe.com/v3/"></script>
    <link href="https://www.paulbakaus.com/webmentions/receive/" rel="webmention">
    <script defer src="/public/member-attribution.min.js?v=AKG4hWena9j3yX3I"></script>
    <script defer src="/public/ghost-stats.min.js?v=vFcCUf6ZQ0Hyhc8h" data-stringify-payload="false" data-datasource="analytics_events" data-storage="localStorage" data-host="https://www.paulbakaus.com/.ghost/analytics/api/v1/page_hit"  tb_site_uuid="155b035f-b71d-407b-a9d2-6c323202359d" tb_post_uuid="undefined" tb_post_type="null" tb_member_uuid="undefined" tb_member_status="undefined" tb_gift_link=""></script><style>:root {--ghost-accent-color: #691bf8;}</style>
    <!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XKEL5SB106"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-XKEL5SB106');
</script></template>
	</head>
	<body class="home-template">
<!--
THESIS: paulbakaus.com is a megademo, a real-time production where every page is a part rendered live by code. It refuses the dark founder portfolio of name, portrait, bento grid, and timeline.
OWN-WORLD: 12-bit OCS palette only (#RGB): black CRT ground, copper ramps F06>F80>FE0 and 04F>0CF>EFF, Workbench blue 05A, gadget bevels AAB/FFF/556. Tiny5 pixel lettering for headings, labels and chrome; Departure Mono pixel text for prose. Hard pixel edges, ordered dither, stepped motion, no glow. Depth through fake 3D: voxels, isometric dioramas, a pseudo-3D road, side-scrolling parallax.
STORY: visitors meet Paul as the author of the demo, follow the throughline from jQuery UI to Renaissance Geek, then read, subscribe, get in touch, or apply.
FIRST VIEWPORT: HUD strip on top; voxel pixel logo PAUL BAKAUS across the left two thirds over a parallax rooftop hack night above a neon megacity (plate tower, green reactor glow): string lights, a food cart, builders on laptops and a crowd in front, and on stage in the right third a three-person panel in front of a big screen running a live effect, Paul in the middle talking with his hands; tagline and two gadgets on a black plate under the logo; full-width sine scroller along the bottom. Sound starts only from the HUD's sound gadget; a first-run nudge points at it.
FORM: Megademo (demoscene production), Impeccable's pick, ranked 1 of 7; seed a3b1a5b8.
FINISH: unreviewed and undocumented is unfinished; this build ends with the finish review, the verdict, DESIGN.md, and every shipping raster carrying its provenance
-->
		<a class="dm-skip" href="#dm-main">Skip to content</a>
		<header class="dm-hud" id="dm-hud">
	<a class="dm-brand" href="https://www.paulbakaus.com" aria-label="Paul Bakaus, home" data-sfx-hover="coin">
		<svg class="dm-mark" viewBox="0 0 12 12" aria-hidden="true"><rect x="1" y="0" width="10" height="1" fill="#420"/><rect x="0" y="1" width="1" height="1" fill="#420"/><rect x="1" y="1" width="9" height="1" fill="#fe8"/><rect x="10" y="1" width="1" height="1" fill="#c60"/><rect x="11" y="1" width="1" height="1" fill="#420"/><rect x="0" y="2" width="1" height="1" fill="#420"/><rect x="1" y="2" width="1" height="1" fill="#fe8"/><rect x="2" y="2" width="1" height="1" fill="#420"/><rect x="3" y="2" width="6" height="1" fill="#fb0"/><rect x="9" y="2" width="1" height="1" fill="#420"/><rect x="10" y="2" width="1" height="1" fill="#c60"/><rect x="11" y="2" width="1" height="1" fill="#420"/><rect x="0" y="3" width="1" height="1" fill="#420"/><rect x="1" y="3" width="1" height="1" fill="#fe8"/><rect x="2" y="3" width="1" height="1" fill="#fb0"/><rect x="3" y="3" width="2" height="1" fill="#420"/><rect x="5" y="3" width="2" height="1" fill="#fb0"/><rect x="7" y="3" width="2" height="1" fill="#420"/><rect x="9" y="3" width="1" height="1" fill="#fb0"/><rect x="10" y="3" width="1" height="1" fill="#c60"/><rect x="11" y="3" width="1" height="1" fill="#420"/><rect x="0" y="4" width="1" height="1" fill="#420"/><rect x="1" y="4" width="1" height="1" fill="#fe8"/><rect x="2" y="4" width="1" height="1" fill="#fb0"/><rect x="3" y="4" width="1" height="1" fill="#420"/><rect x="4" y="4" width="1" height="1" fill="#fb0"/><rect x="5" y="4" width="1" height="1" fill="#420"/><rect x="6" y="4" width="1" height="1" fill="#fb0"/><rect x="7" y="4" width="1" height="1" fill="#420"/><rect x="8" y="4" width="1" height="1" fill="#fb0"/><rect x="9" y="4" width="1" height="1" fill="#420"/><rect x="10" y="4" width="1" height="1" fill="#c60"/><rect x="11" y="4" width="1" height="1" fill="#420"/><rect x="0" y="5" width="1" height="1" fill="#420"/><rect x="1" y="5" width="1" height="1" fill="#fe8"/><rect x="2" y="5" width="1" height="1" fill="#fb0"/><rect x="3" y="5" width="2" height="1" fill="#420"/><rect x="5" y="5" width="2" height="1" fill="#fb0"/><rect x="7" y="5" width="2" height="1" fill="#420"/><rect x="9" y="5" width="1" height="1" fill="#fb0"/><rect x="10" y="5" width="1" height="1" fill="#c60"/><rect x="11" y="5" width="1" height="1" fill="#420"/><rect x="0" y="6" width="1" height="1" fill="#420"/><rect x="1" y="6" width="1" height="1" fill="#fe8"/><rect x="2" y="6" width="1" height="1" fill="#fb0"/><rect x="3" y="6" width="1" height="1" fill="#420"/><rect x="4" y="6" width="3" height="1" fill="#fb0"/><rect x="7" y="6" width="1" height="1" fill="#420"/><rect x="8" y="6" width="1" height="1" fill="#fb0"/><rect x="9" y="6" width="1" height="1" fill="#420"/><rect x="10" y="6" width="1" height="1" fill="#c60"/><rect x="11" y="6" width="1" height="1" fill="#420"/><rect x="0" y="7" width="1" height="1" fill="#420"/><rect x="1" y="7" width="1" height="1" fill="#fe8"/><rect x="2" y="7" width="1" height="1" fill="#fb0"/><rect x="3" y="7" width="1" height="1" fill="#420"/><rect x="4" y="7" width="3" height="1" fill="#fb0"/><rect x="7" y="7" width="2" height="1" fill="#420"/><rect x="9" y="7" width="1" height="1" fill="#fb0"/><rect x="10" y="7" width="1" height="1" fill="#c60"/><rect x="11" y="7" width="1" height="1" fill="#420"/><rect x="0" y="8" width="1" height="1" fill="#420"/><rect x="1" y="8" width="1" height="1" fill="#fe8"/><rect x="2" y="8" width="8" height="1" fill="#fb0"/><rect x="10" y="8" width="1" height="1" fill="#c60"/><rect x="11" y="8" width="1" height="1" fill="#420"/><rect x="0" y="9" width="1" height="1" fill="#420"/><rect x="1" y="9" width="1" height="1" fill="#fe8"/><rect x="2" y="9" width="1" height="1" fill="#420"/><rect x="3" y="9" width="6" height="1" fill="#fb0"/><rect x="9" y="9" width="1" height="1" fill="#420"/><rect x="10" y="9" width="1" height="1" fill="#c60"/><rect x="11" y="9" width="1" height="1" fill="#420"/><rect x="0" y="10" width="1" height="1" fill="#420"/><rect x="1" y="10" width="10" height="1" fill="#c60"/><rect x="11" y="10" width="1" height="1" fill="#420"/><rect x="1" y="11" width="10" height="1" fill="#420"/></svg>
		<span>Paul Bakaus</span>
	</a>
	<nav class="dm-nav" id="dm-nav" aria-label="Main">
		<ul>
			<li><a href="/" data-part="home"><kbd aria-hidden="true">1</kbd>Home</a></li>
			<li><a href="/projects/" data-part="projects"><kbd aria-hidden="true">2</kbd>Projects</a></li>
			<li><a href="/writing/" data-part="writing"><kbd aria-hidden="true">3</kbd>Writing</a></li>
			<li><a href="/speaking/" data-part="speaking"><kbd aria-hidden="true">4</kbd>Speaking</a></li>
			<li><a href="/mission/" data-part="mission"><kbd aria-hidden="true">5</kbd>Mission</a></li>
			<li><a href="/about/" data-part="about"><kbd aria-hidden="true">6</kbd>About</a></li>
		</ul>
		<span class="dm-nav-cursor" aria-hidden="true"></span>
	</nav>
	<div class="dm-meters">
		<span class="dm-fps" aria-hidden="true"><b data-hud-fps>60</b> FPS</span>
		<span class="dm-sound">
			<input class="dm-switch" type="checkbox" switch data-sound-toggle aria-label="Sound">
			<svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="1" y="6" width="3" height="4"/><rect x="4" y="5" width="1" height="6"/><rect x="5" y="4" width="1" height="8"/><rect x="6" y="3" width="1" height="10"/><rect x="7" y="2" width="1" height="12"/><g class="dm-wave"><rect data-vu x="9" y="6" width="1" height="6"/><rect data-vu x="11" y="4" width="1" height="8"/><rect data-vu x="13" y="7" width="1" height="5"/><rect data-vu x="15" y="5" width="1" height="7"/></g><g class="dm-mute"><rect x="10" y="5" width="1" height="1"/><rect x="11" y="6" width="1" height="1"/><rect x="12" y="7" width="1" height="2"/><rect x="13" y="9" width="1" height="1"/><rect x="14" y="10" width="1" height="1"/><rect x="14" y="5" width="1" height="1"/><rect x="13" y="6" width="1" height="1"/><rect x="11" y="9" width="1" height="1"/><rect x="10" y="10" width="1" height="1"/></g></svg>
			<span class="dm-sound-text" aria-hidden="true">Sound<span data-sound-label> off</span></span>
		</span>
		<button class="dm-opts-btn" type="button" data-opts-toggle aria-label="Sound options" aria-expanded="false" aria-controls="dm-opts">
			<svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="3" y="2" width="1" height="12"/><rect x="2" y="9" width="3" height="2"/><rect x="8" y="2" width="1" height="12"/><rect x="7" y="4" width="3" height="2"/><rect x="13" y="2" width="1" height="12"/><rect x="12" y="7" width="3" height="2"/></svg>
		</button>
		<div class="dm-opts" id="dm-opts" role="dialog" aria-label="Sound options" hidden>
			<p class="dm-opts-title" aria-hidden="true">Sound config</p>
			<button class="dm-opts-studio" type="button" data-studio-open aria-label="Open studio" aria-haspopup="dialog"><svg class="dm-icon" viewBox="0 0 8 8" aria-hidden="true"><rect x="0" y="0" width="3" height="1"/><rect x="0" y="1" width="1" height="2"/><rect x="5" y="0" width="3" height="1"/><rect x="7" y="1" width="1" height="2"/><rect x="0" y="7" width="3" height="1"/><rect x="0" y="5" width="1" height="2"/><rect x="5" y="7" width="3" height="1"/><rect x="7" y="5" width="1" height="2"/></svg></button>
			<div class="dm-opts-row">
				<span class="dm-opts-label" id="dm-opts-music" aria-hidden="true">Music</span>
				<div class="dm-opts-slider" role="slider" tabindex="0" aria-label="Music volume" aria-valuemin="0" aria-valuemax="8" aria-valuenow="5" aria-valuetext="5 of 8" data-opts-slider="music"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div>
			</div>
			<div class="dm-opts-row">
				<span class="dm-opts-label" id="dm-opts-sfx" aria-hidden="true">SFX</span>
				<div class="dm-opts-slider" role="slider" tabindex="0" aria-label="Sound effects volume" aria-valuemin="0" aria-valuemax="8" aria-valuenow="4" aria-valuetext="4 of 8" data-opts-slider="sfx"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></div>
			</div>
			<div class="dm-opts-row">
				<span class="dm-opts-label" id="dm-opts-tune">Tune</span>
				<div class="dm-opts-tune" role="group" aria-labelledby="dm-opts-tune">
					<button class="dm-opts-arrow" type="button" data-opts-tune="-1" aria-label="Previous tune"><svg viewBox="0 0 8 8" aria-hidden="true"><rect x="5" y="0" width="1" height="8"/><rect x="4" y="1" width="1" height="6"/><rect x="3" y="2" width="1" height="4"/><rect x="2" y="3" width="1" height="2"/></svg></button>
					<span class="dm-opts-tune-name" data-opts-tune-name aria-live="polite">Auto</span>
					<button class="dm-opts-arrow" type="button" data-opts-tune="1" aria-label="Next tune"><svg viewBox="0 0 8 8" aria-hidden="true"><rect x="2" y="0" width="1" height="8"/><rect x="3" y="1" width="1" height="6"/><rect x="4" y="2" width="1" height="4"/><rect x="5" y="3" width="1" height="2"/></svg></button>
				</div>
			</div>
			<div class="dm-opts-row dm-opts-row--wide">
				<span class="dm-opts-label" id="dm-opts-sound">Sound</span>
				<span class="dm-opts-switch"><input class="dm-switch" type="checkbox" switch data-opts-sound aria-labelledby="dm-opts-sound"><span data-opts-sound-label aria-hidden="true">Off</span></span>
			</div>
			<div class="dm-opts-row dm-opts-row--wide">
				<span class="dm-opts-label" id="dm-opts-motion">Motion</span>
				<span class="dm-opts-switch"><input class="dm-switch" type="checkbox" switch checked data-opts-motion aria-labelledby="dm-opts-motion"><span data-opts-motion-label aria-hidden="true">On</span></span>
			</div>
			<div class="dm-opts-row dm-opts-row--wide">
				<span class="dm-opts-label" id="dm-opts-keys">Keyboard shortcuts</span>
				<span class="dm-opts-switch"><input class="dm-switch" type="checkbox" switch checked data-opts-keys aria-labelledby="dm-opts-keys"><span data-opts-keys-label aria-hidden="true">On</span></span>
			</div>
			<p class="dm-opts-hint" aria-hidden="true">T: next tune&nbsp;&nbsp;M: sound</p>
		</div>
		<button class="dm-menu-btn dm-gadget" type="button" data-menu-toggle aria-expanded="false" aria-controls="dm-nav">Menu</button>
	</div>
	<span class="dm-pmeter" data-pmeter aria-hidden="true"><svg viewBox="0 0 35 6"><g class="pm-cell"><rect x="0" y="0" width="1" height="6"/><rect x="1" y="1" width="1" height="4"/><rect x="2" y="2" width="1" height="2"/></g><g class="pm-cell"><rect x="5" y="0" width="1" height="6"/><rect x="6" y="1" width="1" height="4"/><rect x="7" y="2" width="1" height="2"/></g><g class="pm-cell"><rect x="10" y="0" width="1" height="6"/><rect x="11" y="1" width="1" height="4"/><rect x="12" y="2" width="1" height="2"/></g><g class="pm-cell"><rect x="15" y="0" width="1" height="6"/><rect x="16" y="1" width="1" height="4"/><rect x="17" y="2" width="1" height="2"/></g><g class="pm-cell"><rect x="20" y="0" width="1" height="6"/><rect x="21" y="1" width="1" height="4"/><rect x="22" y="2" width="1" height="2"/></g><g class="pm-cell"><rect x="25" y="0" width="1" height="6"/><rect x="26" y="1" width="1" height="4"/><rect x="27" y="2" width="1" height="2"/></g><g class="pm-p"><rect x="31" y="0" width="3" height="1"/><rect x="31" y="1" width="1" height="1"/><rect x="34" y="1" width="1" height="1"/><rect x="31" y="2" width="1" height="1"/><rect x="34" y="2" width="1" height="1"/><rect x="31" y="3" width="3" height="1"/><rect x="31" y="4" width="1" height="1"/><rect x="31" y="5" width="1" height="1"/></g></svg></span>
</header>
		<main class="dm-main" id="dm-main" tabindex="-1">
			
<section class="dm-hero" id="dm-hero" aria-labelledby="dm-hero-title">
	<div class="dm-hero-stage">
		<canvas class="dm-hero-layer dm-hero-scene dm-fx" data-fx="rooftop" data-progress="#dm-hero" aria-hidden="true"></canvas>
		<canvas class="dm-hero-layer dm-fx" data-fx="voxels" data-fit="#dm-hero-title" data-progress="#dm-hero" aria-hidden="true"></canvas>
		<h1 class="dm-hero-title" id="dm-hero-title"><span>Paul</span> <span>Bakaus</span></h1>
		<div class="dm-hero-copy">
			<p class="dm-hero-tag">Product engineer before it was cool.</p>
			<p class="dm-hero-bio">Code, design, and product since jQuery UI. Now founder of Renaissance Geek, the company behind Impeccable.</p>
			<div class="dm-hero-actions">
				<a class="dm-gadget dm-gadget--hot" href="#now">See what I'm building</a>
				<a class="dm-gadget" href="/writing/">Read the writing</a>
			</div>
		</div>
		<div class="dm-hero-scroller" aria-hidden="true">
			<canvas class="dm-fx" data-fx="scroller" data-ramp="copper" data-text="PAUL BAKAUS PRESENTS A PERSONAL WEBSITE THAT IS SECRETLY A MEGADEMO  ...  CODE, DESIGN AND PRODUCT SINCE 2007  ...  JQUERY UI  ...  AVES ENGINE  ...  CHROME DEVTOOLS  ...  AMP AND WEB STORIES  ...  GOOGLE FOR CREATORS  ...  KOJI  ...  SPOTTER  ...  NOW FOUNDER OF RENAISSANCE GEEK, THE COMPANY BEHIND IMPECCABLE  ...  PRESS M FOR MUSIC, 1 TO 6 TO SWITCH PARTS  ...  KEEP SCROLLING, THE DEMO GOES ON  ...  " data-text-touch="PAUL BAKAUS PRESENTS A PERSONAL WEBSITE THAT IS SECRETLY A MEGADEMO  ...  CODE, DESIGN AND PRODUCT SINCE 2007  ...  JQUERY UI  ...  AVES ENGINE  ...  CHROME DEVTOOLS  ...  AMP AND WEB STORIES  ...  GOOGLE FOR CREATORS  ...  KOJI  ...  SPOTTER  ...  NOW FOUNDER OF RENAISSANCE GEEK, THE COMPANY BEHIND IMPECCABLE  ...  TAP THE SPEAKER FOR MUSIC, TAP THE BIG SCREEN FOR THE NEXT SLIDE  ...  KEEP SCROLLING, THE DEMO GOES ON  ...  "></canvas>
		</div>
	</div>
</section>

<section class="dm-statement" aria-label="What drives me">
	<canvas class="dm-statement-stars dm-fx" data-fx="statement-stars" aria-hidden="true"></canvas>
	<div class="dm-wrap dm-statement-grid">
		<p class="dm-statement-bio">I move between code, design, and product. I've been doing this since jQuery UI, through Chrome DevTools at Google, and now as founder of Renaissance Geek, the company behind Impeccable. I like building things right before they become obvious.</p>
		<p class="dm-statement-big" id="dm-statement-big">I'm driven by making <mark>AI work for everyone</mark>, not just developers, and by bringing curation and human judgment back to a web drowning in slop.</p>
		<a class="dm-link" href="/mission/">Read the mission <svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2" y="7" width="8" height="2"/><rect x="10" y="4" width="1" height="8"/><rect x="11" y="5" width="1" height="6"/><rect x="12" y="6" width="1" height="4"/><rect x="13" y="7" width="1" height="2"/></svg></a>
		<div class="dm-statement-stage" aria-hidden="true">
			<canvas class="dm-fx" data-fx="paul" data-anim="talk" data-alt="point" data-hover="#dm-statement-big" data-stage="spot" data-flip></canvas>
		</div>
	</div>
</section>

<section class="dm-iso-sec" id="now" aria-labelledby="dm-now-h" data-iso>
	<div class="dm-iso-stage">
		<canvas class="dm-fx dm-iso-canvas" data-fx="iso-hall" data-progress="#now" aria-hidden="true"></canvas>

		<div class="dm-wrap dm-iso-head">
			<div class="dm-iso-heading">
				<h2 class="dm-iso-title" id="dm-now-h">Now running</h2>
				<ol class="dm-iso-tabs" aria-label="Stations">
					<li><button class="dm-iso-tab" type="button" data-iso-go="0">Impeccable</button></li>
					<li><button class="dm-iso-tab" type="button" data-iso-go="1">Radiant</button></li>
					<li><button class="dm-iso-tab" type="button" data-iso-go="2">agent-reviews</button></li>
					<li><button class="dm-iso-tab" type="button" data-iso-go="3">burn-after-login</button></li>
				</ol>
			</div>
			<a class="dm-link" href="/projects/">All projects <svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2" y="7" width="8" height="2"/><rect x="10" y="4" width="1" height="8"/><rect x="11" y="5" width="1" height="6"/><rect x="12" y="6" width="1" height="4"/><rect x="13" y="7" width="1" height="2"/></svg></a>
		</div>

		<div class="dm-iso-panel">
			<article class="dm-iso-prod is-current" data-station="0" aria-labelledby="dm-prod-impeccable">
				<p class="dm-iso-marquee" aria-hidden="true"><span>Impeccable</span></p>
				<div class="dm-iso-screen" style="--st: #0cf"><canvas class="dm-fx" data-fx="iso-monitor" data-prod="glenz-slash" aria-hidden="true"></canvas></div>
				<h3 class="dm-iso-name" id="dm-prod-impeccable"><svg class="dm-project-icon" viewBox="0 0 16 16" aria-hidden="true" shape-rendering="crispEdges"><rect width="16" height="16" fill="#111"/><rect x="9" y="3" width="2" height="3" fill="#eee"/><rect x="8" y="6" width="2" height="3" fill="#eee"/><rect x="7" y="9" width="2" height="3" fill="#eee"/><rect x="6" y="12" width="2" height="1" fill="#eee"/></svg>
<a href="https://impeccable.style" target="_blank" rel="noopener">Impeccable</a></h3>
				<p class="dm-iso-text">Impeccable teaches AI coding tools design: a shared design vocabulary, persistent project context, and quality checks that run inside your codebase. It started as an open source skill and is now the first product of Renaissance Geek, my new company backed by a16z.</p>
				<ul class="dm-meta dm-iso-links">
					<li><a class="dm-link" href="https://impeccable.style" target="_blank" rel="noopener">Website</a></li>
					<li><a class="dm-link" href="https://github.com/pbakaus/impeccable" target="_blank" rel="noopener">GitHub</a></li>
					<li><a class="dm-link" href="https://www.a16z.news/p/impeccable-by-design" target="_blank" rel="noopener">a16z announcement</a></li>
					<li class="dm-iso-stat">40k+ stars</li>
				</ul>
			</article>

			<article class="dm-iso-prod" data-station="1" aria-labelledby="dm-prod-radiant">
				<p class="dm-iso-marquee" aria-hidden="true"><span>Radiant</span></p>
				<div class="dm-iso-screen" style="--st: #f80"><canvas class="dm-fx" data-fx="iso-monitor" data-prod="plasma-star" aria-hidden="true"></canvas></div>
				<h3 class="dm-iso-name" id="dm-prod-radiant"><svg class="dm-project-icon" viewBox="0 0 16 16" aria-hidden="true" shape-rendering="crispEdges"><rect width="16" height="16" fill="#111"/><rect x="7" y="2" width="2" height="12" fill="#c96"/><rect x="2" y="7" width="12" height="2" fill="#c96"/><rect x="6" y="5" width="4" height="6" fill="#c96"/><rect x="5" y="6" width="6" height="4" fill="#c96"/></svg>
<a href="https://radiant-shaders.com" target="_blank" rel="noopener">Radiant</a></h3>
				<p class="dm-iso-text">Radiant is a collection of 80+ production-ready WebGL shaders you can preview, customize, and drop into any web project. Zero dependencies, MIT licensed, works with any framework.</p>
				<ul class="dm-meta dm-iso-links">
					<li><a class="dm-link" href="https://radiant-shaders.com" target="_blank" rel="noopener">Website</a></li>
					<li><a class="dm-link" href="https://github.com/pbakaus/radiant" target="_blank" rel="noopener">GitHub</a></li>
					<li class="dm-iso-stat">Open source</li>
				</ul>
			</article>

			<article class="dm-iso-prod" data-station="2" aria-labelledby="dm-prod-ar">
				<p class="dm-iso-marquee" aria-hidden="true"><span>agent-reviews</span></p>
				<div class="dm-iso-screen" style="--st: #8f0"><canvas class="dm-fx" data-fx="iso-monitor" data-prod="diffrain" aria-hidden="true"></canvas></div>
				<h3 class="dm-iso-name" id="dm-prod-ar"><svg class="dm-project-icon" viewBox="0 0 16 16" aria-hidden="true" shape-rendering="crispEdges"><rect width="16" height="16" fill="#d42"/><g fill="#fff"><rect x="4" y="7" width="3" height="1"/><rect x="6" y="8" width="1" height="4"/><rect x="4" y="9" width="2" height="1"/><rect x="3" y="10" width="1" height="1"/><rect x="4" y="11" width="2" height="1"/><rect x="9" y="7" width="1" height="5"/><rect x="10" y="8" width="1" height="1"/><rect x="11" y="7" width="2" height="1"/></g></svg>
<a href="https://agent-reviews.com" target="_blank" rel="noopener">agent-reviews</a></h3>
				<p class="dm-iso-text">Token-efficient, automated GitHub review workflows and bug fixing that understand your codebase.</p>
				<ul class="dm-meta dm-iso-links">
					<li><a class="dm-link" href="https://agent-reviews.com" target="_blank" rel="noopener">Website</a></li>
					<li><a class="dm-link" href="https://github.com/pbakaus/agent-reviews" target="_blank" rel="noopener">GitHub</a></li>
				</ul>
			</article>

			<article class="dm-iso-prod" data-station="3" aria-labelledby="dm-prod-bal">
				<p class="dm-iso-marquee" aria-hidden="true"><span>burn-after-login</span></p>
				<div class="dm-iso-screen" style="--st: #f60"><canvas class="dm-fx" data-fx="iso-monitor" data-prod="fire-lock" aria-hidden="true"></canvas></div>
				<h3 class="dm-iso-name" id="dm-prod-bal"><svg class="dm-project-icon" viewBox="0 0 16 16" aria-hidden="true" shape-rendering="crispEdges"><rect width="16" height="16" fill="#b22"/><g fill="#fff"><rect x="6" y="3" width="4" height="1"/><rect x="5" y="4" width="1" height="4"/><rect x="10" y="4" width="1" height="4"/><rect x="4" y="8" width="8" height="6"/></g><rect x="7" y="10" width="2" height="3" fill="#b22"/><rect x="8" y="9" width="1" height="1" fill="#b22"/></svg>
<a href="https://burn-after-login.paulbakaus.com" target="_blank" rel="noopener">burn-after-login</a></h3>
				<p class="dm-iso-text">Solves authentication for AI browser agents. Analyzes your auth, creates dev-only login shortcuts, then self-destructs.</p>
				<ul class="dm-meta dm-iso-links">
					<li><a class="dm-link" href="https://burn-after-login.paulbakaus.com" target="_blank" rel="noopener">Website</a></li>
					<li><a class="dm-link" href="https://github.com/pbakaus/burn-after-login" target="_blank" rel="noopener">GitHub</a></li>
				</ul>
			</article>
		</div>
	</div>
</section>

<section class="dm-shelf-sec" aria-labelledby="dm-writing-h" data-shelf>
	<div class="dm-seam" data-wipe aria-hidden="true"></div>
	<div class="dm-shelf-stage">
		<canvas class="dm-fx dm-shelf-bg" data-fx="shelf" aria-hidden="true"></canvas>
		<div class="dm-wrap dm-shelf-head">
			<h2 class="dm-h2" id="dm-writing-h">Writing</h2>
			<a class="dm-link" href="/writing/">All writing <svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2" y="7" width="8" height="2"/><rect x="10" y="4" width="1" height="8"/><rect x="11" y="5" width="1" height="6"/><rect x="12" y="6" width="1" height="4"/><rect x="13" y="7" width="1" height="2"/></svg></a>
		</div>
		<div class="dm-shelf-viewport" data-shelf-viewport>
			<ol class="dm-shelf-track" data-shelf-track>
				<li class="dm-disk-item" data-year="2026">
	<a class="dm-disk" href="/i-gave-my-website-a-boss-fight/">
		<span class="dm-disk-body" aria-hidden="true">
			<span class="dm-disk-shutter"><i></i></span>
			<span class="dm-disk-hole dm-disk-hole--wp"></span>
			<span class="dm-disk-hole dm-disk-hole--hd"></span>
		</span>
		<span class="dm-disk-label">
			<span class="dm-disk-title">I gave my website a boss fight</span>
			<span class="dm-disk-meta"><time datetime="2026-09-22">Sep 22, 2026</time><span>11 min</span></span>
		</span>
	</a>
</li>
				<li class="dm-disk-item" data-year="2026">
	<a class="dm-disk" href="/impeccable-by-design/">
		<span class="dm-disk-body" aria-hidden="true">
			<span class="dm-disk-shutter"><i></i></span>
			<span class="dm-disk-hole dm-disk-hole--wp"></span>
			<span class="dm-disk-hole dm-disk-hole--hd"></span>
		</span>
		<span class="dm-disk-label">
			<span class="dm-disk-title">Impeccable by Design</span>
			<span class="dm-disk-meta"><time datetime="2026-07-02">Jul 2, 2026</time><span>8 min</span></span>
		</span>
	</a>
</li>
				<li class="dm-disk-item" data-year="2026">
	<a class="dm-disk" href="/carving-shaders-out-of-claude-code/">
		<span class="dm-disk-body" aria-hidden="true">
			<span class="dm-disk-shutter"><i></i></span>
			<span class="dm-disk-hole dm-disk-hole--wp"></span>
			<span class="dm-disk-hole dm-disk-hole--hd"></span>
		</span>
		<span class="dm-disk-label">
			<span class="dm-disk-title">Carving Shaders Out of Claude Code</span>
			<span class="dm-disk-meta"><time datetime="2026-03-26">Mar 26, 2026</time><span>5 min</span></span>
		</span>
	</a>
</li>
				<li class="dm-disk-item" data-year="2025">
	<a class="dm-disk" href="/the-curse-of-cursor-for-x/">
		<span class="dm-disk-body" aria-hidden="true">
			<span class="dm-disk-shutter"><i></i></span>
			<span class="dm-disk-hole dm-disk-hole--wp"></span>
			<span class="dm-disk-hole dm-disk-hole--hd"></span>
		</span>
		<span class="dm-disk-label">
			<span class="dm-disk-title">The Curse of &#x27;Cursor for X&#x27;</span>
			<span class="dm-disk-meta"><time datetime="2025-11-27">Nov 27, 2025</time><span>4 min</span></span>
		</span>
	</a>
</li>
				<li class="dm-disk-item" data-year="2025">
	<a class="dm-disk" href="/fans-vs-nofans/">
		<span class="dm-disk-body" aria-hidden="true">
			<span class="dm-disk-shutter"><i></i></span>
			<span class="dm-disk-hole dm-disk-hole--wp"></span>
			<span class="dm-disk-hole dm-disk-hole--hd"></span>
		</span>
		<span class="dm-disk-label">
			<span class="dm-disk-title">Why certain creators have fans and others don&#x27;t</span>
			<span class="dm-disk-meta"><time datetime="2025-07-03">Jul 3, 2025</time><span>2 min</span></span>
		</span>
	</a>
</li>
				<li class="dm-disk-item dm-disk-item--box">
					<a class="dm-diskbox-link" href="/writing/">
						<span class="dm-diskbox-link-lid" aria-hidden="true"></span>
						<span class="dm-diskbox-link-body">
							<span class="dm-diskbox-link-label">All writing</span>
							<span class="dm-diskbox-link-count">40 disks in the box</span>
						</span>
					</a>
				</li>
			</ol>
		</div>
	</div>
</section>

<section class="dm-road-sec" aria-labelledby="dm-story-h" data-road>
	<div class="dm-seam" data-wipe aria-hidden="true"></div>
	<div class="dm-road-stage">
		<canvas class="dm-road-canvas dm-fx" data-fx="road" aria-hidden="true"></canvas>
		<div class="dm-wrap dm-road-ui">
			<div class="dm-road-intro">
				<h2 class="dm-road-h" id="dm-story-h">The story so far</h2>
				<p class="dm-road-lede">Since 2007 I keep ending up where a new technology has arrived and its tools have not caught up.</p>
				<a class="dm-link" href="/about/">The long version <svg class="dm-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="2" y="7" width="8" height="2"/><rect x="10" y="4" width="1" height="8"/><rect x="11" y="5" width="1" height="6"/><rect x="12" y="6" width="1" height="4"/><rect x="13" y="7" width="1" height="2"/></svg></a>
			</div>
			<div class="dm-road-hud" aria-hidden="true">
				<span class="dm-road-hud-label">Year</span>
				<span class="dm-road-odo" data-road-odo>2007</span>
				<span class="dm-road-now" data-road-now hidden>Now</span>
				<span class="dm-road-hud-label">Stage <b data-road-stage>1</b> of 9</span>
			</div>
			<div class="dm-road-panel" data-road-panel aria-hidden="true">
				<span class="dm-road-panel-name" data-road-name>jQuery UI</span>
				<span class="dm-road-panel-role" data-road-role>Creator</span>
				<p class="dm-road-panel-desc" data-road-desc>The interaction library that brought drag and drop, sortable lists, and date pickers to the web.</p>
			</div>
		</div>
	</div>
	<ol class="dm-road-list" aria-label="Career milestones">
		<li class="dm-road-item" data-year="2007"><span class="dm-road-item-year">2007</span> <b class="dm-road-item-name">jQuery UI</b> <span class="dm-road-item-role">Creator</span> <span class="dm-road-item-desc">The interaction library that brought drag and drop, sortable lists, and date pickers to the web.</span></li>
		<li class="dm-road-item" data-year="2010"><span class="dm-road-item-year">2010</span> <b class="dm-road-item-name">Aves Engine</b> <span class="dm-road-item-role">Co-founder, acquired by Zynga</span> <span class="dm-road-item-desc">One of the first in-browser game engines, and the startup built around it.</span></li>
		<li class="dm-road-item" data-year="2013"><span class="dm-road-item-year">2013</span> <b class="dm-road-item-name">Chrome DevTools</b> <span class="dm-road-item-role">Google</span> <span class="dm-road-item-desc">Product and developer relations for the tools web developers open every day.</span></li>
		<li class="dm-road-item" data-year="2016"><span class="dm-road-item-year">2016</span> <b class="dm-road-item-name">AMP &amp; Web Stories</b> <span class="dm-road-item-role">Google</span> <span class="dm-road-item-desc">Kickstarted developer relations for AMP, then evolved it into visual storytelling for the open web.</span></li>
		<li class="dm-road-item" data-year="2019"><span class="dm-road-item-year">2019</span> <b class="dm-road-item-name">Google for Creators</b> <span class="dm-road-item-role">Founder, Head of Creator Relations</span> <span class="dm-road-item-desc">Started the sister organization to DevRel, focused on creators across the web.</span></li>
		<li class="dm-road-item" data-year="2021"><span class="dm-road-item-year">2021</span> <b class="dm-road-item-name">Koji</b> <span class="dm-road-item-role">Head of Creators</span> <span class="dm-road-item-desc">Helped creators monetize and engage their audiences in new ways.</span></li>
		<li class="dm-road-item" data-year="2022"><span class="dm-road-item-year">2022</span> <b class="dm-road-item-name">Spotter</b> <span class="dm-road-item-role">EVP Product</span> <span class="dm-road-item-desc">Built AI tools for YouTube creators at scale.</span></li>
		<li class="dm-road-item" data-year="2024"><span class="dm-road-item-year">2024</span> <b class="dm-road-item-name">Independent</b> <span class="dm-road-item-role">Fractional CPO, advisor</span> <span class="dm-road-item-desc">Open source tools, talks, and writing. One of those tools, Impeccable, grew into a company.</span></li>
		<li class="dm-road-item" data-year="Now"><span class="dm-road-item-year">Now</span> <b class="dm-road-item-name">Renaissance Geek</b> <span class="dm-road-item-role">Founder</span> <span class="dm-road-item-desc">Building Impeccable. Seed round led by a16z, bundled with the new GitHub Copilot app.</span></li>
	</ol>
</section>

<section class="dm-section dm-home-join" aria-labelledby="dm-join-h">
	<div class="dm-seam" data-wipe aria-hidden="true"></div>
	<div class="dm-wrap dm-join">
		<div>
			<h2 class="dm-h2" id="dm-join-h">Get the next part in your inbox</h2>
			<p class="dm-lede dm-join-lede">Occasional thoughts on AI, creativity, and building things.</p>
		</div>
		<form class="dm-join-form" data-members-form="subscribe" data-members-autoredirect="false">
	<label class="dm-join-label" for="dm-home-email">Email address</label>
	<div class="dm-join-row">
		<input class="dm-field" id="dm-home-email" data-members-email type="email" name="email" placeholder="you@example.com" autocomplete="email" required>
		<button class="dm-gadget dm-gadget--hot" type="submit">Subscribe</button>
	</div>
	<p class="dm-join-alert" role="status">
		<span class="alert-loading">Sending...</span>
		<span class="alert-success">Check your inbox and click the link to confirm your subscription.</span>
		<span class="alert-error">That did not go through. Check the address and try again.</span>
	</p>
</form>
	</div>
</section>

		</main>
		<footer class="dm-footer">
	<div class="dm-strip" aria-hidden="true"></div>
	<div class="dm-footer-scroller" aria-hidden="true">
		<canvas class="dm-fx" data-fx="scroller" data-ramp="ice" data-text="GREETINGS TO EVERYONE WHO SWEATS THE LAST 10 PERCENT  ...  RENAISSANCE GEEK IS HIRING DESIGN ENGINEERS AND DESIGN ADVOCATES  ...  EVERYTHING ON THIS PAGE IS RENDERED LIVE ON YOUR MACHINE  ...  THANKS FOR WATCHING, SEE YOU IN THE NEXT PART  ...  "></canvas>
	</div>
	<div class="dm-wrap dm-footer-inner">
		<section class="dm-join dm-footer-join" aria-labelledby="dm-footer-join-h">
			<div>
				<h2 class="dm-h3" id="dm-footer-join-h">Get the next part in your inbox</h2>
				<p class="dm-lede" style="margin-top:16px">Occasional thoughts on AI, creativity, and building things.</p>
			</div>
			<form class="dm-join-form" data-members-form="subscribe" data-members-autoredirect="false">
	<label class="dm-join-label" for="dm-footer-email">Email address</label>
	<div class="dm-join-row">
		<input class="dm-field" id="dm-footer-email" data-members-email type="email" name="email" placeholder="you@example.com" autocomplete="email" required>
		<button class="dm-gadget dm-gadget--hot" type="submit">Subscribe</button>
	</div>
	<p class="dm-join-alert" role="status">
		<span class="alert-loading">Sending...</span>
		<span class="alert-success">Check your inbox and click the link to confirm your subscription.</span>
		<span class="alert-error">That did not go through. Check the address and try again.</span>
	</p>
</form>
		</section>
		<div class="dm-footer-bottom">
			<canvas class="dm-fx dm-footer-paul" data-fx="paul" data-anim="mini-wave" data-alt="mini-type" aria-hidden="true"></canvas>
			<ul class="dm-footer-links">
				<li><a class="dm-link" href="https://renaissance-geek.ai" target="_blank" rel="noopener">Renaissance Geek</a></li>
				<li><a class="dm-link" href="https://github.com/pbakaus" target="_blank" rel="noopener">GitHub</a></li>
				<li><a class="dm-link" href="https://x.com/pbakaus" target="_blank" rel="noopener">X</a></li>
				<li><a class="dm-link" href="https://linkedin.com/in/paulbakaus" target="_blank" rel="noopener">LinkedIn</a></li>
				<li><a class="dm-link" href="https://instagram.com/paulbakaus" target="_blank" rel="noopener">Instagram</a></li>
				<li><a class="dm-link" href="https://www.paulbakaus.com/writing/rss/">RSS</a></li>
			</ul>
			<p class="dm-footer-legal">&copy; 2026 Paul Bakaus. Drawn live in 4,096 colors, without a framework.</p>
		</div>
	</div>
</footer>
		<div class="dm-nudge" id="dm-nudge" hidden>
	<div class="dm-nudge-scrim" aria-hidden="true"></div>
	<div class="dm-nudge-ring" aria-hidden="true"></div>
	<div class="dm-nudge-call">
		<svg class="dm-nudge-arrow" viewBox="0 0 16 8" shape-rendering="crispEdges" aria-hidden="true"><rect x="7" y="0" width="2" height="1" fill="#fe0"/><rect x="6" y="1" width="4" height="1" fill="#fe0"/><rect x="5" y="2" width="6" height="1" fill="#fe0"/><rect x="4" y="3" width="8" height="1" fill="#f80"/><rect x="3" y="4" width="10" height="1" fill="#f80"/><rect x="2" y="5" width="12" height="1" fill="#f06"/><rect x="1" y="6" width="14" height="1" fill="#f06"/><rect x="0" y="7" width="16" height="1" fill="#f06"/></svg>
		<div class="dm-nudge-plate">
			<div class="dm-nudge-bar">
				<span class="dm-nudge-bar-title" aria-hidden="true">Sound</span>
				<button class="dm-nudge-close" type="button" data-nudge-close aria-label="Dismiss the sound tip"><svg viewBox="0 0 7 7" shape-rendering="crispEdges" aria-hidden="true"><rect x="0" y="0" width="1" height="1"/><rect x="1" y="1" width="1" height="1"/><rect x="2" y="2" width="1" height="1"/><rect x="3" y="3" width="1" height="1"/><rect x="4" y="4" width="1" height="1"/><rect x="5" y="5" width="1" height="1"/><rect x="6" y="6" width="1" height="1"/><rect x="6" y="0" width="1" height="1"/><rect x="5" y="1" width="1" height="1"/><rect x="4" y="2" width="1" height="1"/><rect x="2" y="4" width="1" height="1"/><rect x="1" y="5" width="1" height="1"/><rect x="0" y="6" width="1" height="1"/></svg></button>
			</div>
			<p class="dm-nudge-line" aria-hidden="true">It's better with sound. Trust me!</p>
			<p class="dm-nudge-note" aria-hidden="true"><span class="dm-nudge-keys">Esc or a click anywhere dismisses this.</span><span class="dm-nudge-touch">Tap anywhere to dismiss.</span></p>
		</div>
	</div>
	<p class="sr-only" role="status" data-nudge-say></p>
</div>
		<div class="dm-shutter" aria-hidden="true"></div>
		<div id="notifications" class="global-notification">
	<div class="subscribe">You’ve successfully subscribed to Paul Bakaus</div>
	<div class="signin">Welcome back! You’ve successfully signed in.</div>
	<div class="signup">Great! You’ve successfully signed up.</div>
	<div class="update-email">Success! Your email is updated.</div>
	<div class="expired">Your link has expired</div>
	<div class="checkout-success">Success! Check your email for magic link to sign-in.</div>
</div>
		<script type="application/json" id="pb-bundles">[
			{"name": "article", "src": "/assets/js/demo-article.js?v=jpNu7tafY5dxMuvN", "sel": ["[data-pb-demo]"]},
			{"name": "prods", "src": "/assets/js/demo-fx-prods.js?v=zGMLZYeS58wPsLBg", "fx": ["glenz-slash", "plasma-star", "diffrain", "fire-lock"]},
			{"name": "hero", "src": "/assets/js/demo-fx-hero.js?v=zGGAWePalNKuWGaz", "fx": ["rooftop", "statement-stars"], "deps": ["prods"]},
			{"name": "iso", "src": "/assets/js/demo-fx-iso.js?v=BupIkDmJWW1odiL-", "fx": ["iso-hall", "iso-monitor"], "deps": ["prods"]},
			{"name": "shelf", "src": "/assets/js/demo-fx-shelf.js?v=LcWhvsDTMEV7lxfC", "fx": ["shelf", "dusk", "archive-wall"], "sel": ["[data-shelf]", "[data-disk-years]"]},
			{"name": "quest", "src": "/assets/js/demo-fx-quest.js?v=MNyt-bqePghwAe2E", "fx": ["disk-quest"]},
			{"name": "quest-play", "src": "/assets/js/demo-quest-play.js?v=4hCYetHyrg8QnYxh", "deps": ["quest"]},
			{"name": "road", "src": "/assets/js/demo-fx-road.js?v=FZUwh4G7xlPuoGar", "fx": ["road"]},
			{"name": "mission", "src": "/assets/js/demo-fx-mission.js?v=mAdRWEsn4CIAlcJM", "fx": ["m-chatmorph", "m-bobs", "m-wall", "m-mixtape", "m-lanes", "m-glenz", "m-extract"]},
			{"name": "battle", "src": "/assets/js/demo-mission-battle.js?v=CPjhYjkhyPo807Vd", "deps": ["shelf"]},
			{"name": "voyage", "src": "/assets/js/demo-fx-voyage.js?v=rb1n16D_GgDwOJTI", "fx": ["voyage"], "deps": ["prods"]},
			{"name": "speaking", "src": "/assets/js/demo-fx-speaking.js?v=hrtcW0gumBSDfXM1", "fx": ["venue"]},
			{"name": "keynote", "src": "/assets/js/demo-keynote.js?v=TLbG7uU_rEC_dOtt", "deps": ["speaking"]},
			{"name": "studio", "src": "/assets/js/demo-studio.js?v=nRo-GOftQwBbt2zL"},
			{"name": "hum", "src": "/assets/js/demo-hum.js?v=4FI2roRBOD1r6Lmd", "deps": ["studio"]},
			{"name": "tune-crown-of-dusk", "src": "/assets/js/tunes/crown-of-dusk.js?v=eme3VeqjbfJWDPD_"},
			{"name": "tune-glasswater-hours", "src": "/assets/js/tunes/glasswater-hours.js?v=UTOEoBux7_t76TFA"},
			{"name": "tune-cinder-pursuit", "src": "/assets/js/tunes/cinder-pursuit.js?v=CJOOC8_81rwYNbWq"},
			{"name": "tune-lantern-shoal", "src": "/assets/js/tunes/lantern-shoal.js?v=wJSx9wTvPFPE8dUJ"},
			{"name": "tune-moss-pillars", "src": "/assets/js/tunes/moss-pillars.js?v=BiOSX9P8YHNBJj-r"},
			{"name": "tune-moss-bell", "src": "/assets/js/tunes/moss-bell.js?v=YmTkPW97d6CV2_Bw"},
			{"name": "tune-copper-boulevard", "src": "/assets/js/tunes/copper-boulevard.js?v=dQYIFfdl7LB5bn5B"},
			{"name": "tune-tangerine-overpass", "src": "/assets/js/tunes/tangerine-overpass.js?v=3yfS8Vl0Zq0xoK5i"},
			{"name": "tune-spindle-of-aeons", "src": "/assets/js/tunes/spindle-of-aeons.js?v=i1Ukq-4oC57CokXW"}
		]</script>
		<script src="/assets/js/demo-core.js?v=Q4ii2lMfA1pIv3KL"></script>
		<script src="/assets/js/demo-audio.js?v=MUcBP6KfcBb0g2fq"></script>
		<script src="/assets/js/demo-sprites.js?v=a5EZThBs2Z8TUxXI"></script>
		<script src="/assets/js/demo-sfx.js?v=ZO-OAMifCA9GM4sh"></script>
		<script src="/assets/js/demo-fx.js?v=n5d_GCDgb0qmM1-8"></script>
		<script src="/assets/js/demo-boot.js?v=4PZeOG2lDCC2_M3-"></script>
		<script>
!function(){"use strict";const p=new URLSearchParams(window.location.search),isAction=p.has("action"),isStripe=p.has("stripe"),success=p.get("success"),action=p.get("action"),stripe=p.get("stripe"),n=document.getElementById("notifications"),a="is-subscribe",b="is-signin",c="is-signup",f="is-update-email",d="is-expired",e="is-checkout-success";p&&(isAction&&(action=="subscribe"&&success=="true"&&n.classList.add(a),action=="signup-paid"&&success=="true"&&n.classList.add(a),action=="signin"&&success=="true"&&n.classList.add(b),action=="signup"&&success=="true"&&n.classList.add(c),action=="updateEmail"&&success=="true"&&n.classList.add(f),success=="false"&&n.classList.add(d)),isStripe&&stripe=="success"&&n.classList.add(e),(isAction||isStripe)&&setTimeout(function(){window.history.replaceState(null,null,window.location.pathname),n.classList.remove(a,b,c,d,e,f)},5000))}();
</script>

		
	</body>
</html>
