Full multi-page lead-gen site for a granite countertop company serving 30+ cities across Utah, Idaho, and Wyoming — 3-step MT-aware booking wizard, middleware city routing with cookie persistence, auto-generated SEO landing pages, and a dual-nav system — zero UI kits.
Mobile
375px viewport
Mobile bottom nav
Fixed icon bar replaces the desktop header on mobile — no external menu library
3-step booking wizard
Contact info → project details → MT time-slot scheduling, fully usable on any screen size
City landing pages on mobile
30+ auto-generated city pages load fast with city-specific copy and meta — all responsive
Performance-first mobile build
Lazy Firebase init, optimized images, and minimal JS keep load times fast on any connection
Lucas Granite is a marketing and lead-generation site for a granite countertop company serving 30+ cities across Utah, Idaho, and Wyoming. The site is engineered for local search — each city gets its own landing page with unique copy and reviews, and a 3-step booking wizard walks customers from inquiry to scheduled estimate in minutes. A dual navigation system, a service area carousel with embedded maps, and a live review section build trust at every scroll.
Middleware City Routing
Custom Next.js middleware reads a cookie and silently rewrites the homepage to the visitor's last-visited city — personalized return experience with no third-party routing library.
30+ Auto-Generated City Pages
Each city page is statically generated via generateStaticParams with unique H1s, meta tags, and local reviews — all templated from a single data file using a {{city}}/{{state}} replacement system.
3-Step MT-Aware Booking Wizard
Multi-step form collects contact info, project details, and a time slot — slots generated in Mountain Time (8AM–6:30PM, 30-min intervals) with honeypot spam protection and Formspree submission.
Dual Navigation System
Desktop gets a sticky header with a transparent-to-solid scroll transition; mobile gets a fixed bottom icon bar — both built without any external navigation library.
Service Area Carousel
Horizontal-scroll city cards with embedded grayscale Google Maps and an 'All Cities' modal organized by state — giving users a clear view of the full 30+ city service area.
Firebase Analytics & SEO Sitemap
Lazy-initialized Firebase Analytics avoids blocking page load, while a dynamically generated sitemap covers all city slugs and static routes for maximum search engine coverage.
Not sure where to start?
7-page automotive paint marketing site with HLS.js video gallery, lightbox with keyboard nav, requestAnimationFrame infinite brand carousel, custom scroll animation hook, session-aware splash screen, page transition system, and three JSON-LD schemas — zero UI libraries or animation frameworks.
Free real-time precious metals calculator and educational resource — built for everyday people who want to know what their gold, silver, or platinum is worth before selling.
Corporate site for a forward-thinking multifamily developer—sustainability and urban transformation focus.
