ERGOSIGN Blog

In unserem Icon-Shop findet sich ab sofort ein neues kostenloses Icon-Päckchen:

Im Glossy-Stil unserer Stock Icons gibt es nun gratis Icons für Twitter, iPhone, Business Man und Fill (in den Größen 16px, 24px, 32px, 48px sowie 128px).

Zu den Gratis Icons in unserem Icon Shop...

Da die Einführung agiler Techniken massiven Einfluss auf die Art und Weise der Zusammenarbeit von Management- und Entwicklungsteams in einem Projekt zur Folge hat, werden natürlich auch die UCD-Aktivitäten und deren Anwendungsmöglichkeiten in einem agilen Projekt davon beeinflusst.

Die Formen der Zusammenarbeit variieren von Projekt zu Projekt, um den Bedürfnissen des jeweiligen Kunden gerecht zu werden. Von einer engen Zusammenarbeit zwischen Designern und dem Entwicklungs-Team vor Ort bis hin zu Designern, die nur bei Bedarf vom Projekt-Team hinzugezogen werden, um Wireframes oder Screen-Designs den Anforderungen entsprechend zu liefern, ist eine weite Spanne der Zusammenarbeit möglich. Die letztliche Vorgehensweise hängt stark von einigen Faktoren ab, die für jedes Projekt separat festgelegt werden müssen (z.B. Re-Design vs. Neu-Entwicklung, In-house-Expertise, Vor-Ort-Präsenz des Teams oder Verfügbarkeit von Benutzern).

Prozess-Informationen

Abbildung 1: Design- und Entwicklungs-Track arbeiten parallel zusammen

Der agile Entwicklungsprozess erfordert eine entsprechende Anpassung der UCD-Techniken. Sowohl die vorhandene Dokumentation im Internet [siehe Weiterführende Literatur] als auch unsere Erfahrung belegen, dass eine Vorbereitung der Iterationen von elementarer Bedeutung ist, so dass zum Start einer Iteration wenigstens ein grober GUI-Entwurf als Richtungsvorgabe verfügbar ist. Dies bringt den großen Vorteil, dass solche Entwürfe als Diskussionsgrundlage in den Teams und in Gesprächen mit dem Produkt-Verantwortlichen genutzt werden können. Selbst eine Validierung der Entwürfe – bevor auch nur eine Zeile Code geschrieben wurde – ist z.B. mittels Paper-Prototyping mit Endanwendern möglich.

Die Dauer dieser Vorbereitungsphase hängt vom Umfang der Gesamt-Vision ab, die zu Beginn des Projektes festgelegt wurde, da sie das UI-Design einer Iteration stark beeinflussen kann (z. B. soll das UI in einem Dialog-Fenster oder in einem In-place-Element dargestellt werden?).

Wir empfehlen daher nachhaltig, die „Zyklus 0-Phase“ zu Beginn eines Projektes zu nutzen, um eine visuelle Darstellung der Vision auf Wireframe-Basis zu entwickeln, die als zentrales Leitmotiv genutzt werden kann. Dieses Vorgehen wird, insbesondere, wenn Sie mit verschiedenen Teams parallel arbeiten, das Risiko mindern, dass sich zwischen den Teams Konsistenz-Probleme ergeben oder in komplett unterschiedliche Richtungen entwickelt wird. Um jedoch sicherzustellen, dass diese Vision noch den Anforderungen entspricht, muss sie regelmäßig überprüft und gegebenenfalls angepasst werden.

Zusammensetzung der Teams

Die Zusammensetzung der Teams kann, wie bereits erwähnt, sehr stark von den Begleit-Faktoren des Projekts abhängen. Am wichtigsten ist jedoch, dass jedes Team über einen GUI-Verantwortlichen verfügt.

Abhängig von der jeweiligen Projektphase können einige Aufgaben in Hinsicht auf Design, Analyse und Testing parallel ablaufen, wie Abbildung 1 illustriert.

Abbildung 2: User research support group

