SlideShare ist ein Scribd-Unternehmen logo
1 von 43
Downloaden Sie, um offline zu lesen
Mobile Prototyping
Usability Coffee, Zug, 19. Februar 2015
Usability Erfahrung seit 2013
Bachelor Thesis zum Thema Usability Tests
und Testleitereffekt
Studium:
Pädagogische Hochschule PHSH
(Bachelor of Arts Primary Education) seit 2006
Angewandte Psychologie
(B SC FHNW Angewandte Psychologie) seit 2014
stefanie.friedli@soultank.ch
Stefanie Friedli
Usability 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 tätig
2000 Gründung soultank AG in Zug
6 Usability-Experten
Betrieb eines Usability-Labors in Zug
Europaweit tätig, Fokus Schweiz
Über soultank AG
| Folie 3
Wir sind die unabhängigen 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 möglich, baue früh einen Prototypen
Was ist das Ziel und Zeck des Prototypen?
Diese zwei Tools (Programme) fürs Prototyping haben
sich bewährt:
Balsamique
Axure
Teste so früh, wie möglich den Prototyp auf dem Zielgerät
(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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| 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 funktionsfähige
Vorabversion einer Benutzeroberfläche. Mit ihr kann früh
getestet werden, ob die Anwendung die Anforderungen
erfüllt.
Quelle: Wikipedia / gc-upa
soultank AG | Usability Coffee | 18. Februar 2015
Visualisieren von Anforderungen
Diskutieren von Design-Lösungen im Projekt
Evaluieren von Design-Lösungen mit Benutzern
Vergleich von verschiedenen Varianten
Präsentation für Überzeugungsarbeit
15
Einsatzgebiet von Prototypen
Quelle: Christian Hübscher, 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 17soultank AG | Usability Coffee | 18. Februar 2015
Ermöglicht produktspezifisches Testing von Fragen, die
nicht durch allgemeine Forschungsergebnisse oder
Richtlinien beantwortet werden können
Liefert relativ schnell bedeutungsvolle Rückmeldungen
vom Benutzer
Reduziert die totalen Entwicklungskosten für ein Produkt
Kann früh im Entwicklungsprozess eingesetzt werden
18
Vorteile des Prototyping
soultank AG | Usability Coffee | 18. Februar 2015
Reduziert Missverständnisse
Geht tiefer als Bilder oder Skizzen (zeigen und erzählen) →
lässt einem das Design erleben
Beste Lösung überlebt → Survival the fittest
Adaptiv, immer veränderbar
Produziert fokussiert Produkte
Zeigt Fehler früh
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 während des Prototyping zu stark
vernachlässigt
Erzeugung unrealistischer Erwartungen für die Fähigkeiten 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 21soultank AG | Usability Coffee | 18. Februar 2015
Welches Tool?
Wichtigste Frage:
Was ist mein Ziel?
Welche Frage will ich beantworten?
Idee überprüfen? Lo-Fi
Benennung & Funktionsweise
prüfen? 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 Hand
fast and easy
| Folie 23soultank AG | Usability Coffee | 18. Februar 2015
Papier, Bleistift, Post-it etc.
Mit kleben, kopieren
kombinierbar
Whiteboard
Anderes
Präsentationsmaterial
Vorteile: schnell und einfach,
Erarbeitung in der Gruppe,
Material verfügbar, von jedem
benutzbar
Nachteile: Änderungen evtl.
umständlich
Paper and Pencil
| Folie 24soultank AG | Usability Coffee | 18. Februar 2015
Büro-/Grafik Software
Spezialisierte Prototyping-
Applikationen
Entwicklungs-Umgebungen
Vorteile: Änderungen und Variationen
schnell und einfach, einfach elektronisch
zu verteilen
Nachteile: Lernaufwand für
das Tool, für einfache Sachen
aufwändiger als von Hand
Prototyp erstellen: mit Computer
| Folie 25soultank AG | Usability Coffee | 18. Februar 2015
Balsamiq
Schnell, 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 lauffähig
Relativ schnell eingearbeitet
Beschränkte Möglichkeiten bei Interaktivität und Visual Design
Nachteile:
Beschränkte Möglichkeiten bei Interaktivität und Visual Design
Interaktivität: Verlinkbare Seiten, keine Interaktion innerhalb der
Seite
27
Balsamiq Mockups
soultank AG | Usability Coffee | 18. Februar 2015
Axure
Aufwändiger, mächtiger 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 können sehr realistisch gemacht werden (Flyout
etc.)
Relativ schnell eingearbeitet (im Vergleich zu HTML/CSS lernen)
Masterelemente können definiert werden (z.B. Navigation,
Header)
Grosse Bibliothek und viele Komponenten für die grafische
Benutzeroberfläche
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. schöneabgerundete 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 31soultank AG | Usability Coffee | 18. Februar 2015
Den Prototyp möglichst früh auf dem Zielgerät
(Smartphone oder Tablet) anschauen
Gründe:
Probleme mit der Darstellung (z.B. Schriftgrösse und Kontrast)
Z.B. Times New Roman anders auf iPhone und Android
Ist es auch auf dem Zielgerät gut ersichtlich?
Grosser Unterschied zum Desktop
Besonders wichtig beim mobile Prototyping 1
| Folie 32soultank AG | Usability Coffee | 18. Februar 2015
Möglichst früh definieren, wie die Auflösung (px) des
Prototypen sein soll
Dies hängt ab davon, was für ein Zielgerät man verwendet
für Usability Tests. Dieses auch möglichst früh definieren.
Grund:
Die Auflösung (px) hat Einfluss auf die Platzverhältnisse und die
Darstellung des mobile Prototypen
Besonders wichtig beim mobile Prototyping 2
| Folie 33soultank 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 34soultank AG | Usability Coffee | 18. Februar 2015
Beispiel Waschmaschine V-Zug
| Folie 35soultank 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 36soultank AG | Usability Coffee | 18. Februar 2015
Gezielt die Seiten prototypen, welche nötig sind um die
offenen Fragen im Usability Test nachher zu klären
Orientieren Sie sich an den Szenarien
Die Szenarien definieren die wichtigsten Aufgaben
Für diese Aufgaben brauchen Sie Screens im Prototypen
Während dem Prototypen werden neue Ideen generiert
Iterative Natur des Entwicklungsprozesses erfahren
Daraus ergeben sich oft weitere Fragestellungen, welche Sie
beantworten möchten
Z.B. Verstehen Benutzer was «Produkte» bedeutet? Wäre
«Haushaltsgeräte» besser?
Mobile Prototyp fürs eigene Projekt: Tipps 1/2
| Folie 37soultank AG | Usability Coffee | 18. Februar 2015
Immer mit Zeichnen beginnen. Ist schneller als mit
Software
Profitipp: App «CamScanner» verwenden zum
fotografieren
Prototyp möglichst früh bereits auf Gerät auf welchem
Usability Test gemacht wird anschauen, ob Grösse stimmt
Z.B. Tablet, Smartphone, Desktop-Computer
Mobile Prototyp fürs eigene Projekt: Tipps 2/2
| Folie 38soultank 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 für Hardware
Mobile Prototyp fürs eigene Projekt: Tipps
Literatur
Inhaltsübersicht
| Folie 39soultank AG | Usability Coffee | 18. Februar 2015
Literatur
40
Carolyn Snyder - Paper Prototyping Todd Zaki Warfel - Prototyping
soultank AG | Usability Coffee | 18. Februar 2015
Herzlichen Dank für Ihre Aufmerksamkeit
Bei Fragen stehen wir gerne zur Verfügung
Nächste Termine in Zug
Do, 15. April 2015, 07.30-08.30 Uhr
Usability Coffee „Visual Thinking“
http://soultank.ch/content/ueber-uns/events/usability-
coffee-zug/usability-coffee-zug-mi-15-april-2015/
Usability Coffee 2015
| Folie 42soultank AG | Usability Coffee | 18. Februar 2015
Team
soultank AG | Usability Coffee | 18. Februar 2015 | Folie 43
soultank AG
Bahnhofplatz
Postfach 4744
6304 Zug
Tel: +41 41 726 50 20
Fax: +41 41 726 50 26
www.soultank.ch
soultank AG
c/o Ostsinn
Bohl 2
9000 St. Gallen
Gaby Surber Monique Andres
Marcel B.F. Uhr Iris Müller Bianca Redel Andreas Bossard
Adrian Lauper Stefanie FriedliSandro Fernandes Matthias Chavanne
Remo Bertschinger Jérome Fischer

Weitere ähnliche Inhalte

Was ist angesagt?

Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.GallenScrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
soultank AG
 
Entwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered DesignEntwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered Design
soultank AG
 

Was ist angesagt? (16)

Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
 
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.GallenScrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
 
Entwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered DesignEntwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered Design
 
Die UX von Enterprise-Anwendungen: Ein Aschenputtel des Software-Designs?
Die UX von Enterprise-Anwendungen: Ein Aschenputtel des Software-Designs? Die UX von Enterprise-Anwendungen: Ein Aschenputtel des Software-Designs?
Die UX von Enterprise-Anwendungen: Ein Aschenputtel des Software-Designs?
 
Mensch & Computer 2010 - Tutorial Agile UX
Mensch & Computer 2010 - Tutorial Agile UXMensch & Computer 2010 - Tutorial Agile UX
Mensch & Computer 2010 - Tutorial Agile UX
 
Uability und User Experience - Ein bisschen darüber geplaudert ...
Uability und User Experience - Ein bisschen darüber geplaudert ...Uability und User Experience - Ein bisschen darüber geplaudert ...
Uability und User Experience - Ein bisschen darüber geplaudert ...
 
UX Army of One
UX Army of OneUX Army of One
UX Army of One
 
Usability engineering als Innovationsmethodik - die vielen Gesichter einer Sc...
Usability engineering als Innovationsmethodik - die vielen Gesichter einer Sc...Usability engineering als Innovationsmethodik - die vielen Gesichter einer Sc...
Usability engineering als Innovationsmethodik - die vielen Gesichter einer Sc...
 
eparo – User Experience Design und Usability. Niemand sagt mehr "Konzeption" ...
eparo – User Experience Design und Usability. Niemand sagt mehr "Konzeption" ...eparo – User Experience Design und Usability. Niemand sagt mehr "Konzeption" ...
eparo – User Experience Design und Usability. Niemand sagt mehr "Konzeption" ...
 
Responsive goes Agile!
Responsive goes Agile!Responsive goes Agile!
Responsive goes Agile!
 
Agile Breakfast, Bern, 29.01.2014: Softwareentwicklung mit Verstand
Agile Breakfast, Bern, 29.01.2014: Softwareentwicklung mit VerstandAgile Breakfast, Bern, 29.01.2014: Softwareentwicklung mit Verstand
Agile Breakfast, Bern, 29.01.2014: Softwareentwicklung mit Verstand
 
E-Commerce Organisationsstrukturen
E-Commerce OrganisationsstrukturenE-Commerce Organisationsstrukturen
E-Commerce Organisationsstrukturen
 
Usability-Trends 2014 - Worauf es ankommt bei der Online-Präsenz
Usability-Trends 2014 - Worauf es ankommt bei der Online-PräsenzUsability-Trends 2014 - Worauf es ankommt bei der Online-Präsenz
Usability-Trends 2014 - Worauf es ankommt bei der Online-Präsenz
 

Andere mochten auch

Karrieredagavis 2009
Karrieredagavis   2009Karrieredagavis   2009
Karrieredagavis 2009
stofa86
 
Jarrin arte-barroco
Jarrin arte-barrocoJarrin arte-barroco
Jarrin arte-barroco
viviale19
 
Marketing de servicios
Marketing de serviciosMarketing de servicios
Marketing de servicios
Hector Maida
 
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
David Saavedra Pino
 
Memoria ayuda a domicilio 2011
Memoria ayuda a domicilio 2011Memoria ayuda a domicilio 2011
Memoria ayuda a domicilio 2011
Muskizko Udala
 
Ciências humanas e suas tecnologias gabarito
Ciências humanas e suas tecnologias gabaritoCiências humanas e suas tecnologias gabarito
Ciências humanas e suas tecnologias gabarito
fsolidaria
 
Análisis de ingeniería usando cosmos exposicon
Análisis de ingeniería usando cosmos exposiconAnálisis de ingeniería usando cosmos exposicon
Análisis de ingeniería usando cosmos exposicon
mecanicadefluidos
 
8 AnµLisis De La Pel÷Cula Toma Mi Mano
8 AnµLisis De La Pel÷Cula Toma Mi Mano8 AnµLisis De La Pel÷Cula Toma Mi Mano
8 AnµLisis De La Pel÷Cula Toma Mi Mano
tunegocioweb
 
The Evolution of Hitchhiking
The Evolution of HitchhikingThe Evolution of Hitchhiking
The Evolution of Hitchhiking
elfenwick
 
Comodo Overview Presentation Read Only
Comodo Overview Presentation Read OnlyComodo Overview Presentation Read Only
Comodo Overview Presentation Read Only
JayHicks
 

Andere mochten auch (20)

Introduction to Prototyping: What, Why, How
Introduction to Prototyping: What, Why, HowIntroduction to Prototyping: What, Why, How
Introduction to Prototyping: What, Why, How
 
design thinking - ein überblick
design thinking - ein überblickdesign thinking - ein überblick
design thinking - ein überblick
 
Spanish blade book600 1
Spanish blade book600 1Spanish blade book600 1
Spanish blade book600 1
 
Ponencia marketing olfativo alimentación
Ponencia marketing olfativo alimentaciónPonencia marketing olfativo alimentación
Ponencia marketing olfativo alimentación
 
Karrieredagavis 2009
Karrieredagavis   2009Karrieredagavis   2009
Karrieredagavis 2009
 
Manuel María: animais
Manuel María: animaisManuel María: animais
Manuel María: animais
 
1108 Sapag Ev Proy Foll C
1108 Sapag Ev Proy Foll C1108 Sapag Ev Proy Foll C
1108 Sapag Ev Proy Foll C
 
GDSF India
GDSF IndiaGDSF India
GDSF India
 
Jarrin arte-barroco
Jarrin arte-barrocoJarrin arte-barroco
Jarrin arte-barroco
 
Marketing de servicios
Marketing de serviciosMarketing de servicios
Marketing de servicios
 
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
Seguimiento de dependientes del alcohol yo de la cocaína después de su salida...
 
Memoria ayuda a domicilio 2011
Memoria ayuda a domicilio 2011Memoria ayuda a domicilio 2011
Memoria ayuda a domicilio 2011
 
Ciências humanas e suas tecnologias gabarito
Ciências humanas e suas tecnologias gabaritoCiências humanas e suas tecnologias gabarito
Ciências humanas e suas tecnologias gabarito
 
Crear una "lovemark". Uzink. Value Innovation.
Crear una "lovemark". Uzink. Value Innovation.Crear una "lovemark". Uzink. Value Innovation.
Crear una "lovemark". Uzink. Value Innovation.
 
Programa de Preparación a la Certificación del Examen PMP®
Programa de Preparación a la Certificación del Examen PMP®Programa de Preparación a la Certificación del Examen PMP®
Programa de Preparación a la Certificación del Examen PMP®
 
1. mitocondria sirtuinas-rapamicina y envejecimento
1. mitocondria sirtuinas-rapamicina y envejecimento 1. mitocondria sirtuinas-rapamicina y envejecimento
1. mitocondria sirtuinas-rapamicina y envejecimento
 
Análisis de ingeniería usando cosmos exposicon
Análisis de ingeniería usando cosmos exposiconAnálisis de ingeniería usando cosmos exposicon
Análisis de ingeniería usando cosmos exposicon
 
8 AnµLisis De La Pel÷Cula Toma Mi Mano
8 AnµLisis De La Pel÷Cula Toma Mi Mano8 AnµLisis De La Pel÷Cula Toma Mi Mano
8 AnµLisis De La Pel÷Cula Toma Mi Mano
 
The Evolution of Hitchhiking
The Evolution of HitchhikingThe Evolution of Hitchhiking
The Evolution of Hitchhiking
 
Comodo Overview Presentation Read Only
Comodo Overview Presentation Read OnlyComodo Overview Presentation Read Only
Comodo Overview Presentation Read Only
 

Ähnlich wie Mobile Protptyping, Usability Coffee, Zug, 19.02.105

Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Bokowsky + Laymann GmbH
 
result App-Forschung
result App-Forschungresult App-Forschung
result App-Forschung
result gmbh
 
Mockups prototyping
Mockups prototypingMockups prototyping
Mockups prototyping
Hausammann
 

Ähnlich wie Mobile Protptyping, Usability Coffee, Zug, 19.02.105 (20)

UXcamp Hamburg 2016 - Prototyping Tools and Workflows
UXcamp Hamburg 2016 - Prototyping Tools and WorkflowsUXcamp Hamburg 2016 - Prototyping Tools and Workflows
UXcamp Hamburg 2016 - Prototyping Tools and Workflows
 
Micro UX. Wie Produkte wirklich Spaß machen (2014)
Micro UX. Wie Produkte wirklich Spaß machen (2014)Micro UX. Wie Produkte wirklich Spaß machen (2014)
Micro UX. Wie Produkte wirklich Spaß machen (2014)
 
Vortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt GladbeckVortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
 
Webinar - Maschine kaputt - finde den Fehler!
Webinar - Maschine kaputt - finde den Fehler!Webinar - Maschine kaputt - finde den Fehler!
Webinar - Maschine kaputt - finde den Fehler!
 
iPad Angebote deutscher Printtitel
iPad Angebote deutscher PrinttiteliPad Angebote deutscher Printtitel
iPad Angebote deutscher Printtitel
 
"VIFU" – Virtual Instructions for Use Virtuelle Bedienungsanleitungen zur Ste...
"VIFU" – Virtual Instructions for Use Virtuelle Bedienungsanleitungen zur Ste..."VIFU" – Virtual Instructions for Use Virtuelle Bedienungsanleitungen zur Ste...
"VIFU" – Virtual Instructions for Use Virtuelle Bedienungsanleitungen zur Ste...
 
Vorteile von Kundenblogs anhand der Fallstudie Baur-Kundenblog
Vorteile von Kundenblogs anhand der Fallstudie Baur-KundenblogVorteile von Kundenblogs anhand der Fallstudie Baur-Kundenblog
Vorteile von Kundenblogs anhand der Fallstudie Baur-Kundenblog
 
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
 
Ontego Mobility Platform für Apps auf beliebiger Hardware in beliebigen Backe...
Ontego Mobility Platform für Apps auf beliebiger Hardware in beliebigen Backe...Ontego Mobility Platform für Apps auf beliebiger Hardware in beliebigen Backe...
Ontego Mobility Platform für Apps auf beliebiger Hardware in beliebigen Backe...
 
Fonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor BenutzeroberflächeFonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor Benutzeroberfläche
 
Anforderungen an das Touchscreen-Design
Anforderungen an das Touchscreen-DesignAnforderungen an das Touchscreen-Design
Anforderungen an das Touchscreen-Design
 
Kaufabbruch in letzter Sekunde? Mit UX Testing die Conversion Rate steigern
Kaufabbruch in letzter Sekunde? Mit UX Testing die Conversion Rate steigernKaufabbruch in letzter Sekunde? Mit UX Testing die Conversion Rate steigern
Kaufabbruch in letzter Sekunde? Mit UX Testing die Conversion Rate steigern
 
result App-Forschung
result App-Forschungresult App-Forschung
result App-Forschung
 
Der Weg zum nutzerzentrierten Unternehmen
Der Weg zum nutzerzentrierten UnternehmenDer Weg zum nutzerzentrierten Unternehmen
Der Weg zum nutzerzentrierten Unternehmen
 
Mockups prototyping
Mockups prototypingMockups prototyping
Mockups prototyping
 
Print, Web, App – Multi-Channel-Marketing im täglichen Leben eines Handelsunt...
Print, Web, App – Multi-Channel-Marketing im täglichen Leben eines Handelsunt...Print, Web, App – Multi-Channel-Marketing im täglichen Leben eines Handelsunt...
Print, Web, App – Multi-Channel-Marketing im täglichen Leben eines Handelsunt...
 
Nutzerzentriertes Küchen Design - Die Küche der Zukunft
Nutzerzentriertes Küchen Design -  Die Küche der ZukunftNutzerzentriertes Küchen Design -  Die Küche der Zukunft
Nutzerzentriertes Küchen Design - Die Küche der Zukunft
 
Einführung in die Mobile Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile Produktentwicklung: Konzeption, Design, Entwicklung,...Einführung in die Mobile Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile Produktentwicklung: Konzeption, Design, Entwicklung,...
 
Einsatz von Social Software für Online-Marketing und virtuelle Zusammenarbeit...
Einsatz von Social Software fürOnline-Marketing und virtuelle Zusammenarbeit...Einsatz von Social Software fürOnline-Marketing und virtuelle Zusammenarbeit...
Einsatz von Social Software für Online-Marketing und virtuelle Zusammenarbeit...
 
Low Budget Usability Testing Webtreff Konstanz Patric Schmid Benutzerzentrale
Low Budget Usability Testing Webtreff Konstanz Patric Schmid BenutzerzentraleLow Budget Usability Testing Webtreff Konstanz Patric Schmid Benutzerzentrale
Low Budget Usability Testing Webtreff Konstanz Patric Schmid Benutzerzentrale
 

Mehr von soultank AG (6)

Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016
 
Usability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-BernUsability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-Bern
 
Usability coffee-mobile protptyping
Usability coffee-mobile protptypingUsability coffee-mobile protptyping
Usability coffee-mobile protptyping
 
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
 
Prototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer WebsitePrototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer Website
 
Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!
 

Mobile Protptyping, Usability Coffee, Zug, 19.02.105

  • 1. Mobile Prototyping Usability Coffee, Zug, 19. Februar 2015
  • 2. Usability Erfahrung seit 2013 Bachelor Thesis zum Thema Usability Tests und Testleitereffekt Studium: Pädagogische Hochschule PHSH (Bachelor of Arts Primary Education) seit 2006 Angewandte Psychologie (B SC FHNW Angewandte Psychologie) seit 2014 stefanie.friedli@soultank.ch Stefanie Friedli Usability Consultant | Folie 2soultank AG | Usability Coffee | 18. Februar 2015
  • 3. soultank AG | Usability Coffee | 18. Februar 2015 Wissenschaftlich fundiertes Beratungsunternehmen Seit 1996 im Bereich Usability und Ergonomie tätig 2000 Gründung soultank AG in Zug 6 Usability-Experten Betrieb eines Usability-Labors in Zug Europaweit tätig, Fokus Schweiz Über soultank AG | Folie 3 Wir sind die unabhängigen Usability-Experten mit unvoreingenommenem Blick auf Ihr Produkt
  • 4. Referenzen soultank AG soultank AG | Usability Coffee | 18. Februar 2015 | Folie 4 Weitere Referenzen: www.soultank.ch/content/referenzen
  • 5. soultank AG | Usability Coffee | 18. Februar 2015 Seite 5 User Centred Design (UCD)
  • 6. soultank AG | Usability Coffee | 18. Februar 2015 Seite 6 User Centred Design (UCD)
  • 7. soultank AG | Usability Coffee | 18. Februar 2015 Seite 7 User Centred Design (UCD)
  • 8. soultank AG | Usability Coffee | 18. Februar 2015 Seite 8 User Centred Design (UCD)
  • 9. soultank AG | Usability Coffee | 18. Februar 2015 Seite 9 User Centred Design (UCD)
  • 10. soultank AG | Usability Coffee | 18. Februar 2015 Seite 10 Wenn immer möglich, baue früh einen Prototypen Was ist das Ziel und Zeck des Prototypen? Diese zwei Tools (Programme) fürs Prototyping haben sich bewährt: Balsamique Axure Teste so früh, wie möglich den Prototyp auf dem Zielgerät (mobile Phone) Teste den Prototyp mit realen Benutzern Kernaussagen von heute
  • 11. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 11soultank AG | Usability Coffee | 18. Februar 2015
  • 12. 12 Verschiedene Arten von Prototyping 1 2 soultank AG | Usability Coffee | 18. Februar 2015
  • 13. 13 Verschiedene Arten von Prototyping 3 soultank AG | Usability Coffee | 18. Februar 2015
  • 14. 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 funktionsfähige Vorabversion einer Benutzeroberfläche. Mit ihr kann früh getestet werden, ob die Anwendung die Anforderungen erfüllt. Quelle: Wikipedia / gc-upa soultank AG | Usability Coffee | 18. Februar 2015
  • 15. Visualisieren von Anforderungen Diskutieren von Design-Lösungen im Projekt Evaluieren von Design-Lösungen mit Benutzern Vergleich von verschiedenen Varianten Präsentation für Überzeugungsarbeit 15 Einsatzgebiet von Prototypen Quelle: Christian Hübscher, 2007 soultank AG | Usability Coffee | 19. Februar 2015
  • 16. Wieso Prototyping? | Folie 16soultank AG | Usability Coffee | 18. Februar 2015
  • 17. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 17soultank AG | Usability Coffee | 18. Februar 2015
  • 18. Ermöglicht produktspezifisches Testing von Fragen, die nicht durch allgemeine Forschungsergebnisse oder Richtlinien beantwortet werden können Liefert relativ schnell bedeutungsvolle Rückmeldungen vom Benutzer Reduziert die totalen Entwicklungskosten für ein Produkt Kann früh im Entwicklungsprozess eingesetzt werden 18 Vorteile des Prototyping soultank AG | Usability Coffee | 18. Februar 2015
  • 19. Reduziert Missverständnisse Geht tiefer als Bilder oder Skizzen (zeigen und erzählen) → lässt einem das Design erleben Beste Lösung überlebt → Survival the fittest Adaptiv, immer veränderbar Produziert fokussiert Produkte Zeigt Fehler früh Reduziert Risiko (Spart Zeit, Geld, Arbeit) Vorteile des Prototyping | Folie 19soultank AG | Usability Coffee | 18. Februar 2015
  • 20. Begrenzungen und Randbedingungen, auf die das reale Produkt trifft, werden oft während des Prototyping zu stark vernachlässigt Erzeugung unrealistischer Erwartungen für die Fähigkeiten 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
  • 21. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 21soultank AG | Usability Coffee | 18. Februar 2015
  • 22. Welches Tool? Wichtigste Frage: Was ist mein Ziel? Welche Frage will ich beantworten? Idee überprüfen? Lo-Fi Benennung & Funktionsweise prüfen? Lo-Fi Überzeugungsarbeit leisten? Hi- Fi 22soultank AG | Usability Coffee | 18. Februar 2015 Lo-Fi Hi-Fi
  • 23. Skizzieren von Hand App: Camscanner Plus (2CHF) Prototyp erstellen: von Hand fast and easy | Folie 23soultank AG | Usability Coffee | 18. Februar 2015
  • 24. Papier, Bleistift, Post-it etc. Mit kleben, kopieren kombinierbar Whiteboard Anderes Präsentationsmaterial Vorteile: schnell und einfach, Erarbeitung in der Gruppe, Material verfügbar, von jedem benutzbar Nachteile: Änderungen evtl. umständlich Paper and Pencil | Folie 24soultank AG | Usability Coffee | 18. Februar 2015
  • 25. Büro-/Grafik Software Spezialisierte Prototyping- Applikationen Entwicklungs-Umgebungen Vorteile: Änderungen und Variationen schnell und einfach, einfach elektronisch zu verteilen Nachteile: Lernaufwand für das Tool, für einfache Sachen aufwändiger als von Hand Prototyp erstellen: mit Computer | Folie 25soultank AG | Usability Coffee | 18. Februar 2015
  • 26. Balsamiq Schnell, verteilbar und unfertig aussehend | Folie 26soultank AG | Usability Coffee | 18. Februar 2015 Als PDF auf dem Smartphone oder Tablet Klickbar
  • 27. Vorteile: Sieht unfertig aus (wie bei Paper & Pencil) Elektronisch und darum verteilbar PDF auf Tablet oder Smartphone lauffähig Relativ schnell eingearbeitet Beschränkte Möglichkeiten bei Interaktivität und Visual Design Nachteile: Beschränkte Möglichkeiten bei Interaktivität und Visual Design Interaktivität: Verlinkbare Seiten, keine Interaktion innerhalb der Seite 27 Balsamiq Mockups soultank AG | Usability Coffee | 18. Februar 2015
  • 28. Axure Aufwändiger, mächtiger und verteilbar | Folie 28soultank AG | Usability Coffee | 18. Februar 2015
  • 29. Vorteile: Per Mausklick gibt es einen HTML-Prototypen Auch auf Tablets und Mobiltelefonen einsetzbar Interaktionen können sehr realistisch gemacht werden (Flyout etc.) Relativ schnell eingearbeitet (im Vergleich zu HTML/CSS lernen) Masterelemente können definiert werden (z.B. Navigation, Header) Grosse Bibliothek und viele Komponenten für die grafische Benutzeroberfläche Man kann einzelne Elemente kommentieren und so auch eine Word-Dokumentation generieren 29 Axure: Vorteile soultank AG | Usability Coffee | 18. Februar 2015
  • 30. Nachteile: HTML kann/sollte nicht weiterverwendet werden Kein „Design-Tool“ zum z.B. schöneabgerundete Buttons zu gestalten (wie Visio, Photoshop) 30 Axure: Nachteile soultank AG | Usability Coffee | 18. Februar 2015
  • 31. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 31soultank AG | Usability Coffee | 18. Februar 2015
  • 32. Den Prototyp möglichst früh auf dem Zielgerät (Smartphone oder Tablet) anschauen Gründe: Probleme mit der Darstellung (z.B. Schriftgrösse und Kontrast) Z.B. Times New Roman anders auf iPhone und Android Ist es auch auf dem Zielgerät gut ersichtlich? Grosser Unterschied zum Desktop Besonders wichtig beim mobile Prototyping 1 | Folie 32soultank AG | Usability Coffee | 18. Februar 2015
  • 33. Möglichst früh definieren, wie die Auflösung (px) des Prototypen sein soll Dies hängt ab davon, was für ein Zielgerät man verwendet für Usability Tests. Dieses auch möglichst früh definieren. Grund: Die Auflösung (px) hat Einfluss auf die Platzverhältnisse und die Darstellung des mobile Prototypen Besonders wichtig beim mobile Prototyping 2 | Folie 33soultank AG | Usability Coffee | 18. Februar 2015
  • 34. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 34soultank AG | Usability Coffee | 18. Februar 2015
  • 35. Beispiel Waschmaschine V-Zug | Folie 35soultank AG | Usability Coffee | 18. Februar 2015
  • 36. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 36soultank AG | Usability Coffee | 18. Februar 2015
  • 37. Gezielt die Seiten prototypen, welche nötig sind um die offenen Fragen im Usability Test nachher zu klären Orientieren Sie sich an den Szenarien Die Szenarien definieren die wichtigsten Aufgaben Für diese Aufgaben brauchen Sie Screens im Prototypen Während dem Prototypen werden neue Ideen generiert Iterative Natur des Entwicklungsprozesses erfahren Daraus ergeben sich oft weitere Fragestellungen, welche Sie beantworten möchten Z.B. Verstehen Benutzer was «Produkte» bedeutet? Wäre «Haushaltsgeräte» besser? Mobile Prototyp fürs eigene Projekt: Tipps 1/2 | Folie 37soultank AG | Usability Coffee | 18. Februar 2015
  • 38. Immer mit Zeichnen beginnen. Ist schneller als mit Software Profitipp: App «CamScanner» verwenden zum fotografieren Prototyp möglichst früh bereits auf Gerät auf welchem Usability Test gemacht wird anschauen, ob Grösse stimmt Z.B. Tablet, Smartphone, Desktop-Computer Mobile Prototyp fürs eigene Projekt: Tipps 2/2 | Folie 38soultank AG | Usability Coffee | 18. Februar 2015
  • 39. Was ist (mobile) Prototyping? Vorteile und Nachteile des Prototyping Mobile Prototyping Mit Balsamiq Mit Axure Auf was achten bei mobile Prototyping? Mobile Prototyping auch für Hardware Mobile Prototyp fürs eigene Projekt: Tipps Literatur Inhaltsübersicht | Folie 39soultank AG | Usability Coffee | 18. Februar 2015
  • 40. Literatur 40 Carolyn Snyder - Paper Prototyping Todd Zaki Warfel - Prototyping soultank AG | Usability Coffee | 18. Februar 2015
  • 41. Herzlichen Dank für Ihre Aufmerksamkeit Bei Fragen stehen wir gerne zur Verfügung
  • 42. Nächste Termine in Zug Do, 15. April 2015, 07.30-08.30 Uhr Usability Coffee „Visual Thinking“ http://soultank.ch/content/ueber-uns/events/usability- coffee-zug/usability-coffee-zug-mi-15-april-2015/ Usability Coffee 2015 | Folie 42soultank AG | Usability Coffee | 18. Februar 2015
  • 43. Team soultank AG | Usability Coffee | 18. Februar 2015 | Folie 43 soultank AG Bahnhofplatz Postfach 4744 6304 Zug Tel: +41 41 726 50 20 Fax: +41 41 726 50 26 www.soultank.ch soultank AG c/o Ostsinn Bohl 2 9000 St. Gallen Gaby Surber Monique Andres Marcel B.F. Uhr Iris Müller Bianca Redel Andreas Bossard Adrian Lauper Stefanie FriedliSandro Fernandes Matthias Chavanne Remo Bertschinger Jérome Fischer