Work · Stratefuse · Client website, 2026

I built the new stratefuse.com in 24 hours, alone with AI

Stratefuse, a RevOps consultancy, had built its own six-page site. I took it over on October 8, started building right after the kickoff meeting and finished in a day, every layer myself with AI. The new stratefuse.com launched on October 12.

See how the 24 hours went ↓ Visit stratefuse.com →

24 hoursfrom the kickoff meeting to a finished build

24/24Lighthouse scores at 100 on the launch build, six pages on mobile and desktop

13+illustrations drawn in code, no Lottie or video

Build logone person, every layer Oct 8 → Oct 12

Sitemap and page hierarchy6 pages + 404

Visual system and page buildno framework

Illustrations drawn in code13+

Copy, technical SEO, AEOJSON-LD on every page

HubSpot form, DNS cutover, handoff0 email downtime

24/24 every Lighthouse score at 100 on the launch build

{ "pages": 6, "lighthouse": "24/24",
"illustrations": "13+" }

Before

Two versions in, the site still fell short

Stratefuse had built a six-page static site on its own and written a memo on how the site should work. I reworked the visuals in a second version, and the client turned it down. I scrapped it and started over.

I kept one thing from the first version, the content hierarchy. Everything that sits on top of it I redesigned in the style of B2B software companies such as Brex and Ramp.

V1 was the client's own build. Six static pages and a memo describing what the site had to do.
V2 was my first visual rework. The client turned it down, so I scrapped it.
V3 is what I shipped. A new visual system, coded illustrations, new copy and a new stack, built around the original hierarchy.

The build

Seven layers, from sitemap to handoff

I used AI as my build team and made every call myself. The seven layers below are the whole job, start to finish. Each one ends with a figure you can check on the live site.

Layer 1 · Structure and design

A sitemap, a hierarchy and a visual system

I wrote the sitemap and the page hierarchy for Home, Services, AI and integrations, About, Contact and Privacy, plus a 404. Then I designed the visual system and built every page in plain HTML, CSS and JavaScript, with no framework. A Python generator builds the pages from source files and stamps each asset with a content hash, so visitors never get a stale cached file.

6 pages + 404 · plain HTML, CSS, JS · content-hashed assets

Full-page screenshot of the stratefuse.com home page on desktop, from the hero illustration down to the footer — The home page at 1440 px, top to bottom.

The stratefuse.com home page on a 375 px phone screen, with the illustration redrawn for a narrow layout — The same page on a phone. Most illustrations have their own narrow layout.

Layer 2 · Animated illustrations

13+ product illustrations, drawn in code

Every illustration on the site is inline SVG with CSS and a small amount of plain JavaScript. There is no Lottie file and no video behind any of them. Each one plays once when it scrolls into view, and only one plays per screen. The final frame is written into the SVG, so a visitor with reduced motion turned on sees the finished picture at once.

I turned the method into a reusable skill called animated-svg-illustrations. It is a written process for AI coding assistants, so the next project can follow it and produce the same kind of illustration.

The hover videos follow the same discipline. WebM loads first with MP4 as the fallback, nothing preloads, and touch screens play on tap. I wrote a small server function so Safari can play them too.

13+ illustrations · SVG + CSS + plain JS · no Lottie, no video

Animated illustration of a dashboard chart above a detailed report, where one highlighted bar turns blue and links to the matching column in the report below — Drawn in SVG and CSS. On stratefuse.com it plays once and holds the final frame. The loop here is a recording.

Animated illustration of a field-mapping document, with arrows lighting up from each old field to its new one and two rows flagged for review — A field-mapping document, drawn in code. Old fields point to new ones, and two rows get flagged.

Animated illustration of a CRM panel connected to three AI tools and one custom API, with each line turning blue once the data is ready — Three AI connections and one API, lit one at a time.

Layer 3 · Copy

Copy I wrote, then stress-tested

I wrote every line on the site. Then it went through a four-part check for AI-sounding prose, a read from a prospective buyer's side, a logic pass and a concision pass. Gemini and ChatGPT each reviewed it as well.

The copy sticks to facts and names no prices, no clients and no people. It is written in Canadian English, and the whole site carries one call to action, Book a call.

1 call to action across the site · Book a call

The Services page hero, with its headline on the left and six service panels linked to a central hub on the right — Services opens with all six offers tied to one hub.

Layer 4 · Technical SEO and AEO

Built to be found by search engines and AI answers

Every page carries JSON-LD, Open Graph and Twitter cards. I added a sitemap that keeps its own lastmod dates, hreflang tags and an llms.txt that gives AI systems a plain summary of the firm. The robots file changes with the domain, so the staging copy stays out of search. I set the AI crawler policy and the HSTS and CSP security headers in the same pass.

JSON-LD, OG and Twitter cards on all 6 pages · sitemap · llms.txt · per-domain robots

The AI and integrations page hero on a dark background, with a diagram of three AI tools and one custom API connected to a CRM below it — The AI and integrations page.

Layer 5 · Speed

All 24 Lighthouse scores at 100 on the launch build

I measured my V3 build before and after a performance pass, on six pages, mobile and desktop, three runs each, median. Before the pass, About scored 97 on mobile and the AI page scored 96 on accessibility. After it, all 24 scores on the launch build read 100. Across the pass, mobile LCP dropped from 1.39–2.04 s to 1.32–1.40 s, and desktop LCP from 0.28–0.54 s to 0.06–0.08 s.

First loads got lighter too. The home page went from 374 KiB to 242 KiB and Services from 582 KiB to 208 KiB. I self-hosted the fonts, so no third-party scripts or fonts of my own load on the site. The one outside request is Cloudflare's analytics. I also tested preloading the fonts and dropped the idea, because it made the first paint on mobile 0.2 to 0.3 s slower.

24/24 at 100 on the launch build · CLS ≤ 0.043 · TBT 0 ms

Lighthouse results for stratefuse.com showing 100 for Performance, Accessibility, Best Practices and SEO — 100 on all four categories on the launch build. Across six pages on mobile and desktop, that is 24 out of 24.

Layer 6 · Form and CRM

A HubSpot form that loads like the rest of the page

I built the contact form myself and kept HubSpot's embed off the site. Each submission passes a Cloudflare Turnstile check. A server function then validates every field against an allowlist and forwards it to the HubSpot Forms API. The form keeps the site's styling and speed, and a thank-you panel replaces it on success.

0 iframes · server-side validation · HubSpot Forms API

One submissionfrom the page to HubSpotno embed

01 Form on the pagesite styling

✓Turnstile check

✓Server-side validation

02 HubSpot Forms APIallowlisted fields

03 Thank-you panelreplaces the form

Layer 7 · Launch and handoff

A domain cutover with zero email downtime

I moved the domain's DNS from GoDaddy to Cloudflare. Before the switch I compared every Google Workspace mail record one by one, and email kept flowing the whole time. The site runs on Cloudflare Pages, with www and http both redirecting to the root domain. Then I handed the code over to the client's private GitHub repository with an English README.

0 email downtime · 301 to the root domain · code in the client's GitHub

Side-by-side comparison of the six-page site Stratefuse built itself and the redesigned stratefuse.com home page — Left, the site Stratefuse built itself. Right, the version I shipped.

Result

Built in 24 hours, with 24/24 Lighthouse on the launch build

Speed figures compare my own V3 build before and after my performance pass. Lighthouse 13.5, three runs per page and device, median of each.

What shipped

Six pages and a 404 · 13+ illustrations drawn in code · JSON-LD, sitemap, llms.txt and per-domain robots · a contact form wired to HubSpot · a DNS cutover with zero email downtime · the full codebase in the client's GitHub.

What I didn't own

Hosting runs on the client's own Cloudflare account. The photos and videos come from Unsplash and Pexels, and third-party logos belong to their brands. The content hierarchy is the one Stratefuse set in its first version. I kept it and rebuilt everything around it.