Dies kann mithilfe einer „second-line“ User Research Support Group (siehe Abbildung 2) kompensiert werden, die Fragestellungen aus den Teams mit Endanwendern bespricht und die Ergebnisse zurückmeldet. Auf diese Weise erlangt das Support-Team einen guten Überblick über die verschiedenen UI-Projekte und kann seine Verbindungen zur User-Community nutzen, um Lightweight Usability-Tests zu organisieren.

Design-Scrum-of-Scrums

Zusätzlich hat sich ein „Design-Scrum-of-Scrums“ als sehr sinnvoll erwiesen, um die verschiedenen Design-Lösungen anderer Teams im Blick zu behalten. Das bedeutet , es sollten im Anschluss an die Stand-up-Meetings der Teams regelmäßige Meetings mit deren GUI-Verantwortlichen durchgeführt werden. Auf diesem Weg können die Designer unmittelbar über neue Komponenten, Layout-Schwierigkeiten oder Probleme mit der Gesamt-Vision informiert werden, die dann entsprechend dem Input der Teams angepasst werden kann.

UCD-Ergebnisse & Aufgaben, abhängig vom Projekt-Level

In einigen unserer bisherigen Projekte wurde ein WIKI eingesetzt, um Informationen zur Gesamt-Vision, zu verschiedenen Projekten und den gefällten Entscheidungen zu speichern. Sobald gewisse Aspekte des User Interface verankert sind (z.B. Icons, Farben, Interaktions-Pattern) kann ein WIKI ebenso dazu verwendet werden, nach und nach eine Sammlung von Richtlinien aufzubauen, die auf weitere Design-Entwürfe in anderen Releases angewandt werden können.

Die nachfolgenden Abschnitte werden etwas tiefer auf die vom jeweiligen Projekt-Level abhängigen UCD-Ergebnisse eingehen.

Projekt-Ebenen

Obwohl viele agile Methodiken eine häufige Einbeziehung oder Konsultierung von Endanwendern vorsehen, kann es manchmal schwierig sein, täglichen Zugang zu Benutzern zu bekommen. Ebenso problematisch kann es sein, wenn ein Benutzer die Last tragen muss, die komplette User-Community zu vertreten. Dies ist häufig ebenso wenig realistisch.

UCD-Aktivitäten wie z.B. eine User/Task-Analyse helfen zu verstehen, wie Endanwender ihre Arbeit tatsächlich ausführen und können das Projekt-Team beim Zusammentragen der Projekt-Anforderungen unterstützen.

Die gesammelten Anforderungen können nun in eine initiale Wireframe-Version des neuen Tools fließen, die zur Kommunikation der Vision innerhalb des Unternehmens, aber auch zur Verifikation bestimmter UI-Konzepte mit Benutzern verwendet werden kann. Der Fokus sollte dabei auf globale Aspekte des User Interface hinsichtlich Struktur und Interaktion gelegt werden. Die in den Wireframes visualisierten Informationen können im Anschluss ebenso dazu genutzt werden, die Gesamt-Applikation stufenweise in einzelne Bereiche für die unterschiedlichen Releases und Iterationen aufzuteilen.

Abbildung 3: Generisches Beispiel eines High-Level-Mock-up

Release Ebene

Die Visionen-Wireframes können nun in einer angepassten und weiter ausgearbeiteten Form dazu genutzt werden, den korrekten Scope und die Anforderungen eines Projekts auf Release-Ebene abzustecken (z.B. „Für das erste Release hätten wir gerne eine befüllte Navigation, wobei die verfügbaren Daten im Content-Bereich angezeigt werden“).

Abbildung 4: Release Mock-up mit Fokus auf Navigation and Content-Bereich

Diese Visualisierung kann auch für Entwicklungs-Teams bei der Aufwands-Abschätzung sowie für den Produkt-Manager bei der Priorisierung der Features einer solchen Lösung hilfreich sein.

Iterations-Ebene

Der Wireframe kann nun für jede Iteration eines Release in verschiedene Teilstücke zerlegt und im Detail beschrieben werden.

Abbildung 5: Iterations-Wireframe mit zusätzlichen Informationen

