easySYS Relaunch: App & Webseite in einem neuen Look (Teil 1)
Was gilt es zu beachten, wenn eine Business Applikation ein neues User Interface erhält? Wir haben diesen Sommer die Benutzeroberfläche unserer Cloud Business Lösung für KMU, easySYS, komplett überarbeitet.
Eine Applikation entsteht
Beim Relaunch von easySYS standen die drei Punkte im Zentrum, welche bei allen Softwareprojekten von iBROWS von grosser Bedeutung sind:
- Interaktionsdesign / Interfacedesign
- Visuelle Gestaltung
- Technische Umsetzung
Das Zusammenspiel dieser drei Komponenten entscheidet schlussendlich, ob eine Applikation, egal ob Business App oder kleine Webseite, beim Publikum ankommt oder nicht. Oft können Anwender von Softwareprogrammen oder Apps gar nicht erklären, weshalb etwas nicht gefällt. Meistens liegt es daran, dass die drei oben erwähnten Punkte nicht miteinander harmonieren. Durch die jahrelange Erfahrung im konzipieren und entwickeln von Applikationen hat sich iBROWS in diesem Bereich ein umfangreiches Knowhow angeeignet, welches jeweils direkt in die Projektarbeit einfliesst.
Das neue easySYS im Überblick
Interaktionsdesign / Interfacedesign
Im Rahmen des Interaktionsdesign werden die Interaktionen zwischen dem Benutzer und der Applikation so ausgestaltet, dass ein positives Benutzererlebnis geschaffen wird.
Im Rahmen des Interfacedesigns wird dabei durch das identifizieren von optimalen Handlungsschritten und logischer Informationsaufbereitung eine möglichst intuitive und positive Erfahrungen ermöglicht. Bei der Neugestaltung des easySYS-Erlebnis wurde der Schwerpunkt bewusst auf die Disziplin des Interaktionsdesgins gelegt. Ziel dabei war die Arbeit mit easySYS noch einfacher und effizienter zu gestalten. Dabei steht nicht die Software im Vordergrund, sondern die Person, welche mit der Software arbeitet.
User Centred Design
Eine Applikation ist nie Selbstzweck, sondern hilft Menschen gewisse Aufgaben effizienter und besser zu erledigen. Deshalb stehen am Anfang eines Projektes auch nie Funktionen im Zentrum, sondern der Benutzer und dessen Aufgaben bzw. Bedürfnisse
Kennt man die Benutzer einer Applikation sowie die Aufgaben, welche die Software unterstützen soll, geht es ans eigentliche Interfacedesign. Neben sehr softwarespezifischen Elementen welche von Projekt zu Projekt stark variieren, gibt es auch die nachfolgenden Grundregeln, welche stets beachtet werden sollten:
Konsistenz
Ähnliche Interaktionen sollten auch ähnlich gestaltet sein: Die Einstellungen in der Kontakt- sowie in der Projektverwaltung befinden sich deshalb am gleichen Ort. Beide Module verwenden auch das gleiche Symbol für die gleiche Funktion. Dies hilft dem Benutzer dabei, sich einfacher in der Applikation zurecht zu finden und somit effizienter zu arbeiten.
Kontextabhängige Informationen
Eine Software soll zum richtigen Zeitpunkt dem Nutzer die passenden Informationen bereithalten. Somit kann sich der Benutzer aufs Wesentliche konzentrieren und wird gleichzeitig im Arbeitsablauf optimal unterstützt. Wie das untenstehende Beispiel zeigt, sind z.B. in der easySYS Auftragsverwaltung die Optionen zu einem Angebot jeweils abhängig vom aktuellen Status.
Visualisierungen
Gerade in komplexeren Applikationen häufen sich schnell eine Vielzahl von Informationen an. Die grafische Aufarbeitung dieser Informationen hilft dabei, einen Überblick über die Datenmenge zu erhalten und wichtige Schlüsse zu ziehen. So wird in der überarbeiteten Projektübersicht zum Beispiel der Status des Projektes anhand von Grafiken verständlich vermittelt:
Auf Bestehendem aufbauen
Gewisse Verhaltensmuster und Standards sind bei der Bedienung von Applikationen so verbreitet, dass es hilfreich ist, auf diesen Standards aufzubauen. Hierzu gehört z.B. das Ampelsystem zur Vermittlung des Status oder das Papierkorb-Symbol zum Löschen von Dokumenten. Das Verwenden solcher Elementen hilft dem Benutzer, sich einfach zu orientieren und sich in einer neuen Softwareumgebung heimisch zu fühlen.
Visuelle Gestaltung
Bei der visuellen Gestaltung ist vieles Geschmacksache: Ein Design gefällt oder gefällt eben nicht. Trotzdem gibt es auch hier gewisse Grundregeln, welche es zu beachten gilt:
Hierarchien schaffen
Mit der grafischen Gestaltung können Hierarchien geschaffen und Strukturen definiert werden. Wichtige Inhalte nehmen mehr Platz ein, weniger wichtige dementsprechend weniger oder werden erst bei Bedarf eingeblendet. Zusätzlich können durch die visuelle Gestaltung zusammengehörende Informationen optisch gebündelt werden.
Farbcodes verwenden
Mit farblichen Akzenten können zusätzliche Informationen vermittelt werden. Eine grüne Statusmeldung lässt den Benutzer wissen, dass eine Aktion erfolgreich ausgeführt worden ist, eine rote Meldung, dass etwas nicht optimal verlaufen ist. Zusätzlich lassen sich Benutzer mit farblichen Hervorhebungen auch führen. Der sogenannte "Call-to-action" Button, der den Nutzer innerhalb eines Prozessschrittes auf die weiteren Möglichkeiten hinweist, ist hierfür wohl das prominenteste Beispiel.
Fazit
Ein grosser und sehr wichtiger Teil der Softwareentwicklung ist das Verständnis für den Benutzer der Software sowie dessen Bedürfnisse. Nur so kann vermieden werden, dass mit einer neuen Applikation mehr Probleme geschaffen als gelöst werden.
Wie das neue easySYS auf technischer Ebene erneuert worden ist, erläutern wir im zweiten Teil dieses Artikels nächste Woche.


