Usability und
mediengerechte Gestaltung
für mobiles Marketing

Agenda
Annika Brinkmann
Themes und Branding
Content/Wahl der Plattform
Betrachtungen zur Usability
Mobile Screen Design
© Annika Brinkmann – www.absichtbar.de

Annika Brinkmann
Jahrgang 1978
Studium Kommunikationsdesign an der (F)HTW Berlin
Diplom 2003 über Navigationsstrukturen im Internet
Senior-Designerin und Ausbilderin (AEVO) für Mediengestalter
bei iconmobile Berlin (2004-2007)
Selbständig als Mobile Screen Designerin seit August 2007
Kunden aus dem Agenturbereich und der freien Wirtschaft
Projekte u.a. internationale Content-Portale, Presse-Portal und
Flirt- und Ausgeh-Communities, Widgets und Applikationen
© Annika Brinkmann – www.absichtbar.de

Themes und Branding

Kombination: Screen- & Hardware-Branding
Operator
Operator
07.01.2009
07.01.2009
LSK RSK
LSK RSK
© Annika Brinkmann – www.absichtbar.de

Content/Wahl der Plattform

Applikation, WAP, oder Widget - Wahl der Technik
Applikation WAP-Portal Widget
Darstellung Java/Symbian/Flash- xHTML/CSS xHTML/CSS + Ajax
Lite... + Ajax (High-End)
... iPhone eigene SDK + eigene Tags eigene SDK
Produkticon im Game- oder Favoritenliste des Plattformabhängig
Hauptmenü Browsers oder via im Hauptmenü oder
Micro-Applikation eigener Umgebung
... iPhone Menü/Unterseite durch den User als Menü/Unterseite
Shortcut setzbar
Verbreitung fast alle Geräte fast alle Geräte Neue Geräte nativ,
(außer Einsteiger-) (außer Einsteiger-) ältere mit Java-App/
Firmware-Update
Traffic 1*Paket Einzelseiten 1*Paket
+ Aktuelle Daten + Aktuelle Daten
© Annika Brinkmann – www.absichtbar.de

Applikation, WAP, oder Widget - Wahl der der Technik
Applikation WAP-Portal Widget
viel Einfluss
kein Einfluss
Softkeybelegung Push-Aktualisierung Übergänge animiert
Offline-Nutzung Aktualitätsgarantie Personalisierung
© Annika Brinkmann – www.absichtbar.de

WAP: Das beste Design für die jeweiligen Möglichkeiten
Special
XHTML High-End
XHTML Low-End
WML
1G 2G 2.5G 3G 3.5G
© Annika Brinkmann – www.absichtbar.de

Fullscreen/Transparenz-Unterstützung
© Annika Brinkmann – www.absichtbar.de

Betrachtungen zur Usability

Komponenten der Benutzbarkeit
mediengerechte
Querverlinkung Markenpräsentation
Device-Adaption
Linkkonzept
Lesbarkeit
Datenhierarchie
Contentintegration Bildkonzept
Wording Konzeptvisualisierung
Personalisierung
Farbkonzept
Querverlinkung
Grafikproduktion
Flow-Optimierung
Konzept Design
© Annika Brinkmann – www.absichtbar.de

Unterschiedliche Geräte, jedoch einheitliche Benutzung
© Annika Brinkmann – www.absichtbar.de

5-Wege Fokus-, Accesskey- und (Finger-)Touch-Screen-Navigation
1
2
3
4
5
6
7
8
9
0
OK Seite zurück OK Seite zurück
OK OK
1 2 3
4 5 6
7 8 9
* 0 #
© Annika Brinkmann – www.absichtbar.de

Browser-Fläche = Screengröße - Scrollbar - Titel Bar - Softkeyarea
Breite „Usable width“
Titel Bar
Indicator Bar
Adress-Feld mit Google-Suche
Browser-Höhe (kann verborgen werden)
Scroll-Bar
„Above the fold“
Navigation & Inhalt
Softkey-Area
Browser-Funktionalität
(Vor, Zurück, Lesezeichen,
Seiten-Manager)
© Annika Brinkmann – www.absichtbar.de

Unterschiedlichste
Screengrößen und Formate
© Annika Brinkmann – www.absichtbar.de

Formulare gehören zu den größten Herausforderungen
© Annika Brinkmann – www.absichtbar.de

Werbung in WAP-Portalen, Games, Applikationen, via Menü-Icons
Angebotsbeschreibung
Personalisierung
Auslöser
Menu
LSK RSK
© Annika Brinkmann – www.absichtbar.de

Vom Banner zum Info-Teaser und personalisiertem Zugriff
© Annika Brinkmann – www.absichtbar.de

Farb-, Navigations-, Content- und Personalisierungskonzept
© Annika Brinkmann – www.absichtbar.de

Mobile Screen Design

Mediengerechtes Design
© Annika Brinkmann – www.absichtbar.de

Ob hell oder dunkel – die Lesefreundlichkeit darf nicht leiden!
© Annika Brinkmann – www.absichtbar.de

Unterschiedliche Screenbreiten = erhöhter Produktionsaufwand
© Annika Brinkmann – www.absichtbar.de

Client: graphische Elemente können übereinander dargestellt werden
© Annika Brinkmann – www.absichtbar.de

Ad-Platzierung: zwischen Integration und Abgrenzung
© Annika Brinkmann – www.absichtbar.de

Flexibel aufgebautes xHTML für Flip-Screens – jedes Pixel ist kostbar
© Annika Brinkmann – www.absichtbar.de

Annika Brinkmann
Diplom Designerin fh
Straßmannstraße 36
10249 Berlin. Germany
+49 (0) 30 - 21 02 74 35
+49 (0) 176 - 23 64 35 49
annika.brinkmann@absichtbar.de
www.absichtbar.de
AGD Mitglied 08421