Waiting animations

Duckling Queue waiting animation

Five fluffy ducklings wait in a tidy line on the bank of a pond, behind a little velvet rope, while mum floats nearby looking proud. One by one the front duckling hops in with a splash, paddles over to mum and slips away into the reeds; the queue shuffles forward a place and a newcomer waddles in at the back. Look again at the duckling second from the back: whoever stands there is always up on tiptoe, craning to see the front of the line.

Choose an animation

Duckling Queue animation by waitlists.org

Join the waitlist

Thanks! You're on the waitlist (position 42).

This is a preview. Press the button to see what happens when someone joins.

Duckling Queue

Five ducklings wait behind a velvet rope for their turn to jump in.

When someone joins: The whole queue does a stadium wave, each duckling hopping and flapping in turn.

Already have a signup form? Get just the animation

Paste this where the animation should appear. The credit link is part of it: it is the one condition of use.

<!-- Waiting animation: https://waitlists.org/waiting-animations/duckling-queue -->
<div class="wlo-waiting" data-wlo-animation="duckling-queue">
  <a class="wlo-credit" href="https://waitlists.org/waiting-animations/duckling-queue">Duckling Queue animation by waitlists.org</a>
</div>
<script src="https://waitlists.org/embed/waiting-animations/duckling-queue" async></script>

How it works

Pick a scene and tune it

Choose an animation, set its speed and give it your brand colour. The preview is the real thing, running exactly as it will on your site.

Point it at your website

Enter your address and we create a signup form for it on WaitlistApp.org. It collects names and emails from the moment you paste it.

Paste one snippet

One block of HTML holds the animation and the form. When someone joins, the animation celebrates with them.

Using these animations

Put any animation on any website, commercial or not. The one condition is the credit link that comes with the snippet: keep it next to the animation. If it goes missing, the script puts it back.

The animations stay hosted here, so fixes and improvements reach your page without you re-pasting anything.
They load after your page, draw only when scrolled into view, pause when off screen, and set no cookies.
Visitors who ask their device for less motion see a still frame; everyone else gets a pause button.
Please do not re-host, resell or repackage the artwork.

Questions

Will it slow my page down?

The script loads asynchronously, so it never blocks your page, and the scene is only drawn once it scrolls near the screen. Each animation is a single small file of vector art and CSS, with no images, fonts or video.

Where do the signups go?

Into a waitlist on WaitlistApp.org, a tool we build We build this . Your private link shows how many people have joined and lets you keep the list in a WaitlistApp account.

Can I change the speed and colour later?

Yes. They are plain attributes on the snippet (data-wlo-duration and data-wlo-accent); edit them on your page and the animation follows.

Can I use an animation with a form I already have?

Yes. Open "Get just the animation" under the configurator and paste that code above your own form.

What about people who find motion distracting?

If a visitor's device asks for reduced motion, they see a single still frame instead. Everyone else can pause the animation with the button in its corner.

Can I suggest an animation?

Please do. Tell us the scene you have in mind; the best ideas are a small story with a character in it.