Auf Iterations-Ebene sollten Wireframes als eine leichtgewichtige Möglichkeit zur Dokumentation von Design-Entscheidungen gesehen werden. Es hat sich als sehr effizient herausgestellt, Screenshots auszudrucken und sie an die „Agile Wand“ des Projekt-Teams zu heften. Diese hat in vielen Projekten als sehr nützliche Anlaufstelle für Diskussionen rund um das Tool gedient.

Sobald das Design für eine Iteration finalisiert ist, kann der Designer Zeit in die Produktion der benötigten Assets wie Icons oder andere Arten von Grafiken investieren. Falls Entscheidungen getroffen werden, die Einfluss auf die Mock-ups der höheren Ebenen haben, so sollte das Design-Team darüber informiert werden und bei Bedarf die entsprechenden Mock-ups angepasst werden.

Selbstverständlich darf auch die Vorbereitung der nächsten Iterationen mit Hinblick auf User Research (siehe Abbildung 2) und Wireframes (siehe Abbildung 1) nicht vergessen werden zu erwähnen.

Fazit

Die zentrale Schlussfolgerung unserer Erfahrungen mit agilen Projekten ist die, dass es keinen einheitlichen Weg gibt, ein agiles Projekt durchzuführen. Beide Methodiken, UCD und Agile, müssen aneinander angepasst werden, um den optimalen Weg einer fruchtbaren Interaktion zu finden. Diese Anpassungen beruhen stark auf verschiedenen Faktoren, wie z.B. ob es sich um eine Produkt-Erweiterung oder eine Neu-Entwicklung handelt, ob In-House-Expertise vorhanden ist, ob Vor-Ort-Präsenz des Teams gegeben ist oder auch wie es um die Verfügbarkeit von Benutzern bestellt ist.

Aus unserer Sicht können UCD-Methoden, wie z.B. eine User/Task-Analyse mit dem Ziel zu Beginn Anforderungen zu sammeln, das Entwerfen von Wireframe-Mock-ups zur Validierung von Konzepten in sehr frühen Projekt-Phasen, sowie unsere Erfahrungen mit dem Testen von Software an verschiedenen Schritten des Projekts, der Entwicklung einfach zu bedienender Software in einem agilen Prozess einen echten Mehrwert bieten.

Wenn Sie gerne mehr darüber erfahren möchten, wie UCD-Methoden Ihr Projekt aufwerten können, kontaktieren Sie uns unter contact@ergosign.de.

Weiterführende Literatur

http://www.upassoc.org/upa_publications/jus/2007may/agile-ucd.html

http://www.devx.com/enterprise/Article/42156/1954

http://www.slideshare.net/LaneHalley/making-sense-of-ucd-and-agile

http://www.boxesandarrows.com/view/bringing-user

Einleitung

Steve Jobs betonte bei der iPad-Ankündigung Apples dezidierten Vorstoß in ein neues drittes Gerätesegment zwischen Smartphone und traditionellem Computer/ Laptop. Erklärter Zielkontext ist dabei - zumindest anfangs - der Heimbereich, in dem primär Content in Form von Webseiten, Fotos, Filmen und Büchern konsumiert wird.

Aus User Interface Designer-Sicht sind dabei vor allem die folgenden Aspekte spannend:

• Beim iPad bleibt man dem Interaktionsparadigma des iPhones treu: Bis auf den "Home" Button ist das Interface komplett touchbasiert. Die Größe des iPad-Displays bietet nun jedoch ausreichend Platz, dass Controls und Artefakt nicht mehr konkurrieren müssen, wie aktuell bei vielen Spielen auf dem iPhone.
• Die Verlockung ist gross, den aktuell eher passiven Charakter des iPads auch in aktivere, content-produzierende Szenarien zu lenken, was wiederum durch das reine Touchkonzept interessante Einschränkungen aufwirft. Insbesondere die Einschätzung, ab wann die Touch-Interaktion mit dem Gerät zum Beispiel bei der Text-Eingabe ineffizient und unergonomisch wird, ist dabei erfolgskritisch.
• Das iPad kann mittelfristig interessante Anwendungsszenarien im Heimbereich integrieren, die bisher - wenn überhaupt - isoliert durch einzelne Devices abgedeckt waren. Ad hoc fallen einem sofort Tasks wie E-Mails-Checken (z.B. bisher erledigt via Smartphone), Web-Browsen (z.B. bisher erledigt via Laptop), eBooks (z.B. bisher erledigt via Kindle) und Medienkonsum (z.B. bisher erledigt via HD-Recorder) etc...

