Lerne, wie du wiederverwendbare Button-Komponenten in Figma erstellst, die nahtlos in deinem gesamten E-Mail-Designsystem funktionieren. Dieses Tutorial führt dich durch die Erstellung von Button-Varianten, das Verschachteln von Komponenten und die Verwendung des Email Love Figma Plugins, um deinen E-Mail-Produktionsworkflow zu optimieren.
Was du lernen wirst:
Wie man Button-Komponenten mit konsistentem Padding und Styling erstellt
Einrichten von Button-Varianten (verschiedene Farben, Stile, Umrandungen)
Verschachteln von Button-Komponenten innerhalb deines Designsystems
Globale Updates vornehmen, die sich auf alle Vorlagen auswirken
Speichern von benutzerdefinierten Buttons im Email Love Figma Plugin
Zeitstempel:
0:00 - Einführung
0:45 - Erstellen deiner ersten Button-Komponente
2:25 - Verständnis von Button-Padding und Skalierung
4:05 - Einrichten von Button-Varianten
5:36 - Verwendung der Asset-Bibliothek
7:02 - Anwendung von Buttons in deinem Designsystem
9:14 - Speichern von Buttons im Plugin
Warum das wichtig ist:
Buttons als Figma-Komponenten einzurichten bedeutet, dass du deinen Button-Stil einmal aktualisieren kannst und die Änderung überall in deinem Designsystem sichtbar wird. Kein manuelles Aktualisieren von Dutzenden von E-Mail-Vorlagen mehr, wenn sich deine Markenrichtlinien ändern.
Ressourcen:
Über Email Love:
Email Love hilft Marketing-Teams, E-Mails in Figma zu gestalten und sie als produktionsbereiten Code für jeden ESP (Iterable, Braze, Salesforce Marketing Cloud, HubSpot, Klaviyo und mehr) zu exportieren. Wir kombinieren leistungsstarke Design-Tools mit über 15 Jahren Erfahrung im E-Mail-Marketing.
Fragen? Hinterlasse einen Kommentar unten oder kontaktiere uns auf Discord.
Folge Email Love: