Mobile
375px viewport
Landscape Architecture & Construction Studio
Full custom marketing website for Jessica Matteson, PLA — a Connecticut & New York landscape architect with 25 years of experience. Built in Next.js 15 with quiet luxury aesthetics: animated hero carousel, word-by-word scroll reveals, interactive 9-step process, portfolio grid, and a custom brand design system.
Animated scroll reveals
Word-by-word text animations trigger on scroll across all key sections for a refined editorial feel
Portfolio grid
Hover vignette and lift effects showcase completed landscape projects with quiet luxury styling
Interactive process steps
9-step sidebar visualization walks clients through the full design-to-build workflow
Custom contact form
Grouped service and inquiry dropdowns with multi-field layout for qualified lead capture
Dancer & Co is a full-service landscape architecture and construction studio led by Jessica Matteson, a Cornell MLA with 25 years of experience across coastal estates, pollinator meadows, and luxury outdoor living spaces in Fairfield County, Greenwich, Westport, Southampton, and the Hudson River Valley. The site was built in Next.js 15 (App Router) with TypeScript to reflect the firm's brand identity — quiet luxury, material integrity, and spatial clarity. Every element was designed from scratch: a 3-slide auto-rotating full-bleed hero with crossfade transitions, word-by-word animated text reveals driven by IntersectionObserver, an interactive 9-step process visualization with sidebar navigation, a portfolio grid with hover vignette effects, an 8-quote testimonials carousel linked to case studies, and a press bar featuring 9 publication callouts. The design system uses Playfair Display headings, Inter body text, and a palette anchored by Heavenly White (#F4F3E9), Prairie Dust (#A69B88), and Baked Green (#425F2B) — all implemented via inline styles with no Tailwind.
Animated Hero Carousel
3-slide auto-rotating full-bleed hero with smooth crossfade transitions, manual navigation controls, and responsive image sets for mobile and desktop.
Word-by-Word Scroll Animations
Custom AnimatedWords component with IntersectionObserver-triggered reveals across all key sections — no animation library, pure JS and CSS.
Interactive 9-Step Process
Sidebar navigation with active state indicators, image + description pane, and Baked Green (#425F2B) accent treatment guiding visitors through the firm's full workflow.
Portfolio Grid with Hover Effects
Vignette darkening, lift animations on hover, and graceful image placeholder fallbacks — presenting completed projects with refined editorial styling.
Testimonials & Press Bar
8-quote testimonials carousel linked to portfolio case studies, plus a staggered-fade press bar featuring 9 publication callouts including AD Pro, Homes & Gardens, ASLA, and APLD.
Custom Brand Design System
Heavenly White, Prairie Dust, and Baked Green palette with Playfair Display headings and Inter body — all implemented via inline styles with no Tailwind dependency.
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.
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.
Complete accounting and finance solution for growing businesses—from bookkeeping to fractional CFO services and strategic tax planning.
