10. Ziele im Web 2.0: Prosoziale & persönliche Ziele
11. Aktivität & Ziel ermitteln
Definiert für eure Idee:
• Was tut der ideale Nutzer leidenschaftlich gerne?
• Was verbessert der Anbieter für die User?
• Was müssen die User tun, damit der Anbieter
erfolgreich ist?
11
14. Einordnung des metrischen Ansatzes
Metriken befassen
sich auch mit Zielen,
werden aber "Post-
Design", eingesetzt,
d.h. im laufenden
Betrieb, z.B. um
gesicherte
Anhaltspunkte für
eine Überarbeitung zu
finden.
14
17. Beispiele für 90-9-1
Web insgesamt:
z.B. ACTA-Studie 2009
Wikipedia (DE) - Statistiken:
27.000.000 Hits pro Tag
bei 22.000 aktiven Usern / Monat
und 4.400 Usern mit über 2.000 Bearbeitungen
22. Metriken: Beispiele
Site-Besuch Analyseprogramm
z.B. Google Analytics, Piwik
Proberegistrierung Analyseprogramm
Aktive Nutzung Hauseigene Statistik
Zahlende Nutzung Hauseigene Statistik
22
23. Metriken: Beispiele
Grundmetrik Nutzertypen-Metrik
Shares Besucher Leser
Reshares Leser Kommentatoren
Likes/Empfehlungen Kommentatoren Kuratoren
Kommentare Kuratoren Beitragende
Unique Views
Unique Contributors
Zeit auf der Site
Seitenaufrufe
23
24. Funktionen und Nutzertypen in der Wikipedia
Lesen Nicht angemeldeter Leser
Editieren Nicht angemeldeter Benutzer
Eigene Beiträge Registrierter Nutzer
Seiten verschieben Administrator
Eigenes Profil einstellen Bürokrat
Artikel schützen/sperren Steward
Artikel löschen
Artikel wiederherstellen
User sperren
User ernennen
24
25. Metrikenbasierte Vorgehensweise
- Design-Entscheidungen treffen
- Grundlinie für Metrik definieren
- Stufe im Trichter aussuchen
- Stufe nach "Lecks" untersuchen
- Designänderungen planen & vornehmen
- Messung vornehmen
- Ergebnis mit Grundlinie vergleichen
- ggfs. neue Design-Entscheidungen treffen
25
26. Wozu? Research through Design
- Relevanz von Design dokumentieren
- Relevanz von Design rechtfertigen
- Erfolgsfaktoren ermitteln
Die Social Games-
Industrie gilt, insb.
durch Zynga als
sehr stark
metrikengetrieben
26
33. Kontagent: Analytics Platform für das Social Web
http://www.slideshare.net/kontagent/top-7-social-metrics-
gdc-europe-2011
33
34. Wer schreibt die Wikipedia? (2006)
"Über 50% aller
Bearbeitungen
werden von nur
0,7% der User
erledigt …
524 Menschen."
Aaron Swartz
34
35. Wer schreibt die Wikipedia? (2006)
"Ein Außenstehender fügt ein Stück Information ein.
Dann nehmen die Insider verschiedene Bearbeitungen
vor, optimieren und reformatieren es.
Außerdem: Die Insider Tausende von Bearbeitungen mit
Dingen wie Namensänderungen von Kategorien – Dinge,
um die sich nur Insider kümmern. Im Ergebnis entfällt die
Mehrheit aller Artikel auf die Insider. Aber die
Außenstehenden stellen fast den gesamten Inhalt bereit.
" Aaron Swartz
35
36. Metriken finden
Findet 3 aussagekräftige Metriken für
euer Projekt – möglichst spezifisch auf
dessen Ziele zugeschnitten.
Gibt es Angebote, die ein ähnliches
oder das gleiche Ziel verfolgen?
Was kann man von ihnen lernen?
36
38. Christopher Alexander
Architekt
Suche nach Mustern in der gelungenen
Gestaltung von Lebensräumen
A Pattern Language 1977
Timeless Way of Buildung 1979
Sammlung online
38
39. Was ist ein Muster?
Ein Muster ist eine Kombination aus
• Problem
• Kontext
• Lösung
39
40. Beispiel: Pattern 150
Name:
Ein Ort zum Warten
Kontext:
Jede Situation, bei der Leute auf irgendetwas warten
müssen, z.B. eine Bushaltestelle.
40
41. Beispiel: Pattern 150
Im Kontext Bushaltestelle wirkende Kräfte:
(a) Verharrung / Bann: Die Passagiere müssen anwesend
sein, wenn der Bus kommt.
(b) Ungewissheit: Die Zeit, bis der Bus kommt, ist
ungewiss.
(c) Konkurrenzanspannung: Eventuell weniger freie
Sitzplätze als Wartende z.B. in der Rush-Hour:
Lösung:
Den Wartenden eine Beschäftigung geben.
41
47. Muster verschiedener Ordnung
Muster groberer Granularität (predecessors) werden
durch die Anordnung kleinerer Muster (successors)
konstruiert.
Beispiel
Das Muster „Ein Ort zum Warten“ kann, durch
Einbeziehung nicht wartender Leute, neue Muster auf
den Plan rufen (z.B.„Straßencafe“ etc.).
47
48. Muster verschiedener Ordnung
In Alexanders „A Pattern Language“:
- Anordnung von Stadt & Land (City/Country Fingers)
- Struktur von Städten (Ring Roads)
- Gebäude (Staircase as a Stage)
- Konfiguration der Dinge innerhalb einzelner
Wohnräume oder Konstruktionsdetails (Paving with
Cracks Between the Stones).
>> vielfältige Beziehungen > Muster-Netzwerk >
Mustersprache (Pattern Language)
48
49. Strukturen von Orten
Struktur eines Orts ist in den Beziehungen
der Muster zueinander begründet.
Muster eröffnen Möglichkeit, immer wieder
neue, lebendige Orte zu schaffen - weil sie
gerade nicht wie ein Baukastensystem
funktionieren, sondern sie einen variablen
Zusammenhang zwischen einem räumlichen
Aspekt und einem Vorkommnis kodieren.
49
50. Mustersprachen in anderen Disziplinen
Nicht „DIE“ Mustersprache, sondern jeweils Sprachen
für versch. Domänen.
Alexanders Ansatz wurde schon früh von der Informatik
aufgegriffen, in der HCI ist sie seit Langem populär
Allgemeine Problematiken:
- viele Sammlungen, wenig Systematisierung
- Musterentstehung braucht Zeit
50
51. Muster im UI/UX-Design
Muster =
eine gebräuchliche, erprobte Komponente
für bekannte Probleme
in einem gegebenen Kontext
51
52. Mustersprachen im UI/UX-Design: Ebenen
Top-Down-Design:
- Geschäftsziele
- Positionierungsebene
- Erlebnisebene
- Aufgabenebene
- Aktionsebene
Van Werie / van der Veer 2003
52
54. Patterns in der Praxis
Man nimmt über die Zeit Aufträge an, die
ähnliche Lösungen erfordern (E-Shop,
Mediaslider, Mailformular …) bzw. bietet
bestimmte Lösungspakete an.
Einzelne Lösungselemente sammelt und
dokumentiert man (visuelle Beispiele,
Codebeispiele, Beschreibung,
Erfahrungswerte …), um sie als
„Musterlösungen“ für neue Aufgaben zu
rekombinieren.
54
55. Sites mit Mustersammlungen für IA / UI / UX
http://patterns.ideo.com/
http://welie.com/patterns/
http://www.designingsocialinterfaces.com
/patterns/
http://ui-patterns.com
http://patternry.com/patterns/ Mobile:
http://developer.yahoo.com/ypatterns http://pttrns.com/
http://www.designofsites.com/patterns/ http://mobile-patterns.com
http://patterntap.com/ http://androidpttrns.com/
55
56. Rolle von Mustersprachen für den Designer
„Paradoxerweise lernst du, dass du ein Gebäude nur
dann lebendig machen kannst, wenn du frei genug bist,
um die Muster von dir zu weisen, die dir gerade noch
geholfen haben. (…) Daher mag es dir vorkommen, dass
Mustersprachen doch nutzlos sind. (…) Aber es ist deine
Mustersprache, die dir geholfen hat, dein Ego
loszulassen.(…)
An diesem Punkt sind die Muster nicht länger wichtig:
Die Muster haben dir geholfen, offen zu sein für das,
was real ist.“ (Timeless Way of Building, S. 542–545)
56
58. QR Code Pattern
Q = Quick
R = Response
Code
2D-Barcode;
von Denso ´96 zum Tracking
von Autoteilen entwickelt;
ISO-Standard, OpenSource;
QR-Code-Generator
58
59. QR-Code Pattern
Datenkapazität:
7.089 Zahlen, 4.296 alphanumerische Zeichen
d.h. Serverkommunikation nicht unbedingt erforderlich
z.B. komplette
vCard im QR-Code
der Visitenkarte
59
66. QR Code Pattern: Kontextrelevanz
Ort:
Was ist sinnvoll / nützlich, wo ich jetzt gerade bin?
Device:
Was ist sinnvoll / nützlich auf meinem Smartphone zu
haben?
Aufmerksamkeit:
Was will ich mehr erfahren?
Konversion:
Was will ich als nächstes tun?
66
67. Falsche Nutzung von QR Codes
Scott Stratten's UnMarketing Keynote at the NAMP
67
68. Aufgabe: Design Patterns
In euren Konzeptentwicklungen und Entwürfen
verwendet ihr intuitiv „Patterns“ – schließlich
sind sie ja bekannte Lösungen für verbreitete
Probleme.
Die explizite Auseinandersetzung mit dem
Pattern-Ansatz schult euch in der Kompetenz
zur Mustererkennung und steigert die
Wachsamkeit für Lösungsansätze, denen man
begegnet.
69
69. Aufgabe: Design Patterns
Identifiziert ein spezifisches Teilproblem eurer
Anwendung bzw. die von euch schon
vorgeschlagene Lösung.
Recherchiert, wie andere Anwendungen ihre
Lösung für dieses Problem realisiert haben.
Erläutert kurz das Pattern (welches Problem, in
welchem Kontext, welche Lösung), drei versch.
Lösungsbeispiele und ihre jeweiligen Stärken
& Schwächen in einem Blogbeitrag.
Nutzt die Patternsammlungen!
70
70. Marcus Haberkorn
Akademischer Rat, M.A.
Lehrgebiet Hypermedia: Interaktive & vernetzte Systeme
Studiengang Intermedia Design im Fachbereich Gestaltung
Fachhochschule Trier
Irminenfreihof 8
Postfach 1826
D-54208 Trier
Tel. +49 651 8103-839
Mail: m.haberkorn@fh-trier.de
72