Wenn Sie auf einer Website ein Produkt kaufen, einen Flug buchen oder einen Termin vereinbaren, muss ziemlich viel glatt gehen: Die jeweilige Funktion muss vorhanden sein, sie muss auffindbar sein, sie muss leicht bedienbar sein – und dann sollte sie natürlich auch zum gewünschten Ergebnis führen. Zu all diesen Dingen hat sich vorher jemand Gedanken gemacht – in großen Digitalprojekten sind Konzepter dafür verantwortlich.
Der Vortrag erläutert anhand von Beispielen, wie in Digitalagenturen große Informationsportale und Anwendungen entstehen, und welche Rolle dabei Konzepter bzw. User Experience Designer einnehmen. So soll der vielfältige Arbeitsalltag dieses Berufs gezeigt und klargemacht werden, wie Konzepter sowohl Nutzerbedürfnissen als auch Auftraggeberzielen gleichermaßen gerecht werden müssen. Außerdem werden aktuelle Themen und Trends der Branche diskutiert.
Der Vortrag wurde am 28. April 2015 am Institut für Bibliotheks- und Informationswissenschaft (IBI) der Humboldt-Universität Berlin im Rahmen der Reihe "Berliner Bibliothekswissenschaftliches Kolloquium" (BBK) gehalten.
Auf der Website der Veranstaltung gibt es auch einen Screencast aus Folien und Audiomitschnitt:
https://www.ibi.hu-berlin.de/de/bbk/abstracts/ss15/freimark
1. Berufsbild
KonzepterUser Experience in der Praxis
bd Creative Commons Lizenz für diese Präsentation. Für verwendete Bilder gelten abweichende Lizenzen oder sie sind urheberrechtlich geschützt.
2. Themen
2
Wer ist Aperto?
Was ist User Experience?
Was macht ein Konzepter?
Der Arbeitsalltag anhand eines Beispiels
Wie wird man Konzepter?
Aktuelle Themen und Trends
01
02
03
04
05
06
3. Wer von Ihnen hat denn
schon mal vom Beruf
„Konzepter“ gehört?
17. Gute UX unterstützt Nutzer bei der Erledigung
ihrer Aufgaben.
17
Über ein Produkt
informieren
Preise recherchieren
Produkt/Service
bestellen
Weitere
Informationen
anfordern
Supportinfos finden
Mit Gleichgesinnten
austauschen
Öffnungszeiten
nachschlagen
Ansprechpartner
finden
Neuigkeiten
abfragen
An einer Diskussion
beteiligen
Termin
vereinbaren
Sich beschweren
Chatten
Inspirieren lassen,
stöben
18. Gute UX unterstützt Nutzer bei der Erledigung
ihrer Aufgaben.
18
SIM-Lock
entfernen
Studienbeginn
nachschlagen
Über einen
Krankheitsverlauf
informieren
Kinokarten
reservieren
Updates
herunterladen
Eine Veranstaltung
organisieren
Eine Reise
planen
Eine Rezension
schreiben
Podcast
abonnieren
Über ein Produkt
informieren
Preise recherchieren
Produkt/Service
bestellen
Weitere
Informationen
anfordern
Supportinfos finden
Mit Gleichgesinnten
austauschen
Öffnungszeiten
nachschlagen
Ansprechpartner
finden
Neuigkeiten
abfragen
An einer Diskussion
beteiligen
Termin
vereinbaren
Sich beschweren
Chatten
Inspirieren lassen,
stöben
22. Gute UX muss zu den Businesszielen unseres
Auftraggebers beitragen.
Unterstützt bei...
§ Umsatz, Cross-Selling, Up-Selling
§ Aufbau/Pflege eines bestimmten Image
§ Nutzung, Lead-Generierung, Kundenbindung, Neugierde
oder Vorfreude wecken
§ Weiterempfehlung, Verfassen einer positiven Rezension
§ Reduzierung von Hotline-Anfragen
§ Zufriedenheit erzeugen (z.B. durch erfolgreiche
Informationssuche, intuitive oder effiziente Bedienung)
22
23. Gute UX muss zu den Businesszielen unseres
Auftraggebers beitragen.
Vermeidet/Verringert...
§ Verwirrung und Frustration bei Nutzern
§ Kaufabbruch und Kaufreue
§ schlechte Rezensionen
§ hohes Anruferaufkommen beim Support
§ Beschwerden
23
24. Die UX wird durch Über-
legungen auf mehreren
Ebenen beeinflusst.
36. „Das Pergamonmuseum wurde nach Entwürfen
Alfred Messels durch Ludwig Hoffmann zwischen
1910 und 1930 errichtet. Zuvor hatte an gleicher
Stelle für wenige Jahre ein kleinerer Bau
gestanden. In ihm waren zunächst die bedeu-
tenden Ausgrabungsfunde der Berliner Museen,
wie die zwischen 1878 und 1886 geborgenen
Friesplatten des Pergamonaltars, untergebracht.
Ungenügende Fundamentierungen führten
jedoch bald zu Schäden am Gebäude, sodass es
abgerissen werden musste.“ Nicht desirable!
43. Konzepter sind die Hauptverantwortlichen für
die User Experience.
43
Elements of User Experience
uality: The Web was originally conceived as a hypertextual information space;
evelopment of increasingly sophisticated front- and back-end technologies has
ts use as a remote software interface. This dual nature has led to much confusion,
xperience practitioners have attempted to adapt their terminology to cases beyond
of its original application. The goal of this document is to define some of these
hin their appropriate contexts, and to clarify the underlying relationships among
ous elements.
Jesse James Garr
jjg@jjg.
sign: graphic treatment of interface
(the "look" in "look-and-feel")
Information Architecture: structural desig
of the information space to facilitate
intuitive access to content
n Design: development of
on flows to facilitate user tasks,
how the user interacts with
ionality
Navigation Design: design of interface
elements to facilitate the user's movemen
through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding
al Specifications: "feature set":
descriptions of functionality the site
ude in order to meet user needs
ds: externally derived goals
e; identified through user research,
hno/psychographics, etc.
ctives: business, creative, or other
derived goals for the site
Content Requirements: definition of
content elements required in the site
in order to meet user needs
Design: as in traditional HCI:
interface elements to facilitate
action with functionality
on Design: in the Tuftean sense:
the presentation of information
te understanding
software interface Web as hypertext syst
Visual Design: visual treatment of text,
graphic page elements and navigational
components
Concrete
Abstract
time
Conception
Completion
Functional
Specifications
Content
Requirements
Interaction
Design
Information
Architecture
Visual Design
Information Design
Interface Design Navigation Design
Site Objectives
User Needs
User Needs: externally derived goals
for the site; identified through user resear
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or oth
internally derived goals for the site
ented information-orien
30 March 20
44. Der perfekte Beruf...
44
§ für Kreative
§ für Analytiker
§ für Neugierige
§ für Generalisten
§ für Menschen, die gerne mit anderen zusammen arbeiten
46. Konzepter arbeiten mal so, mal so – je nach
Projekterfordernissen.
46
Mal allein...
Foto: Aperto AG
47. Konzepter arbeiten mal so, mal so – je nach
Projekterfordernissen.
47
...mal zusammen mit Kollegen aus anderen Disziplinen.
Foto: Aperto AG
48. Konzepter arbeiten mal so, mal so – je nach
Projekterfordernissen.
48
Beim Kunden präsentieren wir Ideen und Lösungen...
Foto: Stefan Freimark
49. Konzepter arbeiten mal so, mal so – je nach
Projekterfordernissen.
49
...oder moderieren Workshops.
Foto: Stefan Freimark
50. Konzepter arbeiten mal so, mal so – je nach
Projekterfordernissen.
50
Auch nach Vor-Ort-Terminen gibt es immer wieder Abstimmungen.
Foto: Stefan Freimark
52. Wir erstellen verschiedene Arbeitsergebnisse.
52
Übersichten
Foto: Stefan Freimark
Vergleich von MVV-Zeitkarten
IsarCard-Woche
IsarCard-Monat
IsarCardAbo
IsarCard9Uhr
IsarCard9UhrimAbo
IsarCard60
IsarCard60imAbo
AusbildungstarifI+II
IsarCardJob
AboPlusCard
IsarCard-Woche
IsarCard-Monat
IsarCardAbo
IsarCard9Uhr
IsarCard9UhrimAbo
IsarCard60
IsarCard60imAbo
AusbildungstarifI+II
IsarCardJob
AboPlusCard
Art (Dauer) Wochenkarte Monatskarte Monats- oder Jahreskarte Monatskarte Monats- oder Jahreskarte Monatskarte Monats- oder Jahreskarte Wochen- oder
Monatskarte
Jahreskarte Jahreskarte
Art (Abo) Bar Bar Abo Bar Abo Bar Abo Bar Firmen-Abo Abo
Gültigkeitsbereich je nach Anzahl der Ringe je nach Anzahl der Ringe je nach Anzahl der Ringe Innenraum, Außenraum
oder Gesamtnetz
Innenraum, Außenraum
oder Gesamtnetz
Innenraum, Außenraum
oder Gesamtnetz
Innenraum, Außenraum
oder Gesamtnetz
je nach Anzahl der Ringe je nach Anzahl der
Ringe
je nach Kombination
von Verkehrs-verbünden
Gültigkeitsdauer 1 Woche + bis 12:00 am
ersten Werktag der
Folgewoche
1 Monat + bis 12:00 am
ersten Werktag des
Folgemonats
1 Jahr 1 Monat + bis 12:00 am
ersten Werktag des
Folgemonats
1 Jahr 1 Monat + bis 12:00 am
ersten Werktag des
Folgemonats
1 Jahr 1 Woche oder 1 Monat 1 Jahr 1 Jahr
Übertragbarkeit ja ja wahlweise ja wahlweise ja wahlweise nein nein wahlweise
Mitnahme Kinder-Regelung Kinder-Regelung Kinder-Regelung Kinder-Regelung Kinder-Regelung nein nein nein Kinder-Regelung Erwachsenen-Minahme
SA + SO (4 Personen)
Ausschlusszeit nein nein nein MO-FR, 6-9 Uhr MO-FR, 6-9 Uhr MO-FR, 6-9 Uhr MO-FR, 6-9 Uhr nein nein nein
Für jeden? ja ja ja ja ja nur ab 60 nur ab 60 nein nur Firmen ja
Preis abhängig von Ringen abhängig von Ringen abhängig von Ringen + abhängig von Zonen abhängig von Zonen + abhängig von Zonen abhängig von Zonen + abhängig von Ringen + abhängig von Ringen + je nach KombinationPreis abhängig von Ringen abhängig von Ringen abhängig von Ringen +
Zahlungs-intervall
abhängig von Zonen abhängig von Zonen +
Zahlungs-intervall
abhängig von Zonen abhängig von Zonen +
Zahlungs-intervall
abhängig von Ringen +
Zahlungsintervall +
Ausbildungs-tarif
abhängig von Ringen +
Rabattstufe
je nach Kombination
von Verkehrs-verbünden
Verkaufsstellen Alle Verkaufsstellen +
Automanten
Alle Verkaufsstellen +
Automanten
2 Abo-Center + Online-
Bestellung
Alle Verkaufsstellen +
Automanten
2 Abo-Center + Online-
Bestellung
Alle Verkaufsstellen +
Automanten
2 Abo-Center + Online-
Bestellung
Alle Verkaufsstellen +
Automaten [vorherige
Ausstellung einer
Kundenkarte nötig!]
nur Tarifabteilung nur DB-Abo-Center
Landshut
Abo möglich? nein ja [Ist Abo] ja [Ist Abo] ja [Ist Abo] nein [Ist Abo] [Ist Abo]
Zahlungsweise vor Ort vor Ort Lastschrift vor Ort Lastschrift vor Ort Lastschrift vor Ort Abrechnung über Firma Lastschrift
Zahlungsintervall wöchentlich monatlich monatlich oder jährlich monatlich monatlich oder jährlich monatlich monatlich oder jährlich wöchentlich oder
monatlich
monatlich monatlich
Kündigung nötig? nein nein Ja [Abo] nein Ja [Abo] nein Ja [Abo] nein Ja [Abo] Ja [Abo]
Boni - - Carsharing + Tierpark - Carsharing + Tierpark - Carsharing + Tierpark - - Carsharing + Tierpark
Besonderheit 1 Erweiterungskarte für
andere Zonen verfügbar.
Erweiterungskarte für
andere Zonen verfügbar.
Erweiterungskarte für
andere Zonen verfügbar.
Erweiterungskarte für
andere Zonen verfügbar.
Erweiterungskarte für
andere Zonen verfügbar
("grüne Jugendkarte").
Weiterer Rabatt
gegenüber IsarCardAbo
Kostenlose BC25 bei
pers. Abo
Besonderheit 2 Keine Fahrten in der Keine Fahrten in der Fahrten in der Sperrzeit Fahrten in der Sperrzeit KundenkarteBesonderheit 2 Keine Fahrten in der
Sperrzeit möglich
Keine Fahrten in der
Sperrzeit möglich
Fahrten in der Sperrzeit
möglich.
Fahrten in der Sperrzeit
möglich.
Kundenkarte
erforderlich
Stand: 22. Juni 2007
Autor: Stefan Freimark, Phase 4 Communications GmbH (freimark@phase4.de)
58. Als Berater in Agenturen lernen
wir sehr unterschiedliche
Branchen kennen.
59. Als Berater in Agenturen lernen wir sehr
unterschiedliche Branchen kennen.
59
Automobilhersteller
Foto: commons.wikimedia.org/wiki/File:KUKA_Industrial_Robots_IR.jpg
60. Als Berater in Agenturen lernen wir sehr
unterschiedliche Branchen kennen.
60
Bildungswesen
Foto: commons.wikimedia.org/wiki/File:Vorlesung_Uni_Aachen.JPG
61. Als Berater in Agenturen lernen wir sehr
unterschiedliche Branchen kennen.
61
Ministerien und Behörden
Foto: flickr.com/photos/manoftaste-de/9786409793 + manoftaste.de (Christian Schnettelker)
62. Als Berater in Agenturen lernen wir sehr
unterschiedliche Branchen kennen.
62
Nutzfahrzeugbranche
Foto: commons.wikimedia.org/wiki/File:Hellmann_LKW.jpg
63. Als Berater in Agenturen lernen wir sehr
unterschiedliche Branchen kennen.
63
Gesundheitswesen
Foto: commons.wikimedia.org/wiki/File:US_Navy_060203-N-7711S-004_Hospital_Corpsman_3rd_Class_Justin_Brock_assists_during_a_hernia_operation_aboard_the_Nimitz-
class_aircraft_carrier_USS_Ronald_Reagan_(CVN_76).jpg
64. Die Art des Projekts kann
ebenfalls ganz unterschiedlich
sein.
69. 69
Es gibt zwei Arten von Konzeptern: werbliche
Kreativkonzepter und analytische Denker.
Foto: flickr.com/photos/jdhancock/5544815161 (JD Hancock) Foto: flickr.com/photos/wilhei/109403659 (Willi Heidelbach)
88. Unsere Ideen und Vorschläge präsentieren
wir während des gesamten Prozesses.
Foto: flickr.com/photos/evanforester/6732501771
89.
90. Im weiteren Verlauf arbeiten wir die Inhalts-
struktur feiner aus.
90
Screenshot: Stefan Freimark
91. Ein paar IA-Grundlagen (1/2)
– Apfel, Banane, Birne, Obst
+ Obst: Apfel, Banane, Birne, Zitrone
91
IA = Informationsarchitektur
Einheitliche
Granularität
– Berufseinstieg, International Office,
Bekanntmachungen
+ Career Center, International Office,
Studierendensekretariat [organisatorisch]
+ Berufseinstieg, Auslandsprogramm, Schlichtung,
Organisatorisches [thematisch]
Einheitliche
Semantik
92. Ein paar IA-Grundlagen (2/2)
– Meldungen, Mitteilungen, Bekanntmachungen
+ Meldungen, Pressemitteilungen, Amtliche
Bekanntmachungen
92
IA = Informationsarchitektur
Hohe
Trennschärfe
– Vor Studienbeginn, Im Studium, Abschluss
– Studium & Lehre, Forschen, Wirtschaft
+ Vor dem Studium, Im Studium, Nach dem
Studium [einheitlich durch Präposition + „Studium“]
+ Studium, Forschung, Wirtschaft [alles Nomen]
+ Geld anlegen, Existenz absichern, Eigentum
schützen [Nomen + Verb]
Geschlossenes
Vokabular
93. Die Funktionen werden genau durchdacht,
und in einem Flow Chart dokumentiert.
93
Screenshot: Stefan Freimark
94.
95. Ersten Skizzen zeigen, wie Inhalte/Funktionen
auf den Seiten angeordnet sein könnten.
Foto: Stefan FreimarkFoto: Stefan Freimark
96. Die Skizzen bzw. Scribbles werden auf Papier
zu feineren Wireframes ausgearbeitet.
Foto: Stefan FreimarkFoto: Stefan Freimark
97. Bei Bedarf zeichnen wir die Wireframes mit
einer Software wie Axure oder OmniGraffle.
Foto: Stefan FreimarkFoto: Stefan Freimark
98. Auch später im Projekt haben wir mit
Informationsarchitektur zu tun.
Foto: Stefan FreimarkFoto: Stefan Freimark
107. Bei der Qualitätssicherung (QS) prüfen wir die
fertige Website auf Fehler.
xxx
107
Screenshot: Stefan Freimark
108. Technische Fehler werden in einem
Bugtracking-System wie Jira festgehalten.
Foto: flickr.com/photos/marfis75/2939337382Screenshot: Stefan Freimark
111. Ausbildungen unserer Konzepter
111
§ Ausbildung zum Bankkaufmann + Weiterbildung Medienproduktion
§ Studium: Medienmanagement
§ Studium: Publizistik (Kommunikationswissenschaft)
§ Studium: Kommunikationsdesign
§ Studium: Publizistik & Amerikanistik
§ Studium: Gesellschafts- und Wirtschaftskommunikation
§ Studium: Neuere Deutsche Literatur, Philosophie, Soziologie
§ Studium: B.A. Integrated Design + MFA Interaction Design
§ Ausbildung zur Mediengestalterin Digital und Print
§ Ausbildung zum Facharbeiter für Offset-Drucktechnik + FH-Studium Medientechnik
§ Ausbildung zur Werbekauffrau, M.A. Politikwissenschaft & Geschichte
§ Studium Computerlinguistik und Anglistik
112. „Konzepter brauchen Neugier und Mut.“
112
Andrej Balaz
Foto mit freundlicher Genehmigung zur Verfügung gestellt von Andrej Balaz.
113. „Konzepter brauchen Neugier und Mut.“
113
Andrej Balaz
Foto mit freundlicher Genehmigung zur Verfügung gestellt von Andrej Balaz.
Und:
§ abstraktes Denkvermögen
§ methodische Vorgehensweise
§ Lust, in Strukturen, Prozessen und
Systemen/Zusammenhängen zu
denken
§ Empathie/Einfühlungsvermögen
§ Fähigkeit, komplizierte Zusammen-
hänge zu erklären
115. Verdienstmöglichkeiten
Bruttogehalt pro Monat (2015)
115
Erfahrungsstufe Berufserfahrung (ca.) Gehalt (ca.)
Director / Principal > 10 Jahre Berufserfahrung,
oft mit Führungsverantwortung
> 6.000 €
Senior > 5 Jahre Berufserfahrung,
Verantwortung für große Projekte
4.000 – 5.000 €
Mid-Level 2-4 Jahre Berufserfahrung als Konzepter,
Verantwortung für kleine Projekte oder Teilprojekte
2.800 – 3.500 €
Junior Abgeschlossenes Studium in relevanter
Fachrichtung
2.200 – 2.800 €
Trainee Erste Berührungspunkte,
z.B. durch Studium oder Praktika
ca. 1.500 €
Werkstudent Erste Berührungspunkte,
z.B. durch Studium oder Praktika
ca. 10-12 € pro Stunde
116. Es gibt noch andere Berufsbezeichnungen.
116
Generalisten:
§ Konzeptioner
§ User Experience Designer
Engere Tätigkeitsfelder:
§ User Researcher
§ Usability Professional
§ Informationsarchitekt
§ Interaction Designer
117. Es gibt Berufe/Rollen, die Ähnlichkeiten mit
Konzeptern haben.
117
§ Produktmanager
§ Product Owner
119. User Experience gewinnt an Bedeutung.
119
Grafik: commons.wikimedia.org/wiki/File:Human_evolution.svg
120. Service Design und Customer Experience sind
die nächsthöhere Stufe.
120
Grafik: flickr.com/photos/brandonschauer/3363169836/
121. Durch neue Geräte steigt die Komplexität.
121
Foto: Stefan Freimark
122.
123. Ich bin gespannt auf Ihre Fragen!
123
Foto: flickr.com/photos/highwaysagency/6032691030 (Highways Agency)
124. Danke
Stefan Freimark Senior-Konzepter
E-Mail stefan.freimark@aperto.de
Slideshare slideshare.net/sfreimark
Twitter @freimark
Aperto AG – In der Pianofabrik
Chausseestr. 5
10115 Berlin
www.aperto.de
127. Lizenzen und Bildrechte
Diese Präsentation ist unter CC BY-SA lizenziert:
www.creativecommons.org/licenses/by-sa/2.0
Sie können sie in ihrer Gesamtheit nutzen, kopieren, weitergeben,
senden, etc. – oder Teile und Ideen daraus z.B. für eigene Vorträge
verwenden.
Bitte beachten Sie, dass das Foliendesign dem Urheberrecht der
Aperto AG unterliegt.
Bitte beachten Sie, dass Fotos, Layouts, Grafiken und Diagramme
innerhalb dieser Präsentation nicht die CC BY-SA-Lizenz des
Gesamtwerks erben. Zwar sind einige Bilder ebenfalls unter dieser
Lizenz verfügbar, jedoch gelten auch abweichende Rechte –
teilweise sind sie auch urheberrechtlich geschützt und dürfen nicht
frei verwendet werden. Details finden Sie auf den folgenden Seiten.
127
143. Fotos von Stefan Freimark
143
ba Lizenzinformation: www.creativecommons.org/licenses/by-sa/2.0
Stefan Freimark
Telefonkonferenz
Stefan Freimark
Übung in internem Konzeptionsworkshop
Stefan Freimark
Job-Board bei einer Aperto-Veranstaltung
Stefan Freimark
Apple Watch im Apple Store Kurfürstendamm
Stefan Freimark
Fensterplatz 73C an Bord einer Singapore
Airlines A380
www.flickr.com/photos/sfreimark/
16061812244