99%
of clients report faster sign-offs and elevated stakeholder buy-in
High-stakes communication success
Optional additioanl text lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.
Study 05 · Impact stats
A smooth entrance.
A quick number roll.
A staggered rise into view, with rapid number rolls. 230ms stagger · 850ms entrance · 560ms number roll.
£2m+
Annual operational savings delivered to clients
Lorem ipsum dolor sit amet, consectetur adipiscing tempor duo elit.
13/20
Top global life sciences & tech leader rely on our lorem ipsum amet dolor
Lorem largest life sciences amet ipsum tempor sed diam elitr sed amet.
Preparing study…
Developer notes
Build this movement
Rise, then settle
- Order: left card → centre image → centre card → right card → right image.
- 230ms between starts. Rise 28px and fade in over 850ms, with a gradual ease-out to rest.
- Play once when the stats enter view. Keep the section heading and introduction outside this sequence.
- On mobile, hide the images and reveal the three stat cards in order.
Stat fields & number motion
- Before: optional static text.
- Middle: optional number. This is the only field that animates.
- After: optional static text.
- Show filled fields only, in that order. Empty fields leave no gaps; zero is a valid number.
- Leave Middle empty for a text-only stat using Before, After or both.
- The Middle number rolls upwards with brief blur, then settles sharply. Skip intermediate values; use roughly 400–560ms.
- Start the number roll as the next item enters. Reduced motion shows final values immediately.
- Copy includes the three-field structure and animation. Connect fields, images and fonts to the CMS.