Giant AI Solutions: a bespoke agency site with a built-in client portal
A bespoke marketing site and authenticated client area for an AI consultancy — built as a single Vite + React + TypeScript SPA with a Supabase auth layer. Two distinct experiences (public marketing surface + client portal), one codebase, one design system, one auth boundary.
The bottleneck
Most AI consultancies present themselves as a single marketing page. The reality of selling AI engineering is a longer relationship — prospects read about services, contact the firm, and once they sign, they need a place to see project artefacts, status, and structured communication. That work usually leaks across email, Slack, and shared drives.
The off-the-shelf path is to bolt a SaaS client portal onto a Webflow marketing site. Two domains, two auth systems, two design systems, and the seam is always visible. The consultancy then operates as two products instead of one.
What I built
A bespoke React + TypeScript SPA with two integrated experiences:
- Public marketing surface. Service pages, a contact flow, and a local-SEO template that spins up geo-targeted landing pages without copy-pasting the rest of the site.
- Auth-gated client area. Supabase handles login, sessions, and role assignment. Protected routes surface role-scoped views (client vs. admin) using the same component library and brand system.
- Single design system. Public site and client portal share Tailwind tokens, components, and copy primitives. No brand seam between "this is the marketing site" and "this is the client tool".
What changed
Marketing and client operations live under one domain with one auth layer. The local-SEO template means new geo-targeted pages cost minutes, not days. The client portal grows alongside the consultancy's actual workflow instead of fighting a SaaS portal's idea of what consulting work looks like.
Services used in this build
The capability and service pages this engagement delivered against. Use them to scope a similar build for your operation.
Questions about this build
Two reasons. First, the marketing site and the authenticated client area share a codebase, a design system, and an auth layer — splitting them across a CMS and a separate app doubles operational overhead and breaks the brand seam. Second, a bespoke build leaves a clean substrate for new tools (lead capture variants, geo-targeted landing pages, client-portal features) without fighting a CMS plugin model.
Supabase handles auth, sessions, and role assignment. Public marketing routes render unauthenticated. Protected client-area routes redirect unauthenticated users to a login page and surface role-scoped views (client / admin) for authenticated users. One codebase, two distinct experiences, no double-build.
A dedicated local-SEO page template lets the site spin up geo-specific landing pages — service + city combinations — without duplicating the rest of the site. Each page is prerendered to static HTML, gets its own meta title and description, and feeds the sitemap automatically. The target query class is "AI solutions [city]" / "AI consultancy [region]" and adjacent commercial intent.
Anything where a vendor solves the problem well — payments, email, analytics, CRM integrations. The build owns the UX, the data model, and the auth boundary. Commodity infrastructure stays vendor-owned.
Still have a question? Book a discovery call — direct line to me, Dean.
Other industries I've built for
Different operations, same engineering discipline.
Lyttle's Tiling
High-conversion bespoke trade website for a Lancashire tiler
Health & fitness — diabetes-awareFitLife
Claude-powered diabetes-aware AI fitness platform
Hospitality — direct-booking holiday letStay by the Sea
Direct-booking site engineered to outrank OTAs for a 7-bed Blackpool let
Want a build like this for your operation?
Every build starts with a discovery call. Map your bottlenecks. Get a costed bottleneck map — whether we build or not.
Book a Discovery Call