A "protection system," not a bug catalog
Most pest-control sites lead with the thing you're afraid of: close-up insects, alarming red banners, "INFESTATION?" headlines. Sentry does the opposite. It's built to read like a home-monitoring product — calm, gridded, clinical-confident — so the anxious buyer feels the problem is already being contained.
The aesthetic school is closest to calm dashboard / control-panel design crossed with the reassurance language of security brands (think alarm-system or smart-home monitoring). Deep teal-forest greens read as clinical and trustworthy; a single warm amber carries every action. The layout is card-first and dashboard-like, with a centered hero and a literal coverage map, so the whole page feels like a system watching over the house.
How the pieces are built
The radar sweep (signature interaction)
The hero centerpiece is a radar disc: concentric sage rings, a stylized home icon at the core, and a rotating sweep line made from a single conic-gradient element spun with one keyframe. The trailing amber fade is baked into the gradient stops, so the light "tapers" behind the leading edge for free — no JS, no canvas.
/* one element, one animation */
.sweep{
background:conic-gradient(from 0deg,
transparent 296deg,
rgba(232,161,58,.28) 350deg,
rgba(244,180,87,.55) 360deg);
animation:sweep 4s linear infinite;
}
@keyframes sweep{ to{ transform:rotate(360deg); } }Small "clear" ping dots are positioned around the disc; each has the same 4-second ping keyframe but a staggered animation-delay tuned to its angle, so a dot flashes amber exactly as the sweep passes it, then settles to a lit sage. The effect reads as "the home is being scanned and every point is clear."
Duotone photography with layered scrims
Both provided photos are art-directed, never dropped in raw. The hero photo sits under a stacked ::before/::after — a multiply teal wash plus a top-and-bottom linear scrim — so bone-white text holds AA contrast at every viewport. The inspection photo gets a teal-to-amber duotone overlay and inset amber corner brackets, echoing the radar's "targeting" language.
A hand-drawn SVG coverage map
The service area isn't a heavy embedded map — it's a lightweight inline <svg>: a gridded field, dashed amber coverage halo, an HQ node in Arcadia, and labeled town dots. It loads instantly, recolors with the palette, and reinforces the monitoring metaphor better than a real map tile ever would.
Restraint under reduced motion
Under prefers-reduced-motion the site stays fully designed but goes still: the radar sweep freezes at a pleasant angle, every ping dot is shown already-lit in amber, and scroll reveals resolve to their final state. Nobody gets a dead page; motion-sensitive visitors just get the calm version.
@media (prefers-reduced-motion:reduce){
.sweep{ animation:none; transform:rotate(-42deg); }
.ping { animation:none; opacity:1; }
}Written by hand, no framework in sight
This site was hand-coded — plain HTML, CSS, and JavaScript, written line by line. No page builders, no drag-and-drop themes, no off-the-shelf frameworks. Every detail, from the radar sweep that scans the home perimeter to the sticky call bar, was engineered specifically to move a homeowner toward one action: picking up the phone.
That's the Tiny Mammoth approach to a client website: a template built to convert, not just to look good.
The conversion decisions
- The phone is never more than a glance away. It lives in the sticky header, twice in the hero, in the process step, beside the form, and in the mobile call bar — anxious buyers who want to talk to a human can, instantly.
- Dual hero CTAs cover both mindsets. A large
tel:button for "call me now" and a "Get a Free Quote" button that smooth-scrolls to the form for "I'll type it out" — no one is forced down the wrong path. - The trust strip answers objections up front. 4.9★ from 612 reviews, "Licensed & Insured," and 16 years in business sit directly under the hero — credibility before the scroll even begins.
- The sticky mobile call bar removes the hardest step. On phones — where most local-service traffic lives — "Call Now" is pinned to the thumb zone at all times, and the body is padded so it never hides content.
- The form is deliberately short. Name, phone, service, and an optional note — four fields, an inline thank-you state, and a phone fallback for anyone who'd rather call. Fewer fields, more submissions.
- The guarantee is repeated as the emotional close. "If a pest comes back, so do we — free" turns the risk around, which is exactly what a fearful buyer needs to hear before committing.
What Sentry does differently
Every template in our template library deliberately moves along a few design axes so no two feel alike. Here's where Sentry stakes its own ground:
Palette
Clinical teal-forest and deep pine with a single warm amber — reassurance, not the reds and yellows of typical "exterminator" branding.
Typography
Space Grotesk's geometric grotesque for a technical, monitored feel, paired with Inter for calm, legible body copy.
Layout
Card-first "dashboard" structure with a centered hero and a real coverage map — the page itself looks like a control panel.
Signature interaction
A radar sweep scanning a stylized home, with clear-ping dots — a monitoring metaphor, not a before/after slider or a bug photo.
Pest-control buyers act from anxiety, and what they actually want is reassurance that the problem will be contained and made invisible. A calm, systematic "protection / monitoring" aesthetic — radar, coverage map, guarantee — should convert that fear into trust far better than alarming close-up bug photography, which mostly makes the anxious feel worse. Sentry commits fully to that bet.
For a business owner, the practical advantages are concrete: the site looks like a premium, professionally-monitored service (justifying subscription pricing like Monthly Guard), it reduces the "ick" that makes people close the tab, and it channels every visitor toward one of two low-friction actions — call or quote — while quietly building the credibility that closes the deal.