Advanced Prototyping


Heute beschäftigen wir uns mit dem Thema Advanced Prototyping. Hilfestellungen bekommen Sie in dem dazu vorgesehenen Training.


Aufgabe 1

Laden Sie das Materialpaket herunter und importieren Sie das enthaltene Projekt in Figma.

Zunächst geht es darum die Struktur der vorhandenen Views und darin enthaltenen Elemente zu verbessern. Beachten Sie dabei folgende Punkte:

  • Gruppieren Sie Elemente die logisch zusammen gehören und geben Sie den Gruppen und ggf. den einzelnen Elementen aussagekräftige Namen.
  • Sortieren Sie die Gruppen und Elemente in der Ebenenleiste nach einem bestimmten Schema.
    Eine Möglichkeit ist, die Elemente in der Reihenfolge, wie sie auf der Zeichenfläche vorkommen, zu sortieren, und zwar von oben nach unten.
  • Erzeugen Sie Komponenten und Varianten von Komponenten für Elemente, die mehrfach vorkommen und Styles die mehrfach verwendet werden.
    Diese helfen dabei ein konsistentes Layout, auch über mehrere Views hinaus, zu ermöglichen.

Aufgabe 2

Nun soll für die bestehenden Views ein Layout für das Querformat erzeugt werden.

Konfigurieren Sie die Elemente so, dass sie flexibel auf Größenänderungen der Views oder der Elemente selbst reagieren. Duplizieren Sie daraufhin die Frames, stellen Sie sie auf das Querformat ein und justieren Sie die darin enthaltenden Elemente entsprechend der neuen Ausrichtung.