Route - Smart Optometry Landing Page Template

Quick summary

Route is a single-page, card-grid landing page template for domiciliary optometry route optimisation software. It opens with a live-metrics hero, moves through interactive flip cards and a cancellation demo, and closes on a dual-path call to action covering app download and a 14-day free trial. The layout is mobile-first, data-dense, and built for field clinicians.

Who this template is for

This template is designed for teams building or marketing a mobile route optimisation tool aimed at the domiciliary eye care sector. It speaks directly to the clinicians and coordinators who plan patient visits on the road.

• Independent mobile optometrists running one-to-three-person home-visit practices
• Optical franchise managers dispatching teams of three to twelve field clinicians
• National Health Service domiciliary care coordinators managing vulnerable-patient time windows and drive-time constraints

What problem this template solves

Planning a day of scattered home visits without a purpose-built tool is slow, error-prone, and expensive. Field clinicians lose hours every week to manual diary juggling, inefficient routing, and last-minute cancellation chaos.

• No clear way to visualise a full day of patient stops as one optimised drive sequence
• Manual re-scheduling after a cancellation wastes valuable clinical time mid-route
• Generic mapping tools cannot account for patient time windows or rural loop constraints

What you get with this template

You get a fully structured, interactive landing page with six distinct content sections and a clear conversion path to app download or free trial signup. Every section earns the visitor's trust before asking them to commit.

• An animated SVG hero dashboard with fourteen patient pins, a pulsing route line, and three live metric cards
• Three interactive explorer cards covering before-and-after route toggle, cancellation re-sequencing demo, and a testimonials grid with mileage reductions
• A dual-path call-to-action block with App Store and Google Play badges, an email handoff field, and a 14-day free trial secondary option

Feature list

This template comes with several purpose-built components that go beyond a static layout.

Animated SVG Route Map Hero

The hero section renders fourteen patient pins scattered across a city map. A pulsing route line draws itself in optimised sequence, while three oversized metric cards count up to "14 visits," "47 miles saved," and "2h 12m recovered." The animation is built with SVG draw techniques and counter animation using requestAnimationFrame for smooth rendering.

Before-and-After Route Toggle Card

A flip card lets visitors switch between a chaotic zigzag route and a clean optimised loop on a miniature embedded map. The interaction is immediate and visceral. It shows the core value of the platform without a single line of explanatory text.

Cancellation Re-sequencing Demo

A dedicated card simulates a patient cancellation at 11 a.m. and animates the system re-ordering the afternoon route in under two seconds. This demo is the single most persuasive element on the page for any field clinician who has faced this exact situation.

Testimonials Grid with Mileage Data

A card grid stacks domiciliary optometrist quotes alongside specific weekly mileage and time reductions. Quotes are grounded in real UK locations such as London boroughs, Leeds, and Manchester. Social proof is shown as data, not generic praise.

Dual-Path App Download Block

The call-to-action section pairs App Store and Google Play download badges with a single email field labelled "Or text me the link." A secondary button offers "See Your Routes Free for 14 Days" for visitors who need more convincing before committing.

Card Grid Modular Layout

The entire page is structured as a modular card grid. Each section is a self-contained card that can be flipped, expanded, or filtered. The layout scales naturally from a large desktop dashboard view down to a single-column mobile stack.

Page sections overview

Design & branding system

The visual identity is built on a Startup Velocity theme using a Slate and Sky colour system. Every colour choice is intentional and functional, not decorative.

• Deep dashboard slate (#1E293B) dominates background and card surfaces; sky blue (#38BDF8) drives all interactive elements, route lines, and primary buttons
• Clinical instrument gray (#64748B) handles body text, secondary labels, and supporting copy
• Confirmation green (#34D399) appears only when the system proves it saved something, applied exclusively to time and mileage callouts to keep its meaning sharp

Mobile & speed optimization

The template is designed mobile-first because the primary user is a clinician tapping their phone at 7:45 a.m. before leaving the house. Every interaction is thumb-friendly and every animation is hardware-accelerated.

• Lazy loading is applied to all below-the-fold sections to keep initial load fast on mobile connections
• All animations use CSS transforms only and requestAnimationFrame counters, avoiding layout-triggering properties that slow down older devices
• The card grid collapses to a single-column stack on small screens, keeping every interactive element accessible without horizontal scrolling

How this template helps you convert

The page is structured so that visitors interact with the core value proposition before they ever see a call-to-action button. By the time they reach the download prompt, the tool has already solved their problem three times.

1. The animated hero dashboard quantifies the outcome in seconds, turning an abstract software promise into concrete numbers that feel like a personal result.
2. The interactive before-and-after card and cancellation demo let visitors experience the optimisation logic themselves, removing doubt about whether the tool actually works for their route type.
3. The dual-path call-to-action block removes commitment friction by offering both an immediate app download and a no-pressure 14-day free trial, matching the visitor's readiness level.

Other information about this template

This template is part of a broader set of Startup Velocity themed designs built for mobile-first software products in specialist professional sectors.

• The typography stack uses Plus Jakarta Sans for all headings and DM Sans for body copy, combining dashboard clarity with comfortable long-form readability
• UK localisation is built into the copy layer, including miles as the distance unit, GBP references, and place names from London boroughs, Leeds, and Manchester
• The template style is Card Grid Modular, meaning individual sections can be reordered or removed without breaking the overall layout hierarchy
• Ping dot animations on the map and blob morphing transitions add motion depth without relying on video or heavy asset files

Show more