> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Animationen zur Steigerung des Engagements nutzen

> Fügen Sie Animationen hinzu, um Elemente hervorzuheben, die Aufmerksamkeit zu lenken und Landingpages interaktiver und ansprechender zu gestalten.

Mit Animationen bringen Sie Bewegung in Ihre Elemente und machen Ihre Seite ansprechender und interaktiver. Sie ziehen Aufmerksamkeit auf sich, führen Nutzer und verbessern das Gesamterlebnis.

***

## Wo Sie es finden

1. Wählen Sie ein beliebiges Element aus (Schaltfläche, Bild, Text usw.)
2. Wechseln Sie zum **rechten Panel**
3. Öffnen Sie den Bereich **Animation**
4. Klicken Sie auf **+ Add** oder bearbeiten Sie eine bestehende Animation

***

## Eine Animation auswählen

Im Animations-Panel finden Sie eine umfangreiche Bibliothek.

* Sie können **scrollen**, um alle verfügbaren Optionen zu erkunden
* Über die **Suchleiste** finden Sie schnell eine bestimmte Animation

Die Animationen sind außerdem in **Kategorien** gegliedert, etwa:

* Attention Seekers
* Entrances

👉 So finden Sie je nach Ziel leichter die passende Art von Animation

***

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/Cnvtc1TpBSCIUd3d/images/image-17.png?fit=max&auto=format&n=Cnvtc1TpBSCIUd3d&q=85&s=ab72592c91c31fbe3b1262a2491a4a8a" alt="Image" width="664" height="933" data-path="images/image-17.png" />
</Frame>

## Animations-Einstellungen

### Trigger

Legt fest, wann die Animation abläuft:

* **On Load** → läuft ab, wenn das Element erscheint
* **On Hover** → läuft ab, wenn der Nutzer mit der Maus darüberfährt
* **On Click** → läuft beim Klicken ab
* **On Viewport** → läuft fortlaufend ab (sofern unterstützt)

***

### Speed

* Steuert, wie schnell die Animation abläuft

***

### Delay

* Fügt vor dem Start der Animation eine Pause ein

***

### Repeat

* Steuert, wie oft die Animation abgespielt wird

***

## Beispiel

* Animation: Fade In
* Trigger: On Load
* Speed: Normal
* Delay: 0,3 s
* Repeat: 1

👉 Ergebnis: Das Element erscheint beim Laden der Seite sanft.

***

## Bewährte Vorgehensweisen

* Halten Sie Animationen dezent und zweckmäßig
* Vermeiden Sie zu viele Animationen gleichzeitig
* Nutzen Sie Entrances, um Elemente sanft einzuführen
* Setzen Sie Aufmerksamkeitsanimationen nur dort ein, wo sie nötig sind