Skip to main content

Project page / this website

Development 2025

This Website

Started in late November 2025 with no coding background. Over 300 hours of directing, reviewing, and shipping. No templates. No page builders. Talk is cheap, and this website was expensive.

What this proves

I can define a standard, direct a technical build, review it critically, and keep pushing until the result is publishable.

AI role

AI wrote the code. I directed the work, tested it, found problems, and decided what was good enough to ship.

Fast proof

Live site, repo, accessibility work, PWA support, and performance checks all exist as direct evidence, not just claims.

Overview

You are looking at it. This site was built with AI writing every line of code. I had no coding background before this project. Not a tutorial. Not a class. Zero.

My job was to direct the build: decide what to make, how it should look and work, review every change, find every problem, and hold the bar on quality. That took over 300 hours starting in late November 2025.

Why This Way

The harder route was the point. Anyone can use a drag-and-drop builder. Building a real site from code, with no background in it, proves something a resume bullet cannot.

  • I chose the stack, the features, the design, and the performance targets before a single prompt was written
  • I tested every change on desktop and mobile and ran Lighthouse and PageSpeed audits throughout
  • When something looked wrong or scored badly, I found it. AI explained what it meant and fixed it.
  • I reviewed and approved every change before it went into the repo

The result is a site I can maintain, explain, and build on. That is not nothing when you started from zero.

What I Directed

01 / Stack

Static HTML, Tailwind CSS, vanilla JavaScript

No React. No Next.js. No build-step pile that breaks in six months. Just files that work in any browser.

02 / Motion

GSAP with ScrollTrigger

Animations were spec'd to support the page rhythm, not pull attention away from the content.

03 / PWA

Offline-ready build

Service worker, manifest, install prompt support, and a setup that still works after the first visit.

04 / Accessibility

WCAG-minded foundation

Semantic HTML, ARIA labels, keyboard handling, screen reader checks, and theme support that holds up.

05 / AI

Savonie on-site chat

Visitors can ask direct questions about the work instead of hunting through the site for a specific detail.

06 / Extras

Achievement system and hidden details

Eight unlockable achievements, easter eggs, and small systems that reward curiosity without turning gimmicky.

The Numbers

300+

Hours directing, reviewing, and shipping

90+

PageSpeed Insights score (best observed)

0

Templates or page builders used

100%

Code I can read, explain, and maintain

Tech Stack

  • Structure: Semantic HTML5
  • Styling: Tailwind CSS with custom theme
  • Interactivity: Vanilla JavaScript (ES6+)
  • Animations: GSAP (GreenSock Animation Platform) 3.12.2 with ScrollTrigger
  • PWA: PWA (progressive web app) service worker, manifest.json, offline caching
  • Accessibility: WCAG (Web Content Accessibility Guidelines) 2.1 AA, ARIA (Accessible Rich Internet Applications), keyboard navigation
  • Analytics: Microsoft Clarity, Google Analytics 4
  • AI: Savonie chat widget integration

What I Learned

  • Starting from zero is an advantage: There were no bad habits to break. Every concept was learned fresh and applied immediately
  • Finding the problem is half the work: I spotted issues visually, through Lighthouse scores, and by testing on real devices. AI fixed them. That split worked.
  • Directing requires specificity: Vague requests produce vague output. Clear requirements with real acceptance criteria produce something worth shipping
  • Shipping is the proof: This site is live, scores 90+ on PageSpeed, passes accessibility audits, and works offline. That is the argument.

How This Was Built

AI wrote every line of code on this site. That is not a shortcut. It is a different kind of work.

  • Spec first: Every feature started with a clear brief - what it does, how it behaves, what done looks like
  • Active review: I tested every change on desktop and mobile. I ran Lighthouse and PageSpeed on every major update. I caught regressions and sent them back.
  • Quality control: When AI produced code that looked wrong, scored badly, or broke something, I found it and flagged it. AI diagnosed and fixed it.
  • No autopilot: Over 300 hours of concentrated work went into this site. The code is AI's. The decisions, the standards, and the outcome are mine.

Talk is cheap, and this website was expensive.

Project Info

Status
Live
Role
Director & Reviewer
Time Invested
Over 300 Hours
Year
2025
Repository
View on GitHub →

Skills Applied

HTML5 CSS3 JavaScript Tailwind CSS GSAP PWA WCAG Web Performance AI Direction

Like what you see?

Reach out if you want to talk about a project or role.

Get in Touch

Related Projects

Hi, maybe I can help? 👋