Mit Template smart auf’s Papier: Paper Prototyping einer App

Letzte Woche hatte ich wieder die Gelegenheit, eine Gruppe erfahrener Entwickler mit verschiedenen Usability-Strategien vertraut zu machen. Nachdem wir uns mit den Grundlagen beschäftigt haben, ging es nun an die Praxis. Am Beispiel eines fiktiven Online-Kochbuchs galt es User Stories zu sammeln, Storyboards zu entwickeln, Wireframes zu skizzieren und den Entwurf anhand ersten Usability-Tests zu validieren.

Beim Mittagstisch wurde schon mal nebenbei über Prototyping gesprochen. Es müssten schon klickbare und navigierbare Prototypen sein. Sonst bringe das nichts. So in diesem Tenor äußersten sich verschiedene Teilnehmer. Ich habe das nicht weiter kommentiert, sah aber schon eine echte Herausforderung auf mich zukommen. Dem Paper Prototyping wurde also eine gewisse Skepsis entgegen gebracht. Es hilft nichts. Augen zu und rein ins kalte Wasser!

Die User Stories sind schnell gesammelt. Ja die Ideen sprudeln so flott, dass sie von drei Personen parallel aufgenommen werden müssen. Da stecken nun also die Anforderungen für das Online-Kochbuch an der Pinnwand und jeder kennt den Leistungsumfang. Von Rezeptaufnahme, Bewertung, Zutatenbasierte Suche, Integration mit Social Media wie Twitter, Facebook und G+, Einkaufsliste bis hin zur Einbindung von Spendenmöglichkeiten mit Micropayment ist alles dabei.

Weiterlesen

Teile diesen Beitrag:

Usability-Schulung bei msg systems AG

Am Freitag hatte ich die Gelegenheit, die msg systems AG in die Usability-Thematik einzuführen: Ein Tag Usability

Das war ein spannender Tag mit zwölf tollen Teilnehmern und viel Spaß. Neben den Grundlagen haben wir uns auch mit den ökonomischen Aspekten beschäftigt. Usability rechnet sich nämlich. Wir haben den Return On Investment hinsichtlich folgender Dimensionen beleuchtet:

  • Entwicklungskosten
  • Schulungsaufwand und
  • Produktivität

4 Usability Strategien

Weiterlesen

Teile diesen Beitrag:

XINGs Powersuche: Findest Du schon oder suchst Du noch?

XING bietet eine sehr interessante Powersuche. Sie stellt neben der Erweiterten Suche ein gutes Akquisemittel dar. Leider ist diese Kernfunktionalität sehr versteckt. Noch ein Hinweis: Nachrichten an Mitglieder, mit denen man nicht direkt verbunden ist, können als Spam betrachtet werden. Also mit Bedacht nutzen!

XING ist ja unbestritten im deutschsprachigen Bereich die Business-Plattform. Nach dem letzten Redesign hat sich am äußeren Erscheinungsbild viel getan. Es sind aber auch neue Funktionen hinzugekommen. Sehr begrüßenswert finde ich die sogenannte Powersuche. Sie soll dem Anwender helfen, andere Mitglieder zu finden, die…

  • mein Profil besucht haben.
  • deren Profil ich besucht habe.
  • und sehr interessant: Mitglieder, die suchen, was ich biete.

Weiterlesen

Teile diesen Beitrag:

Ein weiteres Missverständnis: Usability Tests sind teuer

In einem vorigen Artikel schrieb ich schon über verschiedene Usability-Missverständnisse (Usability – Schluss jetzt mit den Missverständnissen!). Ich möchte die Sammlung noch ein wenig erweitern.

Gerne werden an allen Ecken und Enden Kosten gespart. Und da wird gerne auf Usability Tests verzichtet: „Das hat ja schließlich ein guter Designer entworfen…“ Nun, auch Designer sind nur Menschen und können Fehler machen. Die sollte man schon aus Gründen des Investitionsschutzes frühestmöglich aufdecken. Und dazu sind eben Usability Tests da. Doch nun zu den Kosten. Denkt man an solche Tests, fallen häufig Stichwörter wie Usability Labor, Eye Tracking, Erhebungskampagnen, statistische Validierung etc. Ja, das kann alles dazu gehören – muss es aber nicht. Die Buchung und Beauftragung eines professionellen Usability-Labors ist kostenaufwendig. Aber selbst das lohnt sich in den meisten Fällen. Ich möchte hier aber zwei sehr einfache Testmethoden vorstellen, die mit wenig Aufwand durchzuführen sind und dennoch wertvolle Erkenntnisse liefern.

Papierprototypen-Test

