usability coffee-mobile protptyping

Download Usability coffee-mobile protptyping

Post on 19-Jul-2015

56 views

Category:

Mobile

0 download

Embed Size (px)

TRANSCRIPT

  • Mobile Prototyping

    Usability Coffee, Zug, 19. Februar 2015

  • Usability Erfahrung seit 2013

    Bachelor Thesis zum Thema Usability Tests und Testleitereffekt

    Studium: Pdagogische Hochschule PHSH

    (Bachelor of Arts Primary Education) seit 2006 Angewandte Psychologie

    (B SC FHNW Angewandte Psychologie) seit 2014

    stefanie.friedli@soultank.ch

    Stefanie FriedliUsability Consultant

    | Folie 2soultank AG | Usability Coffee | 18. Februar 2015

  • soultank AG | Usability Coffee | 18. Februar 2015

    Wissenschaftlich fundiertes Beratungsunternehmen

    Seit 1996 im Bereich Usability und Ergonomie ttig

    2000 Grndung soultank AG in Zug

    6 Usability-Experten

    Betrieb eines Usability-Labors in Zug

    Europaweit ttig, Fokus Schweiz

    ber soultank AG

    | Folie 3

    Wir sind die unabhngigen Usability-Experten mit unvoreingenommenem Blick auf Ihr Produkt

  • Referenzen soultank AG

    soultank AG | Usability Coffee | 18. Februar 2015 | Folie 4

    Weitere Referenzen: www.soultank.ch/content/referenzen

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 5

    User Centred Design (UCD)

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 6

    User Centred Design (UCD)

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 7

    User Centred Design (UCD)

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 8

    User Centred Design (UCD)

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 9

    User Centred Design (UCD)

  • soultank AG | Usability Coffee | 18. Februar 2015 Seite 10

    Wenn immer mglich, baue frh einen Prototypen

    Was ist das Ziel und Zeck des Prototypen?

    Diese zwei Tools (Programme) frs Prototyping haben sich bewhrt: Balsamique

    Axure

    Teste so frh, wie mglich den Prototyp auf dem Zielgert (mobile Phone)

    Teste den Prototyp mit realen Benutzern

    Kernaussagen von heute

  • Was ist (mobile) Prototyping?

    Vorteile und Nachteile des Prototyping

    Mobile Prototyping Mit Balsamiq Mit Axure

    Auf was achten bei mobile Prototyping?

    Mobile Prototyping auch fr Hardware

    Mobile Prototyp frs eigene Projekt: Tipps

    Literatur

    Inhaltsbersicht

    | Folie 11soultank AG | Usability Coffee | 18. Februar 2015

  • 12

    Verschiedene Arten von Prototyping

    1

    2

    soultank AG | Usability Coffee | 18. Februar 2015

  • 13

    Verschiedene Arten von Prototyping

    3

    soultank AG | Usability Coffee | 18. Februar 2015

  • 14

    Definition "Prototyp"

    1. Nutzungs-kontext-analyse

    2. Anforderungs-spezifikation

    3. Entwicklung Prototypen

    4. Evaluation Prototypen

    intuitiv zu bedienendes Produkt

    Start

    Durch Prototyping entsteht eine zum Teil funktionsfhige Vorabversion einer Benutzeroberflche. Mit ihr kann frh getestet werden, ob die Anwendung die Anforderungen erfllt.

    Quelle: Wikipedia / gc-upa

    soultank AG | Usability Coffee | 18. Februar 2015

  • Visualisieren von Anforderungen

    Diskutieren von Design-Lsungen im Projekt

    Evaluieren von Design-Lsungen mit Benutzern

    Vergleich von verschiedenen Varianten

    Prsentation fr berzeugungsarbeit

    15

    Einsatzgebiet von Prototypen

    Quelle: Christian Hbscher, 2007

    soultank AG | Usability Coffee | 19. Februar 2015

  • Wieso Prototyping?

    | Folie 16soultank AG | Usability Coffee | 18. Februar 2015

  • Was ist (mobile) Prototyping?

    Vorteile und Nachteile des Prototyping

    Mobile Prototyping Mit Balsamiq Mit Axure

    Auf was achten bei mobile Prototyping?

    Mobile Prototyping auch fr Hardware

    Mobile Prototyp frs eigene Projekt: Tipps

    Literatur

    Inhaltsbersicht

    | Folie 17soultank AG | Usability Coffee | 18. Februar 2015

  • Ermglicht produktspezifisches Testing von Fragen, die nicht durch allgemeine Forschungsergebnisse oder Richtlinien beantwortet werden knnen

    Liefert relativ schnell bedeutungsvolle Rckmeldungenvom Benutzer

    Reduziert die totalen Entwicklungskosten fr ein Produkt

    Kann frh im Entwicklungsprozess eingesetzt werden

    18

    Vorteile des Prototyping

    soultank AG | Usability Coffee | 18. Februar 2015

  • Reduziert Missverstndnisse

    Geht tiefer als Bilder oder Skizzen (zeigen und erzhlen) lsst einem das Design erleben

    Beste Lsung berlebt Survival the fittest

    Adaptiv, immer vernderbar

    Produziert fokussiert Produkte

    Zeigt Fehler frh

    Reduziert Risiko (Spart Zeit, Geld, Arbeit)

    Vorteile des Prototyping

    | Folie 19soultank AG | Usability Coffee | 18. Februar 2015

  • Begrenzungen und Randbedingungen, auf die das reale Produkt trifft, werden oft whrend des Prototyping zu stark vernachlssigt

    Erzeugung unrealistischer Erwartungen fr die Fhigkeiten des Endproduktes

    Gefahr der berfrachtung des Prototyps

    Der Prototypingprozess kann schwierig zu managen und zu kontrollieren sein

    Prototyp ist nur eine begrenzte Simulation des schlussendlichen Produktes (flach/tief)

    20

    Nachteile des Prototyping

    soultank AG | Usability Coffee | 18. Februar 2015

  • Was ist (mobile) Prototyping?

    Vorteile und Nachteile des Prototyping

    Mobile Prototyping Mit Balsamiq Mit Axure

    Auf was achten bei mobile Prototyping?

    Mobile Prototyping auch fr Hardware

    Mobile Prototyp frs eigene Projekt: Tipps

    Literatur

    Inhaltsbersicht

    | Folie 21soultank AG | Usability Coffee | 18. Februar 2015

  • Welches Tool?

    Wichtigste Frage:

    Was ist mein Ziel?

    Welche Frage will ich beantworten?

    Idee berprfen? Lo-Fi

    Benennung & Funktionsweise prfen? Lo-Fi

    berzeugungsarbeit leisten? Hi-Fi

    22soultank AG | Usability Coffee | 18. Februar 2015

    Lo-Fi

    Hi-Fi

  • Skizzieren von Hand App: Camscanner Plus

    (2CHF)

    Prototyp erstellen: von Handfast and easy

    | Folie 23soultank AG | Usability Coffee | 18. Februar 2015

  • Papier, Bleistift, Post-it etc.

    Mit kleben, kopieren kombinierbar

    Whiteboard

    Anderes Prsentationsmaterial

    Vorteile: schnell und einfach, Erarbeitung in der Gruppe, Material verfgbar, von jedem benutzbar

    Nachteile: nderungen evtl. umstndlich

    Paper and Pencil

    | Folie 24soultank AG | Usability Coffee | 18. Februar 2015

  • Bro-/Grafik Software

    Spezialisierte Prototyping-Applikationen

    Entwicklungs-Umgebungen

    Vorteile: nderungen und Variationen schnell und einfach, einfach elektronisch zu verteilen

    Nachteile: Lernaufwand fr das Tool, fr einfache Sachen aufwndiger als von Hand

    Prototyp erstellen: mit Computer

    | Folie 25soultank AG | Usability Coffee | 18. Februar 2015

  • BalsamiqSchnell, verteilbar und unfertig aussehend

    | Folie 26soultank AG | Usability Coffee | 18. Februar 2015

    Als PDF auf dem Smartphone oder Tablet

    Klickbar

  • Vorteile: Sieht unfertig aus (wie bei Paper & Pencil)

    Elektronisch und darum verteilbar

    PDF auf Tablet oder Smartphone lauffhig

    Relativ schnell eingearbeitet

    Beschrnkte Mglichkeiten bei Interaktivitt und Visual Design

    Nachteile: Beschrnkte Mglichkeiten bei Interaktivitt und Visual Design

    Interaktivitt: Verlinkbare Seiten, keine Interaktion innerhalb der Seite

    27

    Balsamiq Mockups

    soultank AG | Usability Coffee | 18. Februar 2015

  • AxureAufwndiger, mchtiger und verteilbar

    | Folie 28soultank AG | Usability Coffee | 18. Februar 2015

  • Vorteile: Per Mausklick gibt es einen HTML-Prototypen

    Auch auf Tablets und Mobiltelefonen einsetzbar

    Interaktionen knnen sehr realistisch gemacht werden (Flyoutetc.)

    Relativ schnell eingearbeitet (im Vergleich zu HTML/CSS lernen)

    Masterelemente knnen definiert werden (z.B. Navigation, Header)

    Grosse Bibliothek und viele Komponenten fr die grafische Benutzeroberflche

    Man kann einzelne Elemente kommentieren und so auch eine Word-Dokumentation generieren

    29

    Axure: Vorteile

    soultank AG | Usability Coffee | 18. Februar 2015

  • Nachteile: HTML kann/sollte nicht weiterverwendet werden

    Kein Design-Tool zum z.B. schneabgerundete Buttons zu gestalten (wie Visio, Photoshop)

    30

    Axure: Nachteile

    soultank AG | Usability Coffee | 18. Februar 2015

  • Was ist (mobile) Prototyping?

    Vorteile und Nachteile des Prototyping

    Mobile Prototyping Mit Balsamiq Mit Axure

    Auf was achten bei mobile Prototyping?

    Mobile Prototyping auch fr Hardware

    Mobile Prototyp frs eigene Projekt: Tipps

    Literatur

    Inhaltsbersicht

    | Folie 31soultank AG | Usability Coffee | 18. Februar 2015

  • Den Prototyp mglichst frh auf dem Zielgert (Smartphone oder Tablet) anschauen

    Grnde: Probleme mit der Darstellung (z.B. Schriftgrsse und Kontrast)

    Z.B. Times New Roman anders auf iPhone und Android

    Ist es auch auf dem Zielgert gut ersichtlich?

    Grosser Unterschied zum Desktop

    Besonders wichtig beim mobile Prototyping 1

    | Folie 32soultank AG | Usability Coffee | 18. Februar 2015

  • Mglichst frh definieren, wie die Auflsung (px) des Prototypen sein soll

    Dies hngt ab davon, was fr ein Zielgert man verwendet fr Usability Tests. Dieses auch mglichst frh definieren.

    Grund: Die Auflsung (px) hat Einfluss auf die Platzverhltnisse und die Darstellung des mobile Prototypen

    Besonders w