Usability Im Mobile Web
of 20
/20
-
Upload
inserteffect-gmbh -
Category
Technology
-
view
1.741 -
download
1
Embed Size (px)
description
Mobile Usability - Entscheidend für Hopp oder Flopp einer mobilen Lösung • Usability Dos & Don'ts im mobilen Kontext • Endgeräte-übergreifendes Konzept und Design insertEFFECT, Benno Bartels; Mobile Solutions
Transcript of Usability Im Mobile Web
web mobile specialists
Entscheidend für Hopp oder Flopp einer mobilen Lösung
Mobile Usability
Benno Bartels , 29.01.2010 M-Days, München
© insertEFFECT 2© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
3
MarketingEntwicklung
Usability
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Danke iPhone!
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Die Sorgenkinder des mobilen Webs.
Verb
indu
ng
Eing
abe
Aus
gabe
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Die Sorgenkinder des mobilen Webs.
Eingabe
Mouse-Navigation ohne Maus
(scrollen, markieren, drag‘n‘drop … )
Textinput on mobiles sucks!
(egal ob Touch, Numpad oder Qwerty)
Die Welt lenkt mich ab!
(Unterbrechungen, Eingehende Anrufe, …)
Verb
indu
ng
Eing
abe
Aus
gabe
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Die Sorgenkinder des mobilen Webs.
Verbindung
...... …… … .. . . . . . . . . . . ich hab grad kein Netz!
Verb
indu
ng
Eing
abe
Aus
gabe
Die Sorgenkinder des mobilen Webs.
Ausgabe
Seitenlayout
(für... 128 x 128 … 176 x 208 ... 352 x 416 … 480×320 … ?!?)
Wenig Platz
(Wohin mit der Navigation? Wo bin ich?)
Browsereigenheiten
(JavaScript APIs, HTML-Bugs und seltsame Dialekte)
Verb
indu
ng
Eing
abe
Aus
gabe
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Der Weg zur benutzerfreundlichen mobilen Website
Endgeräte klassifizierenKonzept ausdenken Wireframe erstellen Usability Test des Prototypen
Wireframe anpassen/ optimieren GUI entwerfen GUI testen Website entwickeln
Usability Test durchführen Ergebnisse einarbeiten Online stellen
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Presenter
Presentation Notes
Definition der 3 Geräteklassen nach Nielsen (von links nach rechts) 1. Feature phones (regular cellphones) with a tiny screen and a numeric keypad. These devices account for the vast majority of the market (at least 85% in some statistics). 2. Smartphones, in a range of form factors, typically with a mid-sized screen and a full A-Z keypad. 3. Touch-screen phones (such as the iPhone) with a nearly device-sized screen and a true GUI driven by direct manipulation and touch gestures.
Endgeräte klassifizieren….
Zielguppe
(breite Masse bis spezielles Publikum, Altersstruktur)
Logfiles der Website
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Der Weg zur benutzerfreundlichen mobilen Website
Endgeräte klassifizierenKonzept ausdenken Wireframes erstellen Usability Test des Prototypen
Wireframe anpassen/ optimieren GUI entwerfen GUI testen Website entwickeln
Usability Test durchführen Ergebnisse einarbeiten Online stellen
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Presenter
Presentation Notes
Definition der 3 Geräteklassen nach Nielsen (von links nach rechts) 1. Feature phones (regular cellphones) with a tiny screen and a numeric keypad. These devices account for the vast majority of the market (at least 85% in some statistics). 2. Smartphones, in a range of form factors, typically with a mid-sized screen and a full A-Z keypad. 3. Touch-screen phones (such as the iPhone) with a nearly device-sized screen and a true GUI driven by direct manipulation and touch gestures.
Wireframes erstellen und testen
Desktop: http://www.inserteffect.com/showcase/clickdummy Mobile : http://tinyurl.com/insfxclick
Klickbare Wireframes
(… zwingen zu durchdachtem
Konzept)
Desktop und Mobile testen
(… nur so kommen Probleme zum
Vorschein)
Userfeedback einholen
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Der Weg zur benutzerfreundlichen mobilen Website
Endgeräte klassifizierenKonzept ausdenken Wireframes erstellen Usability Test des Prototypen
Wireframe anpassen/ optimieren GUI entwerfen GUI testen Website entwickeln
Usability Test durchführen Ergebnisse einarbeiten Online stellen
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Presenter
Presentation Notes
Definition der 3 Geräteklassen nach Nielsen (von links nach rechts) 1. Feature phones (regular cellphones) with a tiny screen and a numeric keypad. These devices account for the vast majority of the market (at least 85% in some statistics). 2. Smartphones, in a range of form factors, typically with a mid-sized screen and a full A-Z keypad. 3. Touch-screen phones (such as the iPhone) with a nearly device-sized screen and a true GUI driven by direct manipulation and touch gestures.
Usability Test durchführen
„Handyschlitten“
(Testkandidaten bringen ihr eigenes Handy mit)
Nur 5-7 Testpersonen
(das reicht um Probleme aufzudecken)
Spezielle Aufgaben geben
Zum „laut Denken“ animieren
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Zutaten für eine gute User Experience Eingabe der URL
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Zutaten für eine gute User Experience Objekt - Suche
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Zutaten für eine gute User Experience Suchergebnislisten
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Zum Mitnehmen
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
© insertEFFECT 19© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
© inserfEFFECT |20
Kontact
Benno Bartelsmail: [email protected]: 09 11 / 27 44 87 -11
Fürther Strasse 53aD-90429 Nürnberg
© insertEFFECT – web mobile specialists Mobile Web Development http://insfx.mobi
Danke!
![[Mobile Usability Study] Tablet-Nutzer auf Shopping-Tour in Mode-Webshops](https://static.fdokument.com/doc/165x107/54b40c024a7959d81e8b46ba/mobile-usability-study-tablet-nutzer-auf-shopping-tour-in-mode-webshops.jpg?t=1702118956)