Insgesamt repräsentiert das iPad viel auszuschöpfendes Potential, insbesondere für uns als User Experience Designer, deren graue Gehirnzellen seit Steves Keynote rotieren.

Im Folgenden stellen wir zwei Anwendungsszenarien vor, die den Vorteil eines solchen (integrierenden) Tablets im Heimbereich hervorheben, welches gegebenenfalls sogar von mehreren Familienmitgliedern geteilt werden kann.

(Disclaimer: Natürlich sind wir uns bewusst, dass es bereits vor dem iPad vergleichbare Geräte und Konzepte gab. Nur angesichts der Medienresonanz ist davon auszugehen, dass - genauso wie iPod und iPhone für einen fundamentalen Umbruch im Musik- respektive Smartphone-Business stehen - das iPad das Tablet-Business revolutionieren wird).

Anwendungsfall #1: Personalisiertes Radio für Vater Homer

Bisher schaltete Homer jeden Morgen direkt nach dem Aufstehen sein Radio an, um gute Musik gemischt mit Nachrichten und Wetterbericht zu hören. Doch meistens störte entweder die eher grenzwertige Musikauswahl der Moderatoren oder aber die mangelnde Häufigkeit der Nachrichten.

Mit unseren neuen radio.app kann nun dieses Angebot wesentlich verfeinert werden: Unzählige semantische Verknüpfungen durch freie Künstler-Tags, Nachbarschaften mit Leuten, die einen ähnlichen Geschmack haben sowie individuelle Nachrichten-Intervalle sind nur einige Funktionen.

Anwendungsfall #2: Interaktives Lernen für Tochter Lisa

Lisa findet die statischen Darstellungen in den Physik-Lehrbüchern zu abstrakt, infolgedessen richtig öde, was sich natürlich in den Noten widerspiegelt.

Mit unseren neuen learning.app kann sie nun alle Versuchsaufbauten perspektivisch betrachten, reinzoomen und als Film beliebig schnell ablaufen lassen.

Der Vorteil der Gestensteuerung liegt auch in diesem Szenario wieder (buchstäblich) auf der Hand: Neben der Manipulation der Darstellungsperspektive können auch - je nach Auflösungsstufe - unterschiedliche Detailinformationen angezeigt und sogar die Aufbauten in einer Art verändert werden, die der realen Unterrichtssituation entspricht.

Letztlich werden die physikalischen Zusammenhänge durch die natürliche Interaktion für Lisa direkt greifbar und schlüssig. Fehler im Aufbau werden direkt sowohl im Schema als auch in den Formeln durch Live-Simulation angezeigt.

ERGOSIGN unterstützt als Sponsor das UXcamp Europe 2010, welches vom 29. bis zum 30. Mai in Berlin stattfindet.

Im zeitgemäßen Barcamp-Format diskutieren, kollaborieren und präsentieren Designer aktuelle Themen aus allen UX-verwandten Disziplinen.

Die Teilnahme ist frei, man muss sich lediglich (rechtzeitig) über das Barcamp-Wiki registrieren.

Wir freuen uns auf spannende Sessions!

Prof. Dr. Dieter Wallach hält heute einen Vortrag zum Thema "HCI: Von der Theorie zur Praxis - und zurück" beim Informatischen Kolloquium des Hamburger Informatik-Forum e.V.

• Montag, 1. Februar 2010
• 17 Uhr c.t.
• Vogt-Kölln-Str. 30
  
• Konrad-Zuse-Hörsaal
• Gebäude B

Aus einer interdisziplinären Perspektive wird hierbei auf die wechselseitige Anregung von theoretischen Grundlagenarbeiten und praktischen Anforderungen bei dem Entwurf effektiver, effizienter und ästhetisch ansprechender User Interfaces eingegangen.

