Mobile-App-Designs verbessern die Benutzerzufriedenheit

Mobile-App-Designs verbessern die Benutzerzufriedenheit, indem sie es jedem Nutzer ermöglichen, das Aussehen der App nach seinen persönlichen Vorlieben anzupassen. Eine Möglichkeit, mehrere Designs in Apps zu implementieren, die Daten darstellen und visualisieren, besteht darin, den Nutzern eine Auswahl an Farbpaletten für Diagramme und Grafiken anzubieten. MobileTogether verwendet eine Kombination aus intuitiver Benutzeroberfläche mit Drag-and-Drop, der leistungsstarken visuellen Programmiersprache Action Tree zur Ereignisverarbeitung und standardisierter funktionaler Programmierung für die Datenauswahl und -verarbeitung. Entwickler nutzen MobileTogether täglich, um elegante, plattformübergreifende Anwendungen mit ansprechenden Diagrammen und Grafiken in allen gängigen Formaten zu erstellen.

Die Haupteinstellungen für die Diagrammkonfiguration ermöglichen es Entwicklern von mobilen Anwendungen, aus vier vordefinierten Farbpaletten zu wählen oder sogar eine eigene Farbpalette für Diagramme und Grafiken zu definieren, während sie eine App entwickeln. In Kombination mit den Anzeigemodi "dunkel" und "hell" entstehen so zehn verschiedene Möglichkeiten zur individuellen Gestaltung der Anzeige. Anstatt eine bestimmte Farbe während der Entwicklung vorzugeben, können Entwickler die Funktionen von MobileTogether nutzen, um den Benutzern die Auswahl zu überlassen. Sehen wir uns ein Beispiel an.

Das Bild unten zeigt den Dialog zur Auswahl des Farbschemas für die mobile Anwendung sowie ein Diagramm aus einer mobilen App, das Produktionsdaten für Solaranlagen auf Dächern anzeigt.

Der Entwickler hat im Dialogfenster für die Diagrammeinstellungen ein benutzerdefiniertes Farbschema zugewiesen. Dabei wird der Hintergrundbereich des Diagramms in Orange gefüllt, während die Balken blau sind. Wenn das Diagramm zusätzliche Elemente enthält, würden die nächsten Farben Grün, Gelb, Violett usw. sein.

Der Entwickler konnte aus dem Dropdown-Menü eines der vordefinierten Farbdesigns auswählen

Erstellung von Designs für mobile Anwendungen

Schauen wir uns eine Strategie an, um Benutzern auf jedem mobilen Gerät die Möglichkeit zu geben, ein Farbschema auszuwählen, wenn die App ausgeführt wird. Diese App verfügt bereits über eine Einstellungsseite, was ein natürlicher Ort ist, um eine Auswahl für verschiedene Designs zu integrieren. Wir können damit beginnen, eine Tabelle mit Radiobuttons und Farbmustern für jedes Farbschema zu erstellen. Hier ist ein Beispiel für die fertige Tabelle im MobileTogether Designer:

MobileTogether unterstützt alle bekannten Auswahlmechanismen. Beispielsweise erscheint ein Kombinationsfeld direkt über der Tabelle. Wir haben eine Reihe von Radiobuttons für die Gestaltung von mobilen Anwendungen gewählt, um alle Farboptionen gleichzeitig anzuzeigen.

Die Diagramme in dieser App enthalten jeweils nur ein oder zwei Elemente, sodass jedes Farbpaar die ersten beiden Farben in der Liste für jedes Schema darstellt. Hier ist ein Ausschnitt derselben Ansicht auf der Seite "Einstellungen" im Fenster des MobileTogether-Simulators:

Der Hauptdialog zur Diagrammeinstellung ermöglicht es Entwicklern, schnell das optimale Diagramm zur Visualisierung nahezu jedes Datensatzes zu erstellen, einschließlich Flächendiagrammen, Balkendiagrammen, Kerzendiagrammen, Kreisdiagrammen und Liniendiagrammen. Diagrammtypen können sogar in Ebenen kombiniert werden. Das im obigen Beispiel gezeigte Monatsproduktionsdiagramm ist ein Diagramm mit mehreren Ebenen, wobei ein Balkendiagramm darüberliegend dargestellt wird.

Aber jede einzelne Diagrammeigenschaft kann auch als Ergebnis eines XPath-Ausdrucks definiert werden, der während der Ausführung der Anwendung verarbeitet wird. Einstellungen, die im Dialog "Dynamische XPath-Einstellungen" vorgenommen werden, überschreiben die ursprünglichen Grundeinstellungen des Diagramms.

Der Dialog "Dynamische XPath-Einstellungen" ermöglicht es uns, das Farbschema für jedes Diagramm innerhalb des XML-Elements mit dem Namen "graphColorBase" festzulegen. Die Tabelle mit den Optionsfeldern auf der Seite "App-Einstellungen" weist dem Element "graphColorBase" einen der folgenden String-Werte zu: "Standard", "Graustufen", "Farbig", "Pastell" oder "Benutzerdefiniert".

Hier sind Screenshots der fertigen App, die die Auswahl von Designs für mobile Anwendungen auf einem Android-Smartphone im Dunkelmodus zeigen:

Und Beispiele für Farbschemata in Schwarzweiß und im Standardmodus auf einem iPhone im hellen Modus:

Das Graustufen-Farbmodell könnte für Nutzer mit Farbsehschwäche ideal sein!

Werfen Sie einen Blick auf unser MobileTogether Video-Demonstrationenmehr Beispielanwendungenoder sogar das Online-Handbuch für eine detaillierte Übersicht über alle Informationen zu MobileTogether. Wenn Sie bereit sind, die Benutzerzufriedenheit mit mobilen App-Designs in Ihren eigenen plattformübergreifenden Anwendungen zu verbessern, Laden Sie den MobileTogether Designer herunter.