Case Study

A fully functional AI bro named ChadGPT

I built a satirical AI product — a fully functional chatbot with a landing page polished enough to pass as a real startup.

Role
Everything
Type
Personal project
Stack
Vanilla HTML/CSS/JS, Express, Claude API

See it live

The site is live. Go say hi to Chad — he’ll probably tell you to focus on your lats.

Context

It started with a painfully San Francisco conversation

A vegan dinner with friends turned into a conversation about AI ethics, the promises companies make about their models, and who’s actually being served by all of it. We talked about the history of the Mechanical Turk, the 18th-century chess-playing “automaton” that was actually a person hidden inside a box.

Mechanical Turk diagram

The Mechanical Turk’s history is loaded; Orientalist spectacle, a hidden human being presented as artificial intelligence. Two centuries later, the dynamic rhymes: language models trained on human labor, marketed with the confidence of someone who has never been wrong.

We joked about what the modern Mechanical Turk would look like. Instead of a hidden person, a language model with infinite confidence and zero self-awareness. A bro. The name Mechanical Jerk followed immediately: a Mechanical Turk for the AI age, except instead of hiding a chess master inside a box, we’re hiding a single neuron behind a landing page.

ChadGPT hero section

Inspiration

Every AI company’s landing page, basically

The site mirrors the structure of real AI product pages beat for beat: hero with animated headline, social proof stats, capability cards, testimonials, tiered pricing, enterprise section.

Claude Code homepage
Claude Code homepage.

The Chatbot

If Claude was a gym bro

if (!process.env.ANTHROPIC_API_KEY) {
  return res.status(500).json({
    error: 'ChadGPT is offline. API key not configured. Skill issue on the server side.'
  });
}

ChadGPT is powered by Claude’s API with a system prompt that defines the character: a 24-year-old startup founder / crypto trader / biohacker / dating coach who calls himself a CEO but nobody knows of what. He cites fake statistics. He connects unrelated things (“dating is basically crypto”). He references unnamed podcasts. 1–3 sentences, no formatting, dead serious.

The ChadGPT plan grid
Every surface is in character.

The gym problem

Every conversation led back to leg day

No amount of prompt engineering could keep Chad out of the gym. The ChadGPT persona was designed to be multi-dimensional: crypto trader, hustle influencer, biohacker, dating strategist, podcast brain, car guy — who also works out. In practice, every response collapsed into gym and lifting advice regardless of the topic. Ask about relationships? Protein. Ask about your career? Leg day. Ask about the meaning of life? Creatine.

Bro slang — “king,” “built different,” “no cap,” “skill issue” — is overwhelmingly correlated with gym culture in the training data. The persona triggers the gym prior, and the gym prior wins.

I tried everything. Topic-specific system prompt instructions. Direct prohibition (“Do NOT mention gym”). Few-shot examples. Removing all fitness vocabulary. Reframing the character as “tech startup CEO.” Assistant prefill. Temperature tuning. Upgrading from Haiku to Sonnet to Opus — zero difference. The gym is load-bearing.

The partial fix: per-request topic steers. On each API call, the server randomly appends a directive like “your main topic must be CRYPTO” with an explicit instruction to avoid gym content. It works sometimes.

const steer = `For THIS response: ${lens} ${style} Do NOT default to gym/lifting/protein talk. Keep it SHORT — 4 sentences max.`;

This isn’t a prompt engineering failure. It’s a training data prior, and no amount of instruction-level steering fully overrides it. AI that can’t stop recommending creatine despite explicit instructions to the contrary is funnier than anything I could have written on purpose.


Building It

Keeping it simple

The entire project is vanilla HTML, CSS, and JavaScript with a Node.js/Express backend. This was deliberate — the project didn’t need complexity, and there’s something appropriate about satirizing overengineered AI with the simplest possible tools.

The CSS uses custom properties with an 8px spacing system, responsive breakpoints at 601px and 900px, and hand-written animations for the hero gradient drift, floating embers, typewriter effect, and scrolling ticker. The backend is ~120 lines of Express: static file serving, a single POST endpoint, and in-memory rate limiting. Three npm dependencies total: express, dotenv, and the Anthropic SDK.

Deployed on Railway. The whole thing could be a single HTML file if I didn’t need a server to keep the API key off the client.

Tech stack

Frontend
Vanilla HTML, CSS, JavaScript
Backend
Node.js, Express (~120 lines)
AI
Claude API via Anthropic SDK, custom design skills
Hosting
Railway
Dependencies
express, dotenv, @anthropic-ai/sdk
Reflection

What I took away from this work

This project started as a joke over dinner and turned into a genuine exercise in design, writing, and working with language models. A couple of things stayed with me.

Satire requires more craft, not less. The site has to be indistinguishable from the real thing at the visual and structural level.

Showing what doesn’t work matters. Pretending good prompting solves everything is its own form of AI hype. The gym problem is documented in full in the repo because I couldn't come up with a more appropriate or funnier design problem for this site.

The site is live at mechanicaljerk.ai. The source is on GitHub. Go talk to Chad. He’ll probably tell you to focus on your lats.