Neben der Diskussion zentraler Anforderungen an die konzeptuelle Gestaltung und das Interaktionsdesign von User Interfaces wird eine kognitionswissenschaftlich fundierte modellbasierte Evaluationsmethode zu deren Bewertung kritisch analysiert.

Rechtzeitig zur Jecken-Hochsaison können Sie sich vier kostenlose Faschings-/Karnevals-Icons in 128px, 48px, 32px, 24px und 16px herunterladen ...

Zu den Gratis Icons in unserem Icon Shop...

ERGOSIGN partizipiert an der Konferenz in Form von zwei Präsentationen:

A Best Practice Approach to the Design of Natural User Interfaces

von Prof. Dr. Dieter Wallach und Martin Radvak
Usability Fundamentals Track, Donnerstag, 27. Mai um 13:30 Uhr

Natural user interfaces, especially multi-touch systems, are becoming increasingly established in productive scenarios in which "classical" GUIs turn out to be less appropriate. This presentation describes guiding solutions for the arising conceptual and user-centred design challenges focussing on the platform and posture of tabletop-based systems like Microsoft Surface.

Establishing Cross-Cultural Collaboration in the Field of User Centered Design

von Dr. Marcus Plach, Sebastian C. Scholz, Aurobinda Pradhan und Jayaram Srinivasan
Experienced Practitioners Track, Donnerstag, 27. Mai um 16:15 Uhr

A process of establishing collaboration between a German and an Indian UCD service provider is presented, built on principles of modern communication theory: By following five phases gradually common ground was reached, allowing both partners to control the growth of trust and mutual understanding – eventually to deliver successful cross-cultural UCD projects.

Wir würden uns freuen, Sie auf der UPA2010 in München zu treffen!

Am Freitag, den 15.01.2010 wurde im sechsten Jahr der mit 500.- Euro dotierte ERGOSIGN-Preis für herausragende Leistungen im Bereich "Medieninformatik und Digitale Medien" an der Fachhochschule Kaiserslautern, Standort Zweibrücken verliehen.

Der diesjährige Preisträger Stefan Kochvachev absolvierte sein Studium der Digitalen Medien innerhalb der Regelstudienzeit mit Auszeichnung und der Abschlussnote 1.1.

In seiner hervorragenden Diplomarbeit bewertete er verschiedene Implementierungen der Java Persistence API bzgl. ihrer Performance, Featurevielfalt, Dokumentation und Benutzerfreundlichkeit.

Was ist der Vorteil von skalierbaren Vektor-Icons?

Bei der Entwicklung von Anwendungen wird oft eine Vielzahl von Grafiken und Icons verwendet. Besonders vorteilhaft ist es, wenn eine einzige Icon-Bibliothek für alle Anwendungsfälle wie Toolbars, Splash Screens, Tree Views, Buttons usw. verwendet werden kann.

Wie werden XAML-Icons erstellt?

Vektor-Icons werden bei ERGOSIGN mit Adobe Illustrator erstellt. Anschließend können diese im Expression Blend Designer nachbearbeitet und in XAML-Code umgewandelt werden.

Dieses Vorgehen ermöglicht zum einen die Benutzung unserer gewohnten Design-Instrumente und somit die Aufrechterhaltung unseres Qualitätsanspruches. Zum anderen können die Icons so auch problemlos als druckfähige EPS-Dateien exportiert werden.

Wie werden in XAML gelieferte Icons in ein WPF-Projekt integriert?

Die Integration einer XAML-Icon-Bibliothek gestaltet sich denkbar einfach. Alle XAML-Icons werden in einer einzelnen XAML-Ressource-Datei geliefert, die in das bestehende WPF-Projekt eingebunden werden kann.

Wenn Sie für Ihr Projekt vektorbasierte XAML-Icons erstellen lassen möchten, nehmen Sie doch einfach mit uns Kontakt auf.

Passend zum Dekadenwechsel 2010 - einem Jahr, welches mit ERGOSIGNs zehnjährigem Firmenjubiläum einhergeht - ist das neue Redesign der ERGOSIGN-Website online gegangen.

Besonders vorzuheben sind dabei: