Animationen in Figma

Das Projekt

Interaktive Prototypen in Figma ermöglichen es, Ideen nicht nur visuell, sondern auch dynamisch erlebbar zu machen. Im Rahmen kleinerer Übungen sind Animationen in Figma entstanden, die die Möglichkeiten von On-Click-, On-Hover und On-Drag-Interaktionen verdeutlichen.

Verspielter Button

Tic-Tac-Toe

Wetter- und Tageszyklus-Button

Ein Button, der mit unterschiedlichen Triggern arbeitet:

On-Drag: Der Tag wechselt zwischen Tag und Nacht.
On-Click: Das Wetter ändert sich dynamisch. Die Nacht und der Tag werden dunkler.
On-Hover: Es werden kleine Tageszeitabhängige Animationen abgespielt, wenn über einen bestimmten Punkt des Buttons gehovert wird. (nur auf Desktop möglich)

Fokus: Demonstration, wie ein einzelnes Interface-Element durch smarte Interaktionen komplexe Zustände vermitteln kann.

Tic-Tac-Toe Spiel

Ein minimalistischer Prototyp für ein Tic-Tac-Toe-Spiel:

On-Hover: Auswahl zwischen X und O wird angezeigt. (nur auf Desktop möglich)
On-Click: Spieler:innen können das gewünschte Symbol setzen.

Fokus: Einfache Interaktionen und Microanimations, die verdeutlichen, wie Nutzeraktionen direktes visuelles Feedback erzeugen können.