17
Case Study: Benutzungsfreundli ches GUI Design mit .NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID) November 2009 Tomas Hansson, Heiko Lewandowski, Bernd Wiesenauer Veröffentlicht unter creative commons by-nd

Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

Embed Size (px)

Citation preview

Page 1: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

Case Study: Benutzungsfreundliches GUI Design mit .NET WPF Rowa Automatisierungssysteme GmbH inZusammenarbeit mit der User Interface Design GmbH (UID)

November 2009Tomas Hansson, Heiko Lewandowski, Bernd Wiesenauer

Veröffentlicht unter creative commons

by-nd

Page 2: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

2 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Abstract: UID gibt einem automatisierten Lagersystem ein neues Gesicht

Eine hochmoderne Hardware mit einem wenig attraktiven User Interface – beim intelligenten Apotheken-Lagersystem Vmax von Rowa passten GUI und Hardware nicht gut zusammen.

Eine Neuimplementierung der GUI sollte dieses Problem beheben.

Die Fragen: Wie harmonieren die neue GUI und das bisherige Backend-System? Wie kann das neue Design einfach auf die gesamte Produktfamilie übertragen werden?

Um diese Herausforderungen in einem engen zeitlichen Rahmen zu meistern, setzte UID auf .NET WPF.

Vom Konzept über das Design bis hin zur Implementierung – durch die gemeinsame Sprache XAML war der benutzerzentrierte Gestaltungsprozess noch effizienter.

Das Ergebnis überzeugt: Auf der EXPOHARM (24.-27.09.2009) bestätigt die positive Resonanz die hochwertige Qualität des Rowa Vmax.

Page 3: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

3 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Die Aufgabe: Neuimplementierung einer GUI mit WPF

Neuimplementierung der GUI mit WPF für das intelligente Apotheken-Lagersystems Rowa Vmax

Intuitives Bedienkonzept, das auf die Anforderungen der Nutzer abgestimmt und für die Touch-Verwendung optimiert ist

Ansprechendes Design, das den hohen Qualitätsanspruch auf dem Gesicht der Maschine, dem User Interface, wiederspiegelt

Die Herausforderungen: ein komplexes Szenario mit mehreren Clients

Spezielle Anforderungen:- Einfache Umsetzung des GUI Designs bei der gesamten

Produktfamilie- Verbindung zum bestehenden Backend-System bleibt

erhalten

Page 4: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

4 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Die Lösung: Hand in Hand für eine neue GUI

Entwicklung nach dem benutzungszentrierten Gestaltungs-prozess und SCRUM durch ein multidisziplinäres Team aus Usability Engineers, Software Engineers und Designern

Grundlage: Kontextinterviews mit repräsentativen Nutzern, die Aufschluss über die Bedürfnisse der Zielgruppe gaben

Gestalten und Erfahrbar machen des Interaktionsdesigns mit Handskizzen und Wireframes

Screen- und Icondesign auf Basis eines Moodchart-Workshops Effiziente Software-Entwicklung durch die Bereitstellung der

Design-Objekte und der Interaktionselemente in XAML Entwicklung einer .NET-Oberfläche mit WPF unter Einsatz von

- Model-View-ViewModel-Pattern- Microsoft Expression Blend- Microsoft Visual Studio 2008- DataBindung und DataTemplates

Page 5: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

5 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Das Ergebnis: Intuitive Bedienung, moderner Look und gesteigerte Software-Qualität

Optimale und intuitive Bedienbarkeit durch- eine übersichtliche Struktur der Oberfläche und eine gut

durchdachte Navigation, welche die Orientierung erleichtern- eine verbesserte Visualisierung von Arbeitsabläufen, die zu einer

idealen Nutzerführung beiträgt Funktionales und gleichzeitig ästhetisch ansprechendes Design,

welches die Formen und Farben der Hardware aufgreift Zwei farblich unterschiedliche, von Nutzer frei wählbare Skins Durch die Verwendung von .NET WPF / Microsoft Expression

