In diesem Training befassen wir uns mit der systematisch Erstellung von Prototypen in Figma. Sobald die Kompexität der Screens und damit die Anzahl der benutzten Elemente zu nimmt, steigt auch die Gefahr, dass die Struktur des Projektes sich verschlechtert und irgendwann die Übersicht verloren geht.
Verstärkt wird die Problematik noch, wenn viele unterschiedliche Screens in dem Projekt hinzukommen und zu jedem Screen noch angepasste Screens für unterschiedliche Endgeräte oder Varianten.
Wir werden uns mit Konzepten, Techniken und Funktionen von Figma beschäftigen, die uns dabei helfen systematische, gut strukturierte und konsistente Prototypen zu erstellen.
In diesem Figma-Video wird Schritt für Schritt ein dynamisches Veranstaltungs-/Stundenplan-Layout aufgebaut. Zunächst wird eine Colorcode-Komponente inklusive Varianten erstellt. Anschließend werden mithilfe von Auto Layout strukturierte Textfelder für Wochentage und Uhrzeiten sowie für Veranstaltung und Lehrende angelegt. Danach werden Colorcode-Komponente und Haarlinie integriert, ein Profilbild der Lehrperson eingefügt und eine Veranstaltungsliste erstellt. Zum Schluss wird gezeigt, wie die Elemente automatisch mit Inhalten aus Google Sheets befüllt werden, sodass Aktualisierungen schnell übernommen werden können.