Outsmart Online
The offer, the quote, and the lead record for a Denver service business, on one domain. Designed, built, and published by one person. Live at outsmartonline.com.
- Problem
- The offer, the quote, and the record of where a lead came from were not one site.
- Role
- Design, frontend, and publishing
- Built
- The public site, the quote path, and the lead API
- Tracking
- Consent first, then the page view and the lead
- Result
- Shipped. Live at outsmartonline.com.
Case study
Outsmart Online is my site for Denver service businesses. I designed it, wrote it, and published it. The home page states the offer in the open: a local service website, a refresh, landing pages, and optional care, with the starting ranges on the page.
What I created
- The quote quiz. Get a FREE Quote asks what the business needs, then a name and an email, and keeps those answers with the lead.
- The contact form on the home page, the contact page, and the offer page. A phone number formats as it is typed.
- The lead API at /api/contact, a Vercel function. It checks the origin, limits repeat posts, requires a name and an email, checks a blocklist, and stores the lead in Supabase. A clean lead can be classified with Anthropic before it is treated as ready. Mailgun sends the notification when outbound mail is on.
- The note that travels with the lead. First touch and last touch, the campaign parameters, and the ad click ids from Google, Microsoft, Meta, TikTok, and LinkedIn.
- The consent bar. Analytics stays on until a visitor turns it off. Google Tag Manager loads only after that allow, and it does not load on the admin screens or during the prerender.
- The data layer. The events are a page view and a completed lead. The form fields stay out of the data layer.
- The chat widget on the public pages. The server uses xAI. A lead from chat is the same record as the form.
- The wordmark, and the design tokens for color, type, radius, and motion, inlined on the page. The type is Instrument Serif and Inter.
What I modified
The site started as a reusable agency starter. I turned that starter into this business: the Denver copy, the four services and their prices, the process, the offer page, the about page, and the areas page. The build stayed React 19, React Router 7, and Vite 6. Vite writes the browser bundle, renders each public page to HTML, and packages the result for Vercel.
What I published
The production site is outsmartonline.com, on Vercel, over HTTPS. The public pages are home, services, about, areas served, contact, the offer, and privacy. Each one ships with a title, a description, a canonical URL, and WebPage structured data. Search indexing stays off until I turn the launch flag on. The admin for the leads is on the same deploy.