Blend wurde eine Kostenersparnis von 30 Prozent erreicht Exakte Einhaltung der geplanten Entwicklungszeit dank SCRUM Gesteigerte Software-Qualität durch

- die Auslagerung der Informationen über das Anwendungsdesign in einer Resource Dictionary

- Unit Tests, mit denen dank des Model-View-View-Models die GUI weitreichend automatisiert getestet werden kann

Page 6: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

6 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Der Ausblick

Überprüfung der Nutzungsqualität durch einen Usability Test und anschließende Optimierung

Spezifikation und Implementierung weiterer GUI-Elemente in enger Zusammenarbeit von Rowa und UID

Implementierung des GUI Designs bei weiteren Rowa SystemenEinheitliches und modernes Look & Feel bei der gesamten

Produktfamilie

Page 7: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

7 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Appendix

Bilder und Screens Firmenportrait

- der Rowa Automatisierungssysteme GmbH - der User Interface Design GmbH (UID)

Page 8: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

Bilder und Screens

Page 9: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

9 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Rowa Vmax in der hellen Farbvariante

Page 10: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

10 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Rowa Vmax mit neuem User Interface

Page 11: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

11 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Mit dem Dashboard sind wichtige Statusinformationen auf einen Blick erfassbar

Page 12: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

12 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Die Eingaben bei der Wareneinlagerung erfolgen über Touch-Screen

Page 13: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

13 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Mit der Produktübersicht ist der Lagerbestand optimal einsehbar

Page 14: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

Firmenportraits

Rowa Automatisierungssysteme GmbH Firmenportrait der User Interface Design GmbH

Page 15: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

15 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Firmenportrait der Rowa Automatisierungssysteme GmbH Mit über 2.750 verkauften Systemen in 20

Ländern ist Rowa Marktführer in Europa für automatisiertes Warenhandling in Apotheken.

Über 250 Mitarbeiter am Firmensitz in Kelberg Insgesamt 23 Service Stützpunkte in

Deutschland, Österreich und der Schweiz Entwicklung innovativer Automatisierungs-

lösungen, die optimal auf die Bedürfnisse der Apotheken abgestimmt sind

Quelle: www.rowa.de

„UID hat uns bei unserem Weg zu einer neuen GUI professionell begleitet. Das neue User Interface gibt der Rowa Vmax ein einzigartiges, ansprechendes Gesicht und wird der technischen Qualität von Rowa mehr als gerecht. Es sichert uns in Verbindung mit dem Relaunch unserer Corporate Identity und dem neuen, hochwertigen Produktdesign einen klaren Wettbewerbsvorteil.“ Dirk Wingenter, Geschäftsführer von Rowa

Page 16: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

16 © User Interface Design GmbHBenutzerfreundliches GUI Design mit .NET WPF November 2009

Firmenportrait der User Interface Design GmbH

Ein führendes Dienstleistungs- und Beratungsunternehmen für die benutzerzentrierte Entwicklung interaktiver Systeme

Über 65 Experten in einem multidisziplinären Team aus Psychologen, Informatikern, Designern und Ingenieuren

Geschäftsstellen in Ludwigsburg, Dortmund, Mannheim und München

Unsere Branchen: Automotive, Consumer, Enterprise, Industry, Medical und Web

„Die Zusammenarbeit mit dem Rowa-Team war hervorragend. Dank des Model-View-ViewModels waren die Schnittstellen zwischen den Teams klar definiert, so dass eine reibungslose Kooperation möglich war.“Heiko Lewandowski, Leiter Software Engineering bei UID

Page 17: Case Study: Benutzungsfreundliches GUI Design mit.NET WPF Rowa Automatisierungssysteme GmbH in Zusammenarbeit mit der User Interface Design GmbH (UID)

Besuchen Sie uns! www.uid.com

User Interface Design GmbHMartin-Luther-Straße 57-5971636 Ludwigsburg+49 (0)7141-377 00-0+49 (0)7141-377 [email protected]