Sunny Bonnell

Concept

Sunny Bonnell’s site is built as a speaking-reel in scroll form: a single track that moves guests from “Who is she?” to “Book her now.” Instead of leading with credentials, the page opens on a 43-second reel and the line Visionary Thinker, Author, Brand Innovator & Speaker, instantly framing Sunny as brain-trust, not just talent. Each subsequent block Talks, Media, Books reads like chapters in a manifesto on modern leadership.

Visual Language & Motion

A bone-white backdrop meets monumental PP Neue Montreal headlines that stretch the full viewport, then glide upward on GSAP spring easing. Micro-interactions feel editorial: underline rules grow from left to right, footnote arrows jump 4 px on hover, and an ever-present “©SB—” marque pulses at 0.8 fps, behaving like a heartbeat for the brand. Accent green a nod to Motto® appears only in CTA outlines and focus states, letting rich photography of keynotes glow without colour noise.

UX & Performance

With almost no heavy media above the fold, LCP lands ≈ 0.9 s desktop and 1.3 s on 4 G mobile. The hero reel is H.265, muted, and lazy-loads only on view≥1024 px; phones receive a poster frame. IntersectionObserver pulls in keynote thumbnails moments before they appear, while prefers-reduced-motion freezes slide-ins and reel autoplay. All colour pairs score WCAG AA, and tab order follows the visual sequence, so screen readers receive the same narrative rhythm as sighted users.

Takeaway

Sunny Bonnell proves a personal brand site can teach while it sells editorial structure, minimal palette and meticulous performance budgets turn a speaker bio into an experience that inspires long before the booking form.