JR Putman Digital Infrastructure

The Build

13-Section Homepage Architecture

Every section earned its place through conversion logic, not aesthetic preference.

Hero with "Mom-Approved Since 1981" positioning—reframing 40 years of history into an emotional trust signal. Announcement bar with "No Overtime Rates" messaging to neutralize price objection immediately. Trust bar with license number, establishment date, and service area. Specials section tied to CMS for seasonal flexibility. Services grid pulling from collection. Membership program with clear value math. "Seal of Safety" section documenting background checks, drug testing, photo/bio pre-arrival—critical for in-home service trust. Process timeline showing what happens before, during, and after the call. Proof section with real job cards showing system type, investment, financing, and turnaround. Contractors for a Cause charity section signaling community values. Testimonials. Final CTA with form.

Each section was built mobile-first. Each animation was performance-gated. Each element was conversion-justified.

GSAP Animation System

800+ lines of production JavaScript. Lenis smooth scroll integration. Physics variables pulled from CSS custom properties for design-system consistency. Truck bobbing animation on the hero. Marquee trust bar. Magnetic buttons. Staggered reveal cascades. Footer parallax. Scroll progress indicator.

But the real engineering was in what we didn't animate. Performance gating detects low-end devices and reduced motion preferences—then skips heavy animations automatically. Mobile gets a lighter experience because conversion matters more than showing off.

52-Field CMS Architecture

We built a service page template that scales. 52 fields covering: hero content, problem/solution framing, 3-option repair presentation, process steps, trust signals, emergency service toggles, FAQ references, meta data, schema markup hooks, and homepage service card content.

The 3-option structure was strategic. Most homeowners expect the good-cop/bad-cop upsell. Documenting JR Putman's actual process—"Get it running" / "Fix it right" / "Go long-term"—builds trust before the tech arrives.

We wrote 5 complete service pages with differentiated copy, then built a CSV import system for the remaining 15. Same structure, no redundancy, voice stays consistent.

Brand Voice Correction

The original copy had invented guarantees, wrong tone, dramatic storytelling that didn't match the business. We ran the content through competitive analysis and stripped it back to what JR Putman actually is: straightforward Sacramento tradespeople who show up, diagnose honestly, price fairly, and don't charge overtime.

"Your emergency shouldn't cost extra" hits harder than "we're here for you 24/7."

The System

This wasn't a website project. It was four systems working together:

Homepage — 13 sections, scroll-choreographed, conversion-optimized, mobile-first.

Service Pages — 20+ pages built on 52-field CMS architecture with SEO-ready structure and differentiated copy.

Animation Framework — GSAP/Lenis system with physics variables, performance gating, and accessibility compliance.

Content Engine — CSV import workflow for scalable page production without quality degradation.

Hours invested: 150-250+ across strategy, homepage build, CMS architecture, animation development, content production, and QA cycles.

The site now operates as a conversion asset—not a brochure. Every section justifies its existence. Every animation serves the user. Every page compounds SEO value. And the whole thing is maintainable by someone who didn't build it.

That's the difference between a website and a system.

‍