Skip to content
at_.DEVELOPMENT

guys.sh

A landing page and early-access funnel for hire-a-guy AI agents — nothing to compile, nothing pulled from a third-party service that could go down and take the page with it.

REACTBABELVANILLA JS
guys.sh — hero screenshot
0
STEPS TO BUILD BEFORE DEPLOYING
0
OUTSIDE SERVICES THE PAGE DEPENDS ON
12
AGENTS ON THE ROSTER
3
VISITOR ACTIONS TRACKED
01 — THE PROBLEM

A landing page that anyone can deploy, and nothing else can break

guys.sh sells a simple pitch — “little guys. Massively Productive.” — twelve single-purpose AI agents, each doing exactly one job, presented as pixel-art trading cards with stats. It’s a landing page and early-access sign-up flow, not a shipped product with users yet, so the brief was the opposite of a typical marketing site: something a non-technical operator could put on any host with no build process first, and nothing quietly depending on an outside service that might go down and take the page with it.

02 — ARCHITECTURE

Nothing to compile, by design

The repo root deploys as-is to any static host. There’s no bundler in the critical path: React 18.3.1, ReactDOM 18.3.1 and Babel 7.29 are pinned and served locally from vendor/, so the page has zero third-party runtime dependency at request time. Page sections live as *.jsx.ref files, transpiled by Babel directly in the browser. Deploy target is Vercel today, but Netlify or Cloudflare Pages would work identically — there’s nothing for any of them to build.

The one file anyone needs to touch before launch is config.js, which holds CAPTURE_ENDPOINT. Any endpoint that accepts a JSON POST works — Formspree’s free tier is the documented default. Until that value is set, submissions fail with an in-idiom error message and a console warning fires at load, so a half-configured deploy is loud instead of silently dropping leads.

A sign-up flow that’s tested on its own, independent of the page

The “Get a Guy” wizard — the multi-step flow where a visitor picks agents, tools and a contact method — has its state and payload contract pulled out into wizard-model.js, which has no DOM and no React dependency. That means the core logic is unit-testable in plain Node, backed by a Playwright script for real browser verification. The documented capture payload is:

  {
  email, guys[], custom_guy, custom_guy_description,
  tools[], removed_tools[],
  source, ts, referrer, page,
  utm_source, utm_medium, utm_campaign
}

guys are the picked agent ids, tools are the integrations explicitly linked to the request, and removed_tools records tools the wizard auto-suggested that the visitor then removed — useful signal that gets thrown away by most funnel forms.

guys.sh Get a Guy early-access wizard for picking agents, tools, and a contact method.
wizard-model.js drives this flow with no DOM and no React dependency, which is what makes the state machine unit-testable in plain Node.
03 — INTERACTION DESIGN

Cards that respect how you’re pointing

Each trading card responds to hover with a tilt and a holo glint — but only on fine pointers, so it never fights a touchscreen. Click, Enter or Space flips the card to its back; under prefers-reduced-motion the flip becomes a crossfade instead of a 3D rotation; tilt is disabled outright on touch, where a tap simply flips. “Hire him” on a flipped card adds that agent to the Get-a-Guy group and scrolls the page there. That’s a small set of decisions, but they’re the ones a lot of card-interaction demos skip, and they’re the difference between a gimmick and something that’s actually pleasant to use on a phone.

guys.sh roster grid: pixel-art trading cards for twelve agents grouped into growth, support, engineering, and operations columns, each showing status, price, and traits.
Card numbering runs no.01/12 across four categories. Hover tilt and holo glint only fire on fine pointers, exactly like the flip interaction described below.
guys.sh replay stage showing a sprite selector on the left and a typed step-by-step replay of Social Guy processing an overnight mentions job on the right.
The same reduced-motion-aware interaction model as the cards, applied to a full task replay instead of a flip.
01
Analytics that debug locally
Three tagged custom events — hire_click, hire_submit, replay_select — route through Vercel Web Analytics (with Plausible/PostHog auto-detected if present), and every event mirrors to window.__guysEvents so the funnel is inspectable from the console with no dashboard login.
02
SEO shipped in the repo, not bolted on after
robots.txt and sitemap.xml ship alongside the code; og.png is generated reproducibly by node og/render-og.mjs (Playwright + Chromium) from a source page in og/, so the social preview image is a build artifact, not a hand-exported PNG that drifts out of date.
03
A 404 with a sense of humor
"We don’t have a guy for that. Yet." — in keeping with a site that otherwise takes its engineering more seriously than its copy.
04 — RESULTS

What’s actually true today, stated plainly

guys.sh is a launch site, not yet a business with revenue or customers to report — so what follows is about what was built, not what it’s earned. The live page has no build step and no outside runtime dependency to fail. The sign-up flow’s logic is tested on its own, separate from the page it runs on. The card interaction works whether someone’s using a mouse, a touchscreen, or has motion sensitivity settings turned on. And swapping where sign-up submissions go is a one-line change, documented well enough that it doesn’t require reading the code first.

0
BUILD TOOLING REQUIRED
the code deploys as-is to any static host
Node
CORE LOGIC TESTED ON ITS OWN
the sign-up flow logic is tested separately from the page it runs on
3
ACTIONS TRACKED
clicking hire, submitting a request, viewing a replay — visible in the browser console, no dashboard login needed

Let's Build Something Cool._

Have a project, a fractional need, or just want to say hi? I read every message myself.