AI-Built Web · Websites, Designed With AI
Websites designed with AI, built like software.
Design directions in hours instead of weeks. Real code that you own. A site that can be reshaped as fast as your business changes. You are looking at one.
- Stack
- Astro · Tailwind · Vercel
- Runtime
- static HTML, tiny JS
- This site
- built exactly this way
Interactive
Three directions before lunch
A brief used to buy one mood board and a fortnight of waiting. Now it buys several fully-realised directions on a live URL, and the conversation starts from something real.
The brief
Illustrative client: a small-batch coffee roaster. Sells beans online, runs a tasting room, wants to feel premium without feeling precious. Needs a shop, a story page and a way to book tastings.
Pick a direction
roaster.example
Roasted this week
Coffee that tastes like where it came from.
Single-origin lots, roasted in small batches and posted the same day.
Shop beans Book a tasting
Same brief, same content, same components. Only the design tokens change. That is the point.
AI explores, people decide
Generating a direction is cheap now. Knowing which one is right for a roaster, a law firm or a machine shop is not. That judgement is the job.
Iterate on the real thing
You pick a direction and we refine it in the actual code, on the actual pages. No translation step from a mock-up to a build where the details get lost.
What it buys you
Decisions made on evidence instead of imagination, a build that starts weeks earlier, and a site that already exists by the time most projects sign off a wireframe.
Proof
This site is the demo
blackmesa.live was designed and built the way we are describing: AI-assisted design exploration, a bespoke token system, and every diagram hand-drawn in SVG for the paragraph beside it.
No page builder, no framework runtime shipped to the browser, no template. The whole thing is static HTML with a few kilobytes of TypeScript for reveals, menus and diagrams.
Anything you can see here can be reshaped in an afternoon. That is what a documented design system in real code buys you.
blackmesa.live — build sheet
01frameworkAstro, static HTML at build time 02runtime jsa few KB of TypeScript for reveals, diagrams, menus 03front-end frameworknone, no React/Vue payload shipped 04stylingTailwind with a bespoke token layer (amber, mono, Pirulen) 05diagramshand-written SVG animated with CSS and SMIL 06motionscroll reveals, view transitions, paused when off-screen 07reduced motionrespected via prefers-reduced-motion 08layoutmobile-first, verified at 390px 09blogMDX content collection with a typed schema 10formshosted endpoint, no server to maintain 11hostingVercel, analytics and speed insights on 12headersnosniff, frame-deny, long-cache fonts 13reshape timea section, an afternoon; a page, a day $
Deliverables
What you actually get
A website is the visible part. The list below is the rest of it, and it is all included because a site without it is a liability with a nice hero image.
Code you own
The site lives in your repository from day one. No proprietary builder, no export button that produces something unusable. If we vanished tomorrow, any competent developer could pick it up.
A performance budget
Static HTML, no front-end framework runtime unless a feature genuinely needs one. Pages are light because there is nothing in them that does not earn its place.
SEO and metadata, properly
Canonical URLs, Open Graph, structured titles, a sitemap, sensible headings and real text in the HTML rather than painted into a canvas. Search engines see what visitors see.
Accessibility built in
Keyboard navigation, focus states, contrast that passes, motion that respects the user's system preference, and a skip link. Not an audit afterwards, a property of the build.
Forms and integrations
Contact and booking forms, mailing lists, calendars, payment links, CRM hand-offs. Wired to a hosted endpoint or your own backend, whichever is less to maintain.
Content you can edit
A blog or news section in MDX with a typed schema, or a headless CMS if non-technical staff need a friendly editor. Your choice, made on how you actually work.
Hosting and CI/CD
Vercel by default: every branch gets a preview URL, every merge deploys. Or your own platform if policy demands it. Either way, deploys are boring and repeatable.
Analytics that respect people
Page-level analytics and speed insights without a cookie banner-sized privacy problem. Enough to know what works, not enough to follow anyone around.
A documented design system
Colours, type, spacing, components and the rules for using them, written down. The next change matches the last one, whoever makes it.
The objection
AI-driven does not mean generic
The internet is filling up with sites that were prompted into existence in one go and look it. The difference is not the tool. It is who is holding it, what they ask for, and whether they can tell good from plausible.
$ generic prompt → generic site
$ brief + taste + system → yours
$ brief + taste + system → yours
- 01
Taste is human
The brief, the choices, the 'no, not that' all come from a person who has looked at your business and your competitors. AI produces options quickly; it does not decide.
- 02
AI does the boilerplate
Variants, scaffolding, responsive edge cases, alt text drafts, the fortieth button state. Work that used to eat the budget now takes minutes, so the budget goes on the parts people notice.
- 03
The system is bespoke
Your palette, your type, your motion, your components. Nothing is inherited from a theme marketplace, so nothing looks like the last site you saw.
- 04
Diagrams and copy are written for you
Every diagram on this site was drawn for the sentence next to it. Yours will be too. Stock illustrations of people high-fiving are not on the menu.
- 05
Built by an infrastructure engineer
DNS, TLS, redirects, caching headers, uptime checks and a rollback path are part of the job, not an upsell. Launch day is treated like a production change because it is one.
How it runs
From brief to live in weeks, with a preview URL at every step
- 01
Brief call
day 0
What you sell, who buys it, what the current site fails to do. An hour, not a workshop.
- 02
Directions
day 1–2
Two or three distinct design directions on a live URL. Real pages, real copy, not a PDF.
- 03
Build
week 1–2
The chosen direction becomes a design system and real pages on the real stack, in your repository.
- 04
Review
ongoing
Every change lands on a preview URL. You comment, we adjust, nothing is hidden behind a staging password.
- 05
Launch
launch day
DNS, TLS, redirects from the old site, analytics and uptime checks. Launch is an infrastructure task and we treat it as one.
- 06
Iterate
forever
New page, new offer, new season. Because the site is code with a documented system, changes are quick and consistent.
Questions
Things people ask first
Do I own the site? +
Yes, completely. The code sits in a repository you control, the domain stays in your name, and the hosting account is yours. We can maintain it for you or hand it over entirely.
Can I edit content myself? +
Yes. For most sites a Markdown-based blog and a few content files are enough, and we will show you how. If several people need to edit without touching code, we wire in a headless CMS with a proper editor.
Can you redesign my existing site instead of starting over? +
Usually that is the better option. We keep your URLs (or redirect them properly), keep what works, and rebuild the rest on the new system. Nothing is lost from search rankings by accident.
What about e-commerce or bookings? +
For a modest catalogue or a booking flow we integrate a hosted service rather than building a shop from scratch, which keeps payments and PCI concerns with a specialist. Larger catalogues get a proper commerce platform behind a custom front end.
Will it look like every other AI-generated site? +
No. Generic output comes from generic briefs and no taste. We start from your brand and your customers, produce distinct directions, and a human picks and refines. The switcher above is the same content in three genuinely different identities.
Who handles hosting, domains and email? +
We do, or we set it up and document it for you. DNS, TLS, redirects, caching and monitoring are infrastructure tasks and that is the rest of what Black Mesa does all day.
Next step
Send us your current site. We'll tell you what we'd change.
A short, honest look at what is holding it back and what a rebuild would involve. No pitch deck attached.