Wie zuvor schon kurz erwähnt braucht man für diesen Test noch nicht mal lauffähigen Sourcecode. Es reichen Papierskizzen, die man aus dem Entwurfsprozess (frühe Konzeptionsphase) extrahiert. Diese Skizzen (Mockups) fallen da ja eh an, da man anhand dieser die Benutzerinteraktion durchdenkt und visualisiert. Nun überlegt man, welche Szenarien man mit welchen Nutzern überprüfen möchte. Man wählt die entsprechenden User Interface-Skizzen aus und lädt die Testteilnehmer ein. Eine Auswahl von fünf bis sechs Testteilnehmern sollte reichen. Mehr Teilnehmer erhöhen den Erkenntnisgewinn in der Regel nicht. Und statistisch belastbare Aussagen wird man auch mit 20 Teilnehmern nicht erreichen. Darum geht es aber auch gar nicht. Und wer keine sechs Teilnehmer „loseisen“ kann, beschränkt sich eben auf zwei. Lieber einen kleinen Test machen als gar keinen!

Weiterlesen

Teile diesen Beitrag:

Informationsarchitektur – Acht auf einen Streich

Umfangreiche Internetangebote werfen eine sehr wichtige Frage auf: Wie sollen die Inhalte strukturiert werden? Dass das nicht immer ganz leicht ist, zeigt das folgende Beispiel. Es handelt sich bei der Website um ein Angebot des Niedersächsischen Ministeriums für Wirtschaft, Arbeit und Verkehr. Im Speziellen dreht es sich um EU-gestützte Förderangebote zum Arbeitsmarkt.

Versuchen Sie es selbst…

Lassen Sie uns einen Versuch starten. Geben Sie in einer Suchmaschine (ich habe das mit G… getestet) die Suchbegriffe „EU fördert Niedersachsen“ ein. Schnell landen Sie auf http://www.eu-foerdert.niedersachsen.de (neues Fenster). Der Link öffnet ein neues Fenster. So können Sie die nachfolgenden Navigationsschritte selbst besser nachvollziehen.

Weiterlesen

Teile diesen Beitrag:

Kontextsensitive Katalogunterstützung: Handhabung umfangreicher Auswahllisten

Mit der richtigen Platzierung und plausiblen Interaktionsmöglichkeiten lassen sich auch sehr große Auswahllisten handhaben. Doch lesen Sie selbst…

Viele Anwendungen bieten zum Ausfüllen verschiedener Eingabefelder umfangreiche Auswahllisten. Diese Auswahllisten werden auch Kataloge genannt. Man setzt sie ein, um sicherzustellen, dass nur bestimmte Werte eingegeben werden. Als kontextsensitiv wird eine Anwendung bezeichnet, wenn abhängig vom Feld, das den Fokus hat, unterschiedliche Informationen angeboten werden. Wir kennen das von der Hilfe. Wenn man auf der Erfassungsmaske A die Hilfe aufruft, werden genau zu dieser Maske passende Erklärungen angezeigt – und nicht die gesamte Onlinehilfe oder die Hilfetexte zur Maske B. Genau so kann man auch mit Katalogen verfahren. In einem festgelegten Bereich zeigt man für das Feld, das gerade den Fokus hat, den entsprechenden Katalog an. Das ist also die sogenannte kontextsensitive Katalogunterstützung.

Dafür gibt es doch die Select-Felder, könnte man meinen. Nicht ganz. Wenn ich hier von Katalogen spreche, meine ich Listen mit teilweise bis zu 1000 Einträgen. Und die einzelnen Einträge können auch recht lang sein. 100 und mehr Zeichen sind keine Seltenheit. So etwas begegnet einem in Onlineshops nicht so häufig, Fachanwendungen in der Verwaltungen setzten derart große Kataloge häufig ein. Und dafür sind einfache Select-Felder schlichtweg nicht geeignet.

Früher hat man umfangreiche Kataloge in separate Dialoge ausgelagert. An dem jeweiligen Feld fand sich ein Button – häufig mit drei Punkten gekennzeichnet -, über den man den Dialog öffnen konnte. Dann musste man durch lange Listen blättern und den gewünschten Eintrag auswählen. Und zuguterletzt musste der Dialog meistens noch bestätigt werden. Bei der Anzahl erforderlicher Nutzerinteraktionen kann einem doch wirklich schwindelig werden. Da geht nicht nur die Produktivität flöten. Es nervt einfach. Das können wir heute besser. Weiterlesen

Teile diesen Beitrag:

Das User Interaction-Masterdocument

Ist es Euch auch schon mal passiert: Da wird eine Änderung einer bestimmten Funktionalität diskutiert, Ihr habt ein mulmiges Gefühl dabei. Irgendetwas ist faul. Ihr wisst genau, wenn ich dem jetzt zustimme, hat das Auswirkungen auf einige Storyboards…

Warum? Weil eine Funktionalität diskutiert wird, die ein oder mehrere User Interaction Patterns betreffen, die Ihr im längeren Projektverlauf mühsam entwickelt und abgestimmt habt. Und jetzt soll diese Änderung vorgenommen werden!

