Wie man ein effektives Basislayout entwirft
  • 01 Nov 2022
  • 2 Minuten zu lesen
  • Mitwirkende

Wie man ein effektives Basislayout entwirft


Übersicht

Hinweis

Bevor Sie diesen Artikel lesen, vergewissern Sie sich, dass Sie mit"How to Use a Base Layout" vertraut sind

Das Basislayout ist das Herzstück der Formatierung Ihrer Anwendung. Wenn Sie die Formatierung Ihres Basislayouts richtig hinbekommen, können Sie die Entwicklung der einzelnen Schritte optimieren.

Wie man ein effektives Basislayout entwirft

Wenn Sie eine App entwerfen, sollten Sie als erstes entscheiden, wie Ihr Basislayout aussehen soll.

Ein "Basislayout" ist ein Design, das auf jeden Schritt in der App angewendet wird. Alle Widgets, die dem Basislayout hinzugefügt werden, sind standardmäßig in allen nachfolgenden Schritten vorhanden.

Sie können auf das Basislayout unten links im App-Editor zugreifen.

HINWEIS

Wenn dem Basis-Layout Trigger hinzugefügt werden, ist der Trigger auf alle Schritte in der App anwendbar. Sie können jedoch nicht von einem anderen Schritt als dem Basis-Layout aufgerufen werden.

Da das Basis-Layout die Vorlage für die restlichen Schritte in Ihrer App ist, ist es sinnvoll, Basis-Layout-Widgets an der Peripherie des Schrittes anzuordnen.

Die folgenden Schritte skizzieren die Erstellung eines Beispiels für ein Basislayout und geben Ihnen eine Vorstellung davon, wie Sie Ihr eigenes Layout gestalten können.

1. Entscheiden Sie, welche Widgets Sie auf jedem Schritt (oder fast jedem Schritt) benötigen.

Einige sinnvolle Beispiele sind Schaltflächen, die zum nächsten oder vorherigen Schritt führen, ein Firmenlogo und ein Timer, der anzeigt, wie viel Zeit ein Mitarbeiter auf jedem Schritt verbringt.

2. Entscheiden Sie, wo diese Basis-Layout-Widgets platziert werden sollen.

Ein guter Ausgangspunkt ist die Erstellung einer Kopf- und/oder Fußzeile für Ihre App. Unten sehen Sie ein visuelles Layout für eine Kopf- und eine Fußzeile, das mit Hilfe von Rechtecken, Schaltflächen, Text und einem hochgeladenen Bild erstellt wurde.

3. Lassen Sie bei jedem Schritt genügend Platz für neue Inhalte

Die Widgets auf dem Basislayout sollten idealerweise so angeordnet werden, dass in der Mitte des Schritts möglichst viel visuelle Fläche zur Verfügung steht.

4. Notieren Sie, welche Widgets Sie aus dem Basislayout freischalten wollen oder müssen

Wenn Sie ein Basislayout entwerfen, ist es wichtig, dass Sie sich merken, welche Widgets Sie in bestimmten Schritten freischalten müssen. Versuchen Sie, diese Widgets visuell von anderen Aspekten des Basislayouts zu trennen, um weniger drastische Übergänge zu schaffen.

5. Berücksichtigen Sie die Erweiterbarkeit des Basislayouts

Der letzte Punkt, den Sie bei der Gestaltung eines Basislayouts berücksichtigen sollten, ist die Erweiterbarkeit des Designs. In der Beispiel-App oben könnte die Schaltfläche "Menü" den größten Teil der Breite der Fußzeile einnehmen. Wenn Sie jedoch ein weiteres Widget hinzufügen möchten, müssten Sie das Design erheblich umgestalten. Wenn Sie Platz für zusätzliche Widgets lassen, müssen Sie in Zukunft weniger umgestalten.


Haben Sie gefunden, wonach Sie gesucht haben?

Sie können auch auf community.tulip.co Ihre Frage stellen oder sehen, ob andere mit einer ähnlichen Frage konfrontiert wurden!


War dieser Artikel hilfreich?