UxHH Talk - Der Weg zu barrierefreien Apps durch UX Design

Post on 04-Jun-2015

531 views 3 download

description

Barrierefreiheit im Netz und auf mobilen Endgeräten hat in den letzten Jahren stark an Popularität zugenommen. Aber wie genau entsteht ein barrierefreies "Universal Design" mit exzellenter User Experience? Mit diesem Vortrag werde ich Einblicke in den Entwicklungsprozess für eine iPhone App geben. Das Ziel: Sehbehinderten Menschen eine Anwendung zur Verfügung zu stellen, die es ermöglicht, an jedem Ort und zu jeder Zeit gedruckten Text einfach lesen zu können. Dabei werde ich sowohl auf die verwendeten Methoden zum UX Design eingehen, aber auch über Zufälle und Hindernisse sprechen, die mir mit meinem Team während des Entwicklungsprozesses widerfahren sind - als Handlungsanstoss, Ideengebung und Diskussionsgrundlage für künftige UX Design Projekte mit Barrierefreiheit.

Transcript of UxHH Talk - Der Weg zu barrierefreien Apps durch UX Design

Der Weg zu barrierefreien Apps durch UX Design

Ein Erfahrungsbericht

1

Über mich

Frank Wippich Wirtschaftsingenieur / MBA und 10 Jahre Erfahrung in F&E von Technologieprodukten

2

Über Blindsight

Gründung der Blindsight Corporation, USA

Ziel: Forschung und Entwicklung von Text und Objekterkennung zur Unterstützung von Blinden und Sehbehinderten

Expansion nach Europa mit Gründung der Blindsight Europe GmbH in Hamburg, Deutschland

Markteinführung verschiedener Produkte - Text Detektiv (iPhone App), Perkolator (Brailletrainingssoftware MacOS), Smart Magnifier (iPad)

3

1996

2012

Building Software to Help People Read

• ... vielleicht dochnoch nicht ganz!

“print is dead”

4

Die Probleme mit gedruckten Text

• Sehbehinderungen

5

• Sprache

Die Lösung - Texterkennung

• das Smartphone oder das Tablet als Textdetektor

6

• sekundenschnell• korrekte Ergebnisse• barrierefrei

Ausgangslage

• Patentierte Texterkennung

• iOS als die Plattform der Wahl

• Erste Erkenntnisse aus Interviews mit Lead Usern– Unabhängigkeit

• Orientierung• Lesen von Text in der Umwelt

– Informationen suchen und abrufen von unterwegs

7

Wie baut man daraus eine App die Nutzer begeistert?

UX Design Struktur

8

Information Architecture

Aufnahme, Verarbeitung und Präsentation von Text

Hilfestellungen

UsabilityWas?Wo?Wie?

User ExperienceInhalt

BenutzungContext

1 2

3

4

Der erste Prototype

9

• Orientierung der App in Hochformat• Texterkennungsvibration + Shake = Textausgabe• Einzelresultate• Einführungen wurden mündlich erteilt

Erkenntnisse

Information Architecture

– Simpler Einführungsscreen

– Notifikation wenn Text erkannt ist

– Präsentation des Textes in einzelnen Zeilen und bei Bedarf gesamter Text

– Interaktion mit Entwicklern / Support

– Tipps zur Benutzung

10

– Tutorium + simpler Einführungsscreen

– Notifikation wenn Text erkannt ist

– Präsentation des Textes gesamt und bei Bedarf in einzelnen Zeilen

– Interaktion mit Entwicklern / Support

– Tipps zur Benutzung

– Bearbeitung von Text

– Speicherung, Zugriff auf und Weiterverarbeitung von Scans

Ausgangshypothese

Erkenntnisse

Usability

– Welcher Text wird gelesen?

– Wo wird Texterkennung am meisten benötigt?

– Wie benutzen Blinde das Smartphone, die Kamera?

– Wie navigieren Blinde das Smartphone?

11

– Dokumente, Menüs, Flyer, Briefe, Türschilder, Computernachrichten

– Unterwegs und zur Durchführung des schnellen Scans

– Mit Referenzpunkten und viel Übung

– Standard VoiceOver Funktionen:– mit einfachen Swipes und

Buttons– Hochformat– Ausrichtungssperre aktiv

Ursprungsfragen

Erkenntnisse

User Experience

– Minimum Button Clicks

– Informationen geben ob • Text gefunden wurde• Text übersetzt wird• Fehler beim übersetzen

enthalten sind

– Textübersetzung in nicht mehr als 2 Sekunden

– Hochformat12

– Besser mehr Button clicks als alternative Eingabemethoden (Swipe, Shake, etc.)

– Informationen geben zu:• Text gefunden / nicht

gefunden und übersetzt wird

– Zeittoleranz steigt wenn gleich der ganze Text übersetzt wird

– Querformat

Ausgangshypothese

Resultat

13

This is just totally awesome especially

for the blind. I am totally independent now for doing mail and small stuff

Best OCR app on the App Store. Having tried several OCR

apps, this one is the most accurate and by far the fastest

Great for scanning on the fly

I’ve shown many [blind] students how to use it, and they all walk away pretty impressed

App Store Review - 4 Stars

App Store Review - 5 Stars

App Store Review - 5 Stars

Rachel Feinberg, teacher of the blind and visually impaired

Klasse Ergebnisse! Für Blinde sehr zu empfehlen! App Store Review - 5 Stars

Methoden

14

Information Architecture

InterviewsMockups

UsabilityInterviews

ObservationenMockups, A/B Testing

User ExperienceStoryboarding / Mockups

Konkurenz- und ähnliche AppsSzenarien, A/B Testing

Was bedeutet das für UX - Design (1/2)

• Technisch ist eine barrierefreie UX kein Hexenwerk mehr

• Touchscreens sind kein Gegensatz mehr zum barrierefreien Design - eher im Gegenteil– Smartphones und Tablets bieten grosses Potential insbesondere für

Menschen mit Behinderung und die alternde Bevölkerung

• Standardkonventionen helfen bei einer intuitiven Benutzeroberfläche - müssen aber auch manchmal gebrochen werden.

15

Was bedeutet das für UX - Design (2/2)

• Kontextverständis ist entscheidend - d.h. Selbsttests, Beobachtungen, Interviews...

• Intensives Einbinden der Nutzergruppen in den Entwicklungsprozess

• non-visuelle UX wird durch sequenzielle Abläufe bestimmt, die die visuelle, synchrone UX positiv beeinflussen.

16

Hypothese

17

Barrierefreies UX Design als Innovationstreiber für alternative, non-visuelle

Interaktionsmethoden, wie Haptik, Audio, Sprache, Gestik

In eigener Sache

Text DetektivBarrierefreies scannen von Text in

Dokumenten, Schildern oder Broschüren auf iOS Geräten - ideal für

den schnellen Infoüberblick

18

Preis: €8,99 Preis: €179,99

Smart MagnifierErkennen, Filtern und Vergrößern von Text

mit dem iPad - für ein einfaches Lupenerlebnis ohne Zusatzgeräte

Kontakt

www.de.blindsight.com

Frank Wippich email: fwippich@blindsight.com twitter: @fwippich

19

20

Vielen Dank

Software to Help People Read!

Blindsight Europe GmbH Lerchenstraße 28a c/o betahaus 22767 Hamburg http://de.blindsight.com twitter: @blindsightDE info@blindsight.com