Was bedeutet das denn nun wirklich? Wäre es da nicht schön, wenn man eine zentrale Stelle im Projekt hätte, die darüber Auskunft geben könnte. Tja, genau diese Stelle sind wir als verantwortliche User Interaction Designer normalerweise. Doch, Hand auf’s Herz. In einem Projekt, das seit einem Jahr läuft kann man sich nicht mehr an jeden Entscheid erinnern, der irgendwann getroffen worden ist. Jetzt könnte man einen Stapel von Protokollen durchsehen – oder den Styleguide befragen. Das erste ist zu langwierig, das zweite ist zu allgemein. Man könnte auch alle Storyboards durchsehen. Da steht ja drin, wie User Interaction laufen soll (siehe hierzu Storyboards: Eine Erfolgsgeschichte). Doch dazu fehlt die Zeit.  Also: keine Antwort, nur ein schlechtes Bauchgefühl. Weiterlesen

Teile diesen Beitrag:

Storyboards: Eine Erfolgsgeschichte

Was sind Storyboards?

Storyboards sind Geschichtenbretter – jedenfalls wörtlich übersetzt. Ok, wir malen die nicht auf Holz. Storyboards beschreiben die Umsetzung eines fachlichen Anwendungsfalls in eine konkrete Software-Benutzeroberfläche. Beschreibt ein Anwendungsfall (Use Case) die rein fachlichen Abläufe (z.B. Anlegen eines Kontos), so beschreibt das entsprechende Storyboard, wie das in der Software-Oberfläche vor sich geht.

Herkunft

Storyboards verbindet man eher mit der Erstellung von Trickfilmen oder der Planung von Werbespots. Verschiedene Scribbles (flüchtige Skizzen) werden mit Pfeilen und Symbolen miteinander verbunden. Ziel ist es, eine Geschichte zu erzählen und den Ablauf der Geschichte zu verdeutlichen. Nun, da hat die gute alte IT-Welt mal von so neumodischem Kram wie Zeichentrick und Werbung gelernt. Wobei ich mir jetzt gar nicht so sicher bin, ob Storyboards nicht schon viel früher im Filmgeschäft eingesetzt wurden. Das Ziel sollte dasselbe gewesen sein: eine Geschichte erzählen. Wie dem auch sei, die Storyboards haben in die IT Einzug gehalten. Weiterlesen

Teile diesen Beitrag:

Entwurf speichern? Gerne – aber nur auf Befehl!

Vor längerer Zeit stieß ich in einem Projekt auf eine Problematik, die sich um das Zwischenspeichern von Entwürfen rankt. Nicht aktuell – aber vielleicht interessant genug, um es hier im Blog nachzutragen.

Die Ausgangssituation

Es geht um eine eigentlich recht einfache Situation: Der Nutzer möchte ein Dokument oder eine Mail erstellen. Nun, unser Vertrauen in die Technik hat durch den ein oder anderen Bluescreen oder andere Abstürze gelitten. Was machen wir also? Ctrl+S gehört zu den Shortcuts, die man schnell lernt und schon fast automatisch alle paar Minuten eingibt… Wenn man nicht ein UI einer browsergestützten Anwendung vor sich hat! Das führt nämlich dazu, dass man die HTML-Seite lokal speichert. Das WordPress, an dem ich gerade sitze, bietet mir an, post-new.php.html lokal zu speichern. Hm, das möchte ich aber nicht. Ich möchte nur sicherstellen, dass der Artikel nicht verloren geht. Ctrl+S ist also nicht die Lösung.

Die vermeintliche Lösung

Dieselbe Situation habe ich in jenem Projekt erlebt: Eine browserbasierte Oberfläche, in der umfangreiche Dokumente erstellt werden. Wie löst man das? Beim Erstellen eines Dokuments wird sofort ein Entwurf angelegt. Dieser wird aktualisiert, sobald man innerhalb eines Assistenten vor oder zurück navigiert. Dies wird dem Nutzer nicht signalisiert. Wenn man das Dokument erstellt und versendet hat, wird der Entwurf gelöscht. Das klappt alles ganz prima, solange man die Erstellung des Dokuments nicht abbricht. Beim Abbrechen wurde dann nämlich gefragt: „Es ist ein Entwurf automatisch angelegt worden. Wollen Sie den Entwurf löschen?“ Wie bitte? Was soll ich hier entscheiden? Ich weiß doch gar nicht, was da im Hintergrund passiert ist und was im Entwurf drin steht. Ich habe den nicht angelegt. Da wir aber vorsichtige Nutzer sind, löschen wir den Entwurf nicht und klicken auf Nein. Die Erfassungsmaske der Mail schließt sich und alles ist gut. Wirklich? Es sammeln sich so im Laufe der Zeit viele Entürfe an, deren Inhalt ich nicht einschätzen kann. Ok, das ist das Usability-Problem Nr. 1.: Ansammeln unbekannter Dateien. Das ist besonders dann ein Problem, wenn mehrere Nutzer an einem Ordner arbeiten und nicht wissen, was die Entwürfe des anderen Kollegen sollen. Lieber Finger weg!

Weiterlesen

Teile diesen Beitrag: