Build artifact
The original prompt
Verbatim, including every constraint, citation demand, and tiny threat aimed at generic AI output.
MISSION
Take me from this empty directory to a fully live website at
https://test.distilledai.org. Work autonomously — do not stop or ask me anything
until `curl -sI https://test.distilledai.org` returns HTTP 200 and the served HTML
is the finished site, not a Vercel placeholder. Already done for you: the gh
and vercel CLIs are authenticated, and distilledai.org is added to my Vercel
account with nameservers on Vercel DNS. Everything else — code, repo, Vercel
project, deployment — you create from scratch.
WHAT THE SITE IS
DistilledAI.org is the public AI experiment lab of Distilled Science, a
1M-follower science communication brand built on evidence-based myth-busting.
Two parts:
1. HOMEPAGE — "The Lab"
- Striking landing page: short manifesto (science communication × AI,
everything cited, built in public), then an Experiments grid.
- Experiment #001: The Cognitive Bias Playground — live, clickable, hero
placement.
- 2–3 future slots rendered as locked/classified specimen jars
("Experiment #002: [REDACTED]") to create a curiosity gap.
- Footer badge: "This entire site was built from a single prompt to Claude.
Read the prompt →" linking to /prompt, a page displaying this exact prompt
verbatim.
2. THE COGNITIVE BIAS PLAYGROUND (/playground)
Concept: a whimsical mad-science specimen collection. Each cognitive bias is
a specimen in a jar. Visitors run interactive mini-experiments that TRICK
them first, then reveal the bias, explain the mechanism, and add the specimen
to their shelf.
Build these 6 demos, fully polished (trick → gotcha reveal → 2-sentence
mechanism → real citation → specimen collected with a satisfying flourish):
- Anchoring: rigged estimation game (Tversky & Kahneman, 1974)
- Confirmation bias: the Wason 2-4-6 rule-discovery task (Wason, 1960)
- Loss aversion: framed bet choices (Kahneman & Tversky, 1979)
- Framing effect: identical statistic framed positively vs negatively,
visitor randomly assigned one, then shown the other group's choice
- Availability heuristic: guess relative frequencies of causes of death,
then see real data
- Dunning–Kruger: 5-question quiz where the visitor predicts their score
before seeing results (Kruger & Dunning, 1999)
Plus 2+ locked jars ("Specimen not yet captured") for future demos.
GAMIFICATION LAYER — evidence-based, and deliberately META
The site uses gamification psychology ON the visitor and then confesses:
- Endowed progress: collection starts at 1/8 pre-filled — "Curiosity.
You're here, aren't you?" (Nunes & Drèze, 2006)
- Progress bar + specimen shelf using the goal-gradient effect
- Immediate feedback, free choice of demo order (self-determination theory:
competence + autonomy)
- Shareable end card: a "Bias Resistance Score" with a Wordle-style
emoji-grid copy-to-clipboard share text
- THE TWIST: after collecting all 6, a confession modal — "Meta alert: this
site just used 4 documented psychological techniques on YOU while teaching
you about them" — listing each mechanic with its citation. This is the
shareable payoff; make it land.
ACCURACY BAR: every bias explanation and citation must be real and correct.
Use only the classic, verifiable citations listed above. Never fabricate a
reference — this brand's motto is "cite or it didn't happen."
TONE: witty mad-science lab, never condescending. Microcopy matters:
"Specimen acquired!", jars wobble when hovered, the 404 page says "This page
is a false memory."
DESIGN BAR: 1M people will judge whether this looks like generic AI output.
Art-direct it: dark #0B1020 background, teal #18D4D0 as the truth/success
accent, magenta #F72585 for gotcha/tension moments, purple #8E4DFF secondary.
Bold editorial typography, real motion (Framer Motion), custom favicon, and
complete OG/meta tags per page including a proper OG image so shared links
unfurl beautifully. MOBILE-FIRST — 90% of traffic arrives from Instagram and
TikTok link taps.
STACK: Next.js App Router + Tailwind + Framer Motion. Static/SSG, no backend,
no env vars. Progress persists in localStorage.
PIPELINE — verify each step before advancing:
1. Brief plan, then scaffold; production build must pass locally with zero
errors
2. Screenshot key pages at mobile (390px) and desktop widths, critique your
own design honestly, iterate at least twice on the playground
3. git init with meaningful commits throughout; create a public GitHub repo
with gh and push
4. Deploy to production with the Vercel CLI
5. Attach distilledai.org (plus www redirect) to the project and confirm it
resolves
6. Verify live: curl the domain, confirm the real content is served, fetch
and check the OG tags render
7. Final report: live URL, repo URL, elapsed time, and the one thing you'd
improve next