Projects

A full-scale SaaS platform for collecting, hosting, and automating HTML forms. I own the entire stack - from the Nuxt frontend and Express API to the database design, delivery pipeline, and containerised deployment infrastructure.

  • -Two ways to collect: drop a key into your own HTML and point it at the API, or build and host a form directly in the visual editor - both flow through one submission pipeline, with copy-paste snippets for HTML, HTMX, JS, React, Vue, and React Native.
  • -Conversational AI form builder powered by GPT-4o mini that translates raw project goals or themes into fully structured forms - automatically generating fields, validation rules, and nested conditional sections through natural dialogue with real-time streaming previews.
  • -Visual form builder with a live split-pane preview and 8+ field types - as-you-type client-side validation backed by server-side re-validation, plus conditional show/hide logic spanning nested groups and AND/OR rules across nine operators.
  • -Submissions fan out to any mix of destinations - Email, Discord, Slack, Telegram, Notion, Google Sheets, ntfy, and custom webhooks - and are only ever persisted when storage is explicitly enabled or a delivery fails, so nothing is retained by default.
  • -Security-first architecture: field-level encryption at rest with versioned keys for rotation, short-lived JWT access tokens with revocable HttpOnly refresh cookies, ReDoS-safe regex validation, and Cloudflare Turnstile bot protection.
  • -Infrastructure-as-code with fully containerised services (PostgreSQL, Redis, Nginx, ntfy) and automated, version-controlled database migrations via node-pg-migrate.
  • -Polished builder UX with multi-step undo/redo history, interactive guided tutorials, and one-click email unsubscribing.
NuxtTypeScriptExpressPostgreSQLRedisDockerOpenAI
01

A pass-and-play pub party game, live on Google Play. Built in Vue and shipped through Capacitor, it turns photos of your mates into animated characters and runs entirely on the device.

  • -MediaPipe Face Mesh crops photos and calibrates mouth anchors, turning headshots into avatars that blink and react to play.
  • -Three modes: The Reveal (card-flip chance), Tap Duel (1v1 reflex masher) and Pub Court (the table votes on who is guilty).
  • -In-app Canvas touch-up tool for refining cutouts: paint and erase, brush sizing, zoom/pan and multi-step undo.
  • -The Reveal builds to a head-to-head: at two cards left the table clears, the music fades to a heartbeat and the screen dims.
  • -Native haptics and camera via Capacitor. Fully offline: no backend, no accounts, and photos never leave the phone.
TypeScriptVueCapacitorMediaPipePlaywrightPiniaTailwindGSAP
02

Full website build for a private nursery group with four settings across Hampshire. Covers everything from location info and fees to safeguarding policies and parent resources.

  • -Dynamic day-to-night hero sky with gradient keyframes driven by real London sunrise/sunset curves - particles shift colour and opacity with the hour.
  • -Four squirrel characters with autonomous eye tracking: irises wander to random targets every 1–3 seconds, with staggered blink states and SVG clip-path lids for naturalistic motion.
  • -Layered parallax on scroll with four depth planes - convincing 3D perspective without WebGL.
  • -Statically generated with Nuxt across 17 prerendered routes, with Lenis smooth scrolling and scroll-triggered GSAP entrance animations throughout.
TypeScriptNuxtVueTailwindGSAP
03

Lead generation site for a UK financial protection advisory service, helping families find life insurance, critical illness cover, and income protection. Free, no-pressure reviews in under 60 seconds.

  • -Multi-step lead form capturing detailed user profiles - DOB, smoker status, mortgage, dependants, employment - to match users with the right product.
  • -Dedicated pages for each protection product with scroll-triggered GSAP animations and Lottie icons throughout.
  • -Statically generated with Nuxt, deployed as a prerendered site for fast load times and SEO.
TypeScriptNuxtVueTailwindGSAP
04

A memorial website for my nephew Otto, who was born on September 3rd, 2022 and passed away peacefully on January 24th, 2023, aged just four months, after being diagnosed with a rare genetic mitochondrial condition. The site raises funds for The Lily Foundation, the UK's leading mitochondrial disease charity.

  • -Video background hero with a live fundraising counter fetched from the JustGiving API, animating up to the current total on load.
  • -Custom wavy SVG dividers between sections, each hand-drawn as a unique path for an organic, handcrafted feel.
  • -Loading screen that gates the hero entrance until the video is ready to play, with a minimum display time to avoid flashing.
TypeScriptVueGSAP
05