Bewährte Praktiken für das App-Design
  • 05 Aug 2024
  • 2 Minuten zu lesen
  • Mitwirkende

Bewährte Praktiken für das App-Design


Artikel-Zusammenfassung

x:::(Info)
Before diving into design best practices, erfahren Sie, wie user research{target=_blank} ist die Grundlage für ein erfolgreiches App-Design, das es Ihnen ermöglicht, die effektivsten Apps für Ihren Betrieb zu entwickeln und den maximalen Nutzen aus Ihrer Zeitinvestition zu ziehen.

Dieser Artikel bezieht sich auf zwei Tulip Library Apps: App Design Templates{target=_blank} und App Design Best Practices{target=_blank}.
:::

Gutes Design ist kontextabhängig, d.h. Entscheidungen werden unter Berücksichtigung der spezifischen Bedürfnisse Ihrer Branche, Ihrer Mitarbeiter und Ihres Prozesses getroffen und ändern sich je nach Zweck und Funktion der einzelnen Anwendungen und Schritte. Bewährte Verfahren für Life Sciences{target=_blank} Anwendungen unterscheiden sich von den Best Practices für das allgemeine Fertigungsdesign.

In allen Branchen ist es jedoch sinnvoll, die Layouts und Farbschemata von Anwendungen zu standardisieren und nach Möglichkeit klonbare Komponenten zu erstellen. App-Vorlagen und Styleguides reduzieren die Anzahl der Entscheidungen, die App-Entwickler zu einem bestimmten Zeitpunkt treffen müssen, während eine Komponentenbibliothek die Nacharbeit reduziert und eine schnellere App-Erstellung ermöglicht.

Schauen Sie sich für den Anfang unsere Designvorlagen unter Tulip Library{target=_blank} und nutzen Sie die folgenden Best Practices, um diese Vorlagen so anzupassen, dass Sie intuitive und navigierbare Apps erstellen können.

Tulip Library Design Template Page 2.png{width="500" height="315"}

App-Vorlagen standardisieren

Ein einheitliches App-Layout in Ihrem Unternehmen ist nicht nur ästhetisch ansprechend. Durch die Erstellung wiedererkennbarer Layouts und die gezielte Auswahl von Farben, die eine bestimmte Bedeutung vermitteln, können Sie den Schulungsbedarf für die Endbenutzer erheblich reduzieren.

Sie können die folgenden Tulip Library templates{target=_blank} um den Anfang zu machen.

Template - Colors.png
Standardisierte Farbschemata sorgen dafür, dass Anwendungen intuitiv sind und die Benutzer schnell und einfach durch die Bildschirme navigieren können.

Template - Typography.png
Die Schriftgröße sollte einheitlich und gut lesbar sein. Passen Sie die Schriftgröße an die Auflösung Ihrer Interface (Anzeigegerät) an.

Template - Buttons.png
Primäre Aktionsschaltflächen sollten die fetteste Farbe auf dem Bildschirm haben und nicht mit dem Hintergrund verschmelzen. Sie möchten nicht, dass die Benutzer Zeit mit der Suche nach dem Gewünschten verschwenden.

Template - Button Icons.png
Durch das Hinzufügen von Symbolen zu Schaltflächen wird ein visueller Kontext zu der von der Schaltfläche ausgeführten Aktion geschaffen.

Erstellen Sie eine Komponentenbibliothek

Die Erstellung von Komponenten oder Vorlagen, die App-Entwickler mühelos kopieren und einfügen können, beschleunigt die Entwicklung erheblich. Ziehen Sie in Erwägung, eine Bibliothek mit den folgenden häufig verwendeten Anwendungskomponenten zu erstellen:

  • App-Basislayouts (z. B. Tablet vs. Mobile)
  • Schritt-Layouts (z. B. Container- und Panel-Ausrichtung)
  • Navigationsleisten oben und unten
  • Menüleisten
  • Routing- oder Terminal-Bildschirme
  • Dashboards
  • Formulare (z. B. Ereignis- oder Fehlerformulare)
  • Prüflisten
  • Messdatenerfassung
  • Gemeinsame nebeneinander stehende Informationen (z. B. erscheint eine interaktive Tabelle oft neben eingebetteten Tabellendatensätzen)

Template - Table and Table Records.png
Beispiel eines 2-Panel-Bildschirms, bei dem die Benutzer Daten in einer Tabelle anzeigen und Felder über ein Formular bearbeiten können

Template - Side by Side.png
Beispiel eines Bildschirms mit 2 Feldern, bei dem die primären Informationen in das Feld ganz links eingegeben werden

Template - Modals.png
Beispiel für einen modalen Schritt, der die volle Aufmerksamkeit der Benutzer auf die aktuelle Aufgabe lenkt

Template - Dashboard.png
Beispiel für ein Dashboard, das Analysen anzeigt

Befolgen Sie bewährte Designpraktiken

Entdecken Sie Einblicke von Experten in die Gestaltung von Apps im Tulip Library's App Design Best Practices{target=_blank} Leitfaden. Tauchen Sie ein in die Tipps zu Farbe, Text und Widgets, um die Attraktivität Ihrer App und die Benutzererfahrung zu verbessern.

Farbe

Color 1.jpg

Color 2.jpg

Color 3.jpg

Color 4.jpg

Text

Text 1.jpg

Text 2.jpg

Text 3.jpg

Text 4.jpg

Text 5.jpg

Text 6.jpg

Widget

Widget 1.jpg

Widget 2.jpg

Widget 3.jpg

Widget 4.jpg

Widget 5.jpg

Widget 6.jpg


War dieser Artikel hilfreich?