Lottie und Gif in 3D - Neue animierte Materialien

Das Hinzufügen von animierten Materialien und Texturen zu deinen Designs ist eine fantastische Möglichkeit, deine eingebetteten 3D-Objekte im Web noch ansprechender zu gestalten. Vectary ist die einzige 3D-Designplattform, mit der du nicht nur GIFs als animiertes Material, sondern auch Lotties importieren kannst – ein Format, das sich ideal für eine optimierte Web-Performance eignet. Animierte Texturen eignen sich hervorragend, um eine UI zu präsentieren oder der Oberfläche einen besonderen effekt zu verleihen.

„Mit diesem neuen Release wird Vectary zur zentralen Anlaufstelle für Produktdesigner, Motion Designer, 3D-Artists und Entwickler. Ich kann mir einen neuen Markt für Lotties vorstellen, der sich stärker auf Texturen für 3D-Assets konzentriert.“ Daniel Nisttahuz, Principal Product Designer, Lottiefiles

„Das Erstellen von Animationen erfordert einiges an Klicks. Manchmal braucht es nur eine winzige Bewegung, um Tiefe zu erzeugen und ganz einzutauchen. Das Hinzufügen einer animierten Textur liefert genau dieses Ergebnis – und das mit nur zwei Klicks.“ Andy Klement, Head of Research bei Vectary

Da dieses Feature webbasiert ist, ist es extrem zugänglich und lässt sich mühelos in jeden Workflow integrieren (Figma, Miro, Pitch, Framer). Das Designpotenzial und die Flexibilität beim Arbeiten mit Vectary sind ein echter Gewinn für Designer, die sich auf User Experience und Content-Erstellung konzentrieren.

„Ich nutze Lotties und Vectary ziemlich oft, weil sie webbasiert und dadurch so flexibel sind. Die beiden miteinander kombinieren zu können, ermöglicht es mir, meinen Kunden mehr Services anzubieten.“ Apostolos Roussas, Director, Motion Artist bei CandyMustache.

So bringst du Animationen in Vectary

Es gibt verschiedene Möglichkeiten, Animationen in Vectary einzubinden:

1. Platziere animierte Lottie-Dateien oder .gifs als Textur. Wähle das Objekt aus und wähle dann Animation in den Color -Einstellungen. Importiere die Datei oder nutze den Link zur Online-Datei. Vectary loads it automatically. To see the animation, go to Preview -Modus. Um die Animation zu entfernen, wähle Solid.

2. Lade die Animation in verschiedenen Material Properties , um beeindruckende Ergebnisse zu erzielen. 

- Damit sie leuchtet, importiere sie in Emission. Füge Bloom in den Umgebung -Einstellungen für zusätzlichen Glow hinzu. 

-  Lade die Animation als Normal-Map-Einstellung , um nur das Relief zu verändern.

3. Importiere die Animation als separates Objekt in die Szene. Ziehe die Datei per Drag-and-Drop in die Szene oder füge den Link per Copy-Paste ein. Die Lottie-Datei oder das .gif verhält sich wie ein separates Objekt. Nutze das Gizmo , um es in der Szene zu bewegen. 

Teile die Szene als Link oder bette sie für einen großartigen Effekt auf deiner Website ein

„Ich kann jetzt ganz einfach 3D-Animationen auf meiner Website einbinden. Dieses Feature eröffnet eine völlig neue Welt der Möglichkeiten.“ Joseph Berry, Freelance Experience Designer