3D Globe

Linien und Punkte bewegen sich animiert zwischen Orten auf einer Karte oder einem Globus.

Füge bei [wo] „Animated Map Arcs“ hinzu (auch globe arcs genannt).
Gekrümmte Linien sollen sich nacheinander zwischen Orten auf einer Punktekarte selbst zeichnen und sich dann zu ihrem Ziel zurückziehen, während dort ein weicher Ring pulsiert: ruhig und gleichmäßig.
Versetze die Bögen zeitlich, damit sie sich nie im Gleichtakt bewegen, halte die Schleife nahtlos und pausiere sie bei reduzierter Bewegung (prefers-reduced-motion).

Kleine Kreise oder Icons kreisen auf runden Bahnen um einen Mittelpunkt.

Füge bei [wo] „Orbiting Circles“ hinzu (auch orbit animation oder orbiting icons genannt).
Kleine Kreise sollen langsam und gleichmäßig auf runden Ringen um ein zentrales Element kreisen, wobei sich der äußere Ring in die Gegenrichtung und langsamer dreht.
Halte die Schleife nahtlos und die kreisenden Elemente aufrecht, und stoppe die Drehung bei reduzierter Bewegung (prefers-reduced-motion).

Eine Karte kippt beim Hovern perspektivisch nach hinten, während ein Pin mit Leuchten zum Betrachter aufsteigt.

Füge bei [wo] einen „3D Pin“-Hover-Effekt hinzu (auch pin hover 3D genannt).
Wenn der Zeiger über der Karte ist, soll sie perspektivisch nach hinten kippen, während ein Pin mit sanftem Leuchten am Fuß aus ihrer Mitte aufsteigt; beim Verlassen kehrt alles zurück: sanft, ohne Nachfedern.
Lass den Platz der Karte im Layout unverändert und zeige denselben Effekt beim Tastaturfokus.

Eine Karte dreht sich perspektivisch zum Zeiger, und geschichtete Inhalte heben sich von der Oberfläche ab.

Füge bei [wo] einen „3D Tilt“-Effekt hinzu (auch perspective tilt oder tilt card genannt).
Die Karte soll sich perspektivisch zum Zeiger neigen, während er sich bewegt, ihre inneren Ebenen heben sich in unterschiedlichen Tiefen ab, und beim Verlassen gleitet sie sanft zurück in die Ebene: weich und dezent.
Halte die Neigung sanft, damit der Text lesbar bleibt, und lass die Karte auf Touch-Geräten und bei reduzierter Bewegung (prefers-reduced-motion) flach.

Eine Karte dreht sich um eine Achse halb herum und zeigt ihre Rückseite.

Füge bei [wo] einen „Card Flip“-Effekt hinzu (auch flip card oder card flip 3D genannt).
Wenn der Zeiger über der Karte ist, soll sie sich perspektivisch um ihre senkrechte Achse umdrehen und ihre Rückseite zeigen, beim Verlassen dreht sie sich zurück: weich und gleichmäßig.
Blende die Rückseite jeder Fläche aus, damit die beiden nie durcheinander durchscheinen, und lass das Umdrehen auch beim Tastaturfokus und per Tippen auf Touch-Geräten funktionieren.