
 
 
 
 
 
 
 
 
 Die Autoren: (1) Vivian Liu, Columbia University (vivian@cs.columbia.edu) (2) Rubaiat Habib Kazi, Adobe Research (rhabib@adobe.com) (3) Li-Yi Wei, Adobe Research (lwei@adobe.com) (4) Matthew Fisher, Adobe Research (matfishe@adobe.com) (5) Timothy Langlois, Adobe Research (tlangloi@adobe.com) (6) Seth Walker, Adobe Research (swalker@adobe.com) (7) Lydia Chilton, Columbia University (chilton@cs.columbia.edu) Authors: (1) Vivian Liu, Columbia University (vivian@cs.columbia.edu) (2) Rubaiat Habib Kazi, Adobe Research (rhabib@adobe.com) (3) Li-Yi Wei, Adobe Research (lwei@adobe.com) (4) Matthew Fisher, Adobe Research (matfishe@adobe.com) (5) Timothy Langlois, Adobe Research (tlangloi@adobe.com) (6) Seth Walker, Adobe Research (swalker@adobe.com) (7) Lydia Chilton, Columbia University (chilton@cs.columbia.edu) Tisch links Abstract und 1 Einführung 2 Verwandte Arbeiten 2.1 Programmübersicht 2.2 Kreativitätsunterstützung Werkzeuge für Animation 2.3 Generative Werkzeuge für das Design 3 Formative Schritte 4 Logomotion System und 4.1 Input 4.2 Vorbearbeitung visueller Informationen 4.3 Visuell begründete Code-Synthese 5 Bewertungen 5.1 Bewertung: Reparatur des Programms 5.2 Methodik 5.3 Ergebnisse 6 Bewertung mit Novices 7 Diskussion und 7.1 Abstand von Templates 7.2 Generieren von Code rund um Visuals 7.3 Beschränkungen 8 Schlussfolgerungen und Referenzen Abstrakt Animierte Logos sind eine überzeugende und allgegenwärtige Art und Weise, wie Einzelpersonen und Marken sich online darstellen. Die manuelle Erstellung dieser Logos kann erhebliche künstlerische Fähigkeiten und Anstrengungen erfordern. Um Anfängern zu helfen, Logos zu animieren, bieten Design-Tools derzeit Vorlagen und Animations-Vorsätze. Jedoch können diese Lösungen in ihrem ausdrucksvollen Bereich begrenzt werden. Große Sprachmodelle haben das Potenzial, Anime-Logo-Designern zu helfen, animierte Logos zu erstellen, indem sie Animationskodex erzeugen, die auf ihren Inhalt zugeschnitten sind. In diesem Papier führen wir LogoMotion ein, ein LLM-basiertes System, das in einem Schichtdokument einführt und animierte Logos 1 Einführung Bewegung schlägt Leben vor, und als solche ist Bewegung eine Dimension, die wir unseren Designs hinzufügen, um sie dynamischer und ansprechender zu machen. Animation ist eine spezielle Art von Designform, die wir geschaffen haben, um uns zu helfen, statische Designs in mehr Medien-reiche und interaktive Kontexte zu bringen. Eine bestimmte Art von animierten Inhalten, die wir häufig erstellen, ist das animierte Logo. Animation ermöglicht Logos, die als die „visuellen Figuren“ von Marken [25] definiert wurden, besser in Videos, Live Streams, Websites und sozialen Medien zu integrieren. Eine gut ausgeführte Animation kann schnell ein Publikum einbeziehen, die Marke oder das Individuum online vorstellen und Inhalte erhöhen, um mehr visuelles Interesse zu haben. Das Schreiben eines animierten Logos ist eine Herausforderung. Logos sind oft mehr als nur ein Paar von Symbolen mit Text. Da sie unterschiedliche Layouts, Schichten, Farben und Typografie haben können, können sie eine große Vielfalt annehmen und komplexe Artefakte sein, um zu animieren. Für einen Anfänger-Designer kann es schwierig sein zu verstehen, welche Designelemente animiert werden sollten, in welcher Reihenfolge und wie man eine überzeugende und glaubwürdige Bewegung aufbaut. Es gibt viele Facetten der Bewegung zu berücksichtigen, wie Geschwindigkeit, Timing, Positionierung, Dauer, Erleichterung und Bewegungspersönlichkeit (z. B. ein spielerischer Bounce vs. ein starker Eingang). Darüber hinaus müssen Designer verstehen, wie Gruppen von Elementen synchronis Obwohl es eine große Nachfrage nach animierten Inhalten gibt, ist es für Personen außerhalb des Motion-Designs schwierig, diese Art von Fachwissen zu entwickeln. Design-Tools wie Adobe Express, Canva und Figma bieten oft Lösungen in Form von animierten Vorlagen und automatischen Animationstechniken [10, 12, 13]. Vorlagen präpopulieren Logo-Layouts mit Animationen, die Benutzer anpassen können. Sie illustrieren, wie Benutzer Motion-Voreinstellungen (z. B. Slide, Flicker oder Fade) auf Logo-Elemente anwenden können, um professionell aussehende Animationen zu erstellen. Vorlagen passen jedoch nicht immer zu jedem Anwendungsfall an. Wenn Benutzer Bearbeitungen vornehmen (z. B. Logo-Vorlagen hinzufügen/entfernen/ersetzen Große Sprachmodelle (LLMs) bieten das Potenzial für Contentaware-Animation. Sie können Animationskode generieren, der spezifisch für die Designelemente und deren Layout auf dem Leinwand ist. Code ist eine Textdarstellung, die oft verwendet wird, um Animation zu treiben [18, 33, 53], weil es prägnant angeben kann, wie Elemente im Laufe der Zeit und im Raum auf einem Leinwand interagieren. Da LLMs eine große Menge an Weltwissen kodieren, können sie auf Aktionen und Aktivitäten im Zusammenhang mit dem Inhalt, der animiert wird, zurückgreifen und eine nahezu unendliche Anzahl von Animationen generieren. Diese offene Generationskapazität kann über den Umfang hinausgehen, den Vorlagen, Voreinstellungen und regelbasierte Techniken normalerweise abde Die jüngsten Fortschritte haben LLMs multimodaler gemacht, so dass sie sowohl Text als auch Bild als Eingänge einnehmen können und visuell zugrunde liegende Antworten liefern. Dies macht LLMs in Bereichen wie Animation, in denen ein visuelles Verständnis der Leinwand zählt, mehr anwendbar. Es öffnet das Potenzial für Benutzer, Bilder ihres Layouts zu einem LLM zu liefern und Animationen zu erhalten, die auf ihr Layout und Designelemente zugeschnitten sind. Zum Beispiel, wenn ein Anfänger-Designer ein Taxi animieren wollte, könnten sie ein LLM verwenden, um Code zu generieren, um ein Taxi auf das Leinwand zu fahren. Dieser Code könnte das Taxiobjekt entlang der X-Achse übersetzen, bevor es in die Mitte des Leinwands abgel In diesem Papier präsentieren wir LogoMotion, eine LLM-basierte Methode, die statische Layouts automatisch in einer inhaltlich bewussten Weise animiert. LogoMotion erzeugt Code in einem zweistufigen Ansatz, der visuell begründete Programm-Synthese und Programmreparatur beinhaltet. Die erste Stufe führt multimodale LLM-Operatoren ein, die in visuellem Kontext handhaben und die 1) Konstruktion einer Textdarstellung des Leinwands, 2) konzeptuelle Gruppierung von Elementen und 3) Implementierung von Animationskodex. Die zweite Stufe unseres Ansatzes führt eine Technik für visuell begründete Programmreparatur ein, die LLMs hilft, zu überprüfen, was sie gegen das ursprüngliche Layout und Debug Unterschiede in einer Unsere Beiträge sind wie folgt: • LogoMotion, ein LLM-System, das visuell zugrunde liegende Codegeneration verwendet, um automatisch Logo-Animationen aus einem PDF zu generieren. Das System identifiziert den visuellen Inhalt in jeder Schicht, deutet die primären und sekundären Elemente ein und erstellt Gruppen von Elementen. • Visuell zugrunde liegende Programmreparatur, ein Mechanismus, der es dem LLM ermöglicht, visuelle Fehler innerhalb seines erzeugten Animationscodes automatisch zu erkennen und zu debuggen, wodurch eine Feedback-Schleife zwischen dem von LLM erzeugten Code und seinen visuellen Ausgängen geschaffen wird. • Eine technische Auswertung von 276 Animationen zeigt, dass im Vergleich zu Canva Magic Animate und einer ablatierten Version des Systems (ohne Stufen für Hierarchieanalyse und Designkonzeptvorschläge) die gesamte Pipeline von LogoMotion Animationen erzeugt, die inhaltlich bewusster sind. • Eine qualitative Bewertung von Anfängern, die zeigt, dass LogoMotion ihre gewünschte Animation schnell mit minimalem Reprompting erreichen kann. 
 
 Dieses Dokument ist unter der CC BY-NC-ND 4.0 DEED Lizenz verfügbar. Dieses Dokument ist unter der CC BY-NC-ND 4.0 DEED Lizenz verfügbar. Verfügbar im Archiv [1] Das Video https://youtu.be/Jo9opkMH7iY [2] Seite des Projekts: https://vivian-liu.com/#/logomotion

Part of HackerNoon's growing list of open-source research papers, promoting free access to academic material.

Read My Stories

Harnessing the magic of algorithms and data to make predictions, classify, and uncover hidden patterns.

mlmodel's blog

Dieses Audio ist in der Originalsprache der Geschichte produziert!

Verwandeln Sie statische Logos in dynamische Animationen mit AI

About Author

KOMMENTARE

Hängeetiketten

DIESER ARTIKEL WURDE VORGESTELLT IN

Related Stories

HackerNoon Decoded 2024: Celebrating Our Startups Community!

HackerNoon Decoded 2024: Celebrating Our Tech Stories Community!

HackerNoon Decoded 2024: Celebrating Our Management Community!

HackerNoon Decoded 2024: Celebrating Our Programming Community!

HackerNoon Decoded 2024: Celebrating Our Startups Community!

HackerNoon Decoded 2024: Celebrating Our Tech Stories Community!

HackerNoon Decoded 2024: Celebrating Our Management Community!

HackerNoon Decoded 2024: Celebrating Our Programming Community!

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps