Die komplette Bachelorarbeit in PDF

Transcription

BACHELORARBEIT // THOMAS SOYTER
Ein interaktiver Prototyp zum kollaborativen und kooperativen Überarbeiten
und Bewerten von Zeichnungen auf mobilen Endgeräten.
Thomas Soyter
und Bewerten von Zeichnungen auf mobilen Endgeräten
Bachelorarbeit im Studiengang Informationsdesign
Hochschule der Medien Stuttgart
Fachbereich 3: Information und Kommunikation
Studiengang Informationsdesign
und Bewerten von Zeichnungen auf mobilen Endgeräten
Bachelorarbeit eingereicht am 10. April 2012 von:
Thomas Soyter, Matrikel-Nr. 20130
1. Prüfer: Prof. Ralph Tille, HdM Stuttgart
2. Prüfer: Prof. Dr. Michael Burmester, HdM Stuttgart
•••
EIDESSTATTLICHE VERSICHERUNG
Name: Soyter / Vorname: Thomas / Matrikel-Nr.: 20130 / Studiengang: Informationsdesign
Hiermit versichere ich, Thomas Soyter, an Eides statt, dass ich die vorliegende Bachelorarbeit mit dem Titel „SketchCoLab
– Ein interaktiver Prototyp zum kollaborativen und kooperativen Überarbeiten und Bewerten von Zeichnungen auf mobilen
Endgeräten“ selbständig und ohne fremde Hilfe verfasst und keine anderen als die angegebenen Hilfsmittel benutzt habe.
Die Stellen der Arbeit, die dem Wortlaut oder dem Sinne nach anderen Werken entnommen wurden, sind in jedem Fall unter Angabe der Quelle kenntlich gemacht. Die Arbeit ist noch nicht veröffentlicht oder in anderer Form als Prüfungsleistung
vorgelegt worden.
Ich habe die Bedeutung der eidesstattlichen Versicherung und prüfungsrechtlichen Folgen (§ 26 Abs. 2 Bachelor-SPO bzw. §
19 Abs. 2 Master-SPO der Hochschule der Medien Stuttgart) sowie die strafrechtlichen Folgen (siehe unten) einer unrichtigen
oder unvollständigen eidesstattlichen Versicherung zur Kenntnis genommen.
Auszug aus dem Strafgesetzbuch (StGB):
§ 156 StGB Falsche Versicherung an Eides Statt
Wer von einer zur Abnahme einer Versicherung an Eides Statt zuständigen Behörde eine solche Versicherung falsch abgibt
oder unter Berufung auf eine solche Versicherung falsch aussagt, wird mit Freiheitsstrafe bis zu drei Jahren oder mit Geldstrafe bestraft.
Ort, Datum
Unterschrift
Eidesstattliche Versicherung
SketchCoLab
•••
Schlagwörter
Kollaboratives Zeichnen,
kooperatives Zeichnen,
Prototyp, Tablet PC, Tablet
Computer, Überarbeitung
von Zeichnungen, Bewertung von Zeichnungen,
SketchCoLab
ZUSAMMENFASSUNG
Gegenstand dieser Bachelorarbeit ist die Konzeption, Gestaltung sowie Umsetzung eines interaktiven Prototyps zur Unterstützung der kollaborativen und kooperativen Zusammenarbeit beim Überarbeiten und Bewerten von Zeichnungen. Die
realisierte Anwendung SketchCoLab wurde dabei für den Einsatz auf mobilen Geräten, speziell der Geräteklasse Tablet
Computer konzipiert.
Ziel ist es, kollaborative und kooperative Möglichkeiten der Zusammenarbeit herauszuarbeiten, um Nutzer beim Gestalten
und Entwerfen in einer Gruppe optimal zu unterstützen. Der Schwerpunkt liegt dabei auf der Überarbeitung und Bewertung
von Zeichnungen als mögliche Teilaufgaben innerhalb des Gestaltungsprozesses und wie diese miteinander verbunden
werden können. Es werden praktische Ansätze und Werkzeuge aufgezeigt, die zur Überarbeitung und Bewertung von medialen Inhalten geeignet sind und in SketchCoLab einfließen. Im Zuge der Entwicklung des Konzepts werden Potentiale der
Kollaboration und Kooperation in den digitalen Kontext übertragen und für den Einsatz auf mobilen Geräten betrachtet. Als
spezielle Geräteklasse wird die Eignung von Tablet Computern in Verbindung mit dem computergestützten Entwerfen für den
entwickelten Prototyp untersucht.
Die erarbeiteten Erkenntnisse sind in einen interaktiven Prototypen eingeflossen, der die wichtigsten Funktionen in Form einer
plattformunabhängigen Web-Applikation umfasst und in HTML5, JavaScript, PHP, MySQL und CSS umgesetzt wurde. Bei
der Realisation lag der Fokus auf der Entwicklung eines übersichtlichen Interfaces und funktionalen Interaktionsdesigns sowie
einer harmonischen Gestaltung.
SketchCoLab
Zusammenfassung
•••
ABSTRACT
The subject of this bachelor thesis is the concept, design and implementation of an interactive prototype to support the collaborative and cooperative revising and reviewing of drawings. The implemented application was designed for use on mobile
devices, especially tablet computers.
The goal is to work out collaborative and cooperative ways of working together and to support users in a group in designing
and drafting perfectly. The focus is on the review and evaluation of drawings as possible sub-tasks within the design process
and how they can be connected to each other. The thesis identifies practical approaches and tools that are appropriate for
review and evaluation of media content and which are integrated into SketchCoLab. In the course of the development of
the concept, collaboration and cooperation are transferred into digital context and for use on mobile devices. The analysis
examines the suitability of tablet computers, as a special class of device, in conjunction with computer-aided design for the
developed prototype.
The findings have been incorporated into an interactive prototype that includes the most important functions in a platformindependent web application and which is put to practice by HTML5, JavaScript, PHP, MySQL and CSS. The focus was on
developing a clear interface and a functional and harmonious design.
Abstract
SketchCoLab
Keywords
Collaborative Sketching,
Cooperative Sketching,
Prototype, Tablet PC, Tablet Computer, Edit Sketches, Evaluate Sketches,
SketchCoLab
•••
INHALTSVERZEICHNIS
1 EINFÜHRUNG
1
2 THEORIE UND GRUNDLAGEN
5
2.1. Kollaboration und Kooperation................................................................................................................... 6
2.1.1. Definitionen und Grundlagen........................................................................................................... 6
2.1.2. E-Kollaboration und E-Kooperation.................................................................................................... 9
2.2. Computergestütztes kollaboratives und kooperatives Gestalten..................................................................... 23
2.2.1. Digitales und analoges Zeichnen.................................................................................................... 23
2.2.2. Praktische Ansätze zum gemeinsamen Überarbeiten von Zeichnungen................................................ 27
2.2.3. Praktische Ansätze zum gemeinsamen Bewerten von Zeichnungen...................................................... 38
2.3. Tablet PCs und Tablet Computer................................................................................................................ 47
2.3.1. Definitionen, Geschichte und Entwicklung........................................................................................ 47
2.3.2. Berührungsempfindliche Bildschirme................................................................................................ 54
2.3.3. Tablet Computer als kollaboratives und kooperatives Gestaltungstool................................................... 58
2.3.4. Das ASUS EeePad Transformer TF101............................................................................................. 60
65
3 KONZEPTION UND PRAKTISCHE UMSETZUNG
3.1. Grobkonzept.......................................................................................................................................... 66
3.1.1. Zielgruppenanalyse und –ansprache............................................................................................... 66
3.1.2. Grundlegendes Prototypkonzept..................................................................................................... 73
3.2. Feinkonzept........................................................................................................................................... 80
3.2.1. Informationsarchitektur.................................................................................................................. 80
3.2.2. Wireframes (Funktionslayout)......................................................................................................... 83
3.2.3. Interaktionen.............................................................................................................................. 103
3.3. Gestaltungskonzept.............................................................................................................................. 107
3.3.1. Typografie................................................................................................................................. 107
Inhaltsverzeichnis
SketchCoLab
•••
3.3.2. Farben...................................................................................................................................... 110
3.3.3. Icons und Symbole..................................................................................................................... 112
3.3.4. Mockups................................................................................................................................... 115
3.4. Der Prototyp........................................................................................................................................ 131
4 SCHLUSSBEMERKUNG
135
5 LITERATURVERZEICHNIS
137
6 ANHANG
145
SketchCoLab
Inhaltsverzeichnis
•••
ABBILDUNGSVERZEICHNIS
Abbildung 1: Unterschied zwischen Kooperation und Kollaboration.......................................................................... 9
Abbildung 2: Einflüsse auf die Entstehung von CSCW und Groupware.................................................................... 10
Abbildung 3: Intensität des Informationsflusses innerhalb einer Gruppe.................................................................... 11
Abbildung 4: Zusammenhang zwischen CSCW und Groupware............................................................................ 13
Abbildung 5: Raum-Zeit-Matrix in der ursprünglichen Form..................................................................................... 14
Abbildung 6: Erweiterte Raum-Zeit-Matrix (GRUDIN)............................................................................................. 15
Abbildung 7: Erweiterte Raum-Zeit-Matrix (TEUFEL)................................................................................................ 16
Abbildung 8: 3K-Modell.................................................................................................................................... 18
Abbildung 9: Potentiale von E-Kollaboration (in Unternehmen)................................................................................ 22
Abbildung 10: Skitch Interface............................................................................................................................ 28
Abbildung 11: iAnnotate - Annotation innerhalb Websites...................................................................................... 29
Abbildung 12: Remarkz..................................................................................................................................... 29
Abbildung 13: u-Annotate.................................................................................................................................. 30
Abbildung 14: PhotoAnnotate............................................................................................................................ 30
Abbildung 15: TheCommentor............................................................................................................................ 31
Abbildung 16: ConceptShare............................................................................................................................. 31
Abbildung 17: Twiddla...................................................................................................................................... 32
Abbildung 18: iAnnotate PDF............................................................................................................................. 32
Abbildung 19: Multi-User Sketchpad................................................................................................................... 33
Abbildung 20: ESP Game.................................................................................................................................. 40
Abbildungsverzeichnis
SketchCoLab
•••
Abbildung 21: Sketcharoo................................................................................................................................. 41
Abbildung 22: LabelMe..................................................................................................................................... 41
Abbildung 23: Buzzillions.................................................................................................................................. 42
Abbildung 24: Rate My Drawings....................................................................................................................... 43
Abbildung 25: Flickr.......................................................................................................................................... 43
Abbildung 26: Beispiel eines Tablet PCs in der Bauform „Convertible“ (Dell Latitude)................................................. 48
Abbildung 27: Das iPad als eines der bekanntesten „Slates“.................................................................................. 49
Abbildung 28: UMPC mit Touchscreen und integrierten Tastaturelementen................................................................ 50
Abbildung 29: Unterschiede und Merkmale von Tablet PCs und Tablet Computern..................................................... 50
Abbildung 30: Dynabook.................................................................................................................................. 51
Abbildung 31: GridPad..................................................................................................................................... 51
Abbildung 32: Apple Newton............................................................................................................................ 52
Abbildung 33: PalmPilot.................................................................................................................................... 52
Abbildung 34: Wichtige Meilensteine der Tablet PCs und Tablet Computer............................................................... 52
Abbildung 35: Entwicklung der Verkaufszahlen von Tablet Computern (weltweit) von 2010 bis 2011.......................... 53
Abbildung 36: Erwartete Entwicklung der Verkaufszahlen von Tablet Computern (weltweit) in den nächsten Jahren........ 53
Abbildung 37: Funktionsweise kapazitiver Touchscreens........................................................................................ 55
Abbildung 38: Funktionsweise resistiver Touchscreens............................................................................................ 55
Abbildung 39: PLATO IV.................................................................................................................................... 56
Abbildung 40: Touch-Tablet Bill Buxton................................................................................................................. 56
Abbildung 41: IBM Simon.................................................................................................................................. 57
Abbildung 42: Microsoft Surface........................................................................................................................ 57
SketchCoLab
Abbildung 43: Historische Meilensteine der Multitouch-Technologie......................................................................... 57
Abbildung 44: Iterativer Prozess im Kontext des Prototypen.................................................................................... 59
Abbildung 45: ASUS EeePad Transformer TF101 mit andockbarer Tastatur („hybride“ Bauform)................................. 60
Abbildung 46: Ablauf des Scenario Based Development Prozesses.......................................................................... 71
Abbildung 47: Grobkonzept SketchCoLab............................................................................................................. 74
Abbildung 48: Funktionslayout SketchCoLab.......................................................................................................... 75
Abbildung 49: Hierarchien einer Informationsarchitektur......................................................................................... 80
Abbildung 50: Navigationsstrukturen................................................................................................................... 81
Abbildung 51: Basisraster als Gestaltungsrichtlinie................................................................................................. 85
Abbildung 52: Wireframe #1 - Grundaufbau........................................................................................................ 86
Abbildung 53: Wireframe #2 - Werkzeugoptionen................................................................................................ 87
Abbildung 54: Wireframe #3 - Projektauswahl...................................................................................................... 88
Abbildung 55: Wireframe #4 - Wahl der Zeichnung.............................................................................................. 89
Abbildung 56: Wireframe #5 - Werkzeuge: Freiform-Stift........................................................................................ 90
Abbildung 57: Wireframe #6 - Werkzeuge: Textwerkzeug...................................................................................... 91
Abbildung 58: Wireframe #7 - Werkzeuge: Radiergummi...................................................................................... 92
Abbildung 59: Wireframe #8 - Werkzeuge: Textmarker.......................................................................................... 93
Abbildung 60: Wireframe #9 - Workflow: Elemente skalieren und rotieren................................................................ 94
Abbildung 61: Wireframe #10 - Elemente (nachträglich) verschieben....................................................................... 95
Abbildung 62: Wireframe #11 - Workflow: Arbeitsfläche vergrößern und verschieben............................................... 96
Abbildung 63: Wireframe #12 - Aktivitätspanel: Bewertungen einsehen und neue Bewertung vergeben....................... 97
Abbildung 64: Wireframe #13 - Aktivitätspanel: Bestehende „Tags“ einsehen und neue „Tags“ vergeben..................... 98
SketchCoLab
•••
•••
Abbildung 65: Wireframe #14 - Aktivitätspanel: Useraktivitäten einsehen................................................................. 99
Abbildung 66: Wireframe #15 - Ansichtspanel: Bestehende Annotationsversionen einsehen und bearbeiten............... 100
Abbildung 67: Wireframe #16 - Zeichnung bewerten und kommentieren................................................................ 101
Abbildung 68: Wireframe #17 - „Tags“ zu einer Zeichnung vergeben.................................................................... 102
Abbildung 69: Beispiele verankernder Gesten auf Touchscreens............................................................................ 103
Abbildung 70: Touch-Interaktionen im Prototyp.................................................................................................... 105
Abbildung 71: Grundbegriffe der Typografie...................................................................................................... 107
Abbildung 72: Im Prototyp eingesetzte Schriftart Roboto....................................................................................... 109
Abbildung 73: Bunt-Unbunt-Kontrast in SketchCoLab............................................................................................. 111
Abbildung 74: Qualitätskontrast in SketchCoLab.................................................................................................. 112
Abbildung 75: Hell-Dunkelkontrast in SketchCoLab............................................................................................... 112
Abbildung 76: Icons SketchCoLab in der Grundversion......................................................................................... 113
Abbildung 77: Icons SketchCoLab in der gestalteten Version ................................................................................. 113
Abbildung 78: Beispiele aktive und inaktive Werkzeugicons................................................................................. 114
Abbildung 79: Symbolik zur Darstellung von Bewertungen.................................................................................... 114
Abbildung 80: Mockup #1 - Splashscreen.......................................................................................................... 116
Abbildung 81: Mockup #2 - Login-Fenster........................................................................................................... 117
Abbildung 82: Mockup #3 - Oberfläche von SketchCoLab.................................................................................... 118
Abbildung 83: Mockup #4 - Aktivitätspanel........................................................................................................ 119
Abbildung 84: Mockup #5 - Aktivitätspanel Bereich Gesamtbewertung.................................................................. 120
Abbildung 85: Mockup #6 - Aktivitätspanel Bereich Einzelbewertungen / Bewertungskommentare............................ 121
Abbildung 86: Mockup #7 - Chat-Werkzeug....................................................................................................... 122
SketchCoLab
Abbildung 87: Mockup #8 - Textwerkzeug.......................................................................................................... 123
Abbildung 88: Mockup #9 - Werkzeugoptionen: Strichstärke und Strichfarbe.......................................................... 124
Abbildung 89: Mockup #10 - Projektauswahl und Wahl der Zeichnung.................................................................. 125
Abbildung 90: Mockup #11 - Ansicht von Annotationsversionen............................................................................ 126
Abbildung 91: Mockup #12 - Bewertungs-Fenster (reduzierte Variante)................................................................... 127
Abbildung 92: Mockup #13 - Bewertungs-Fenster (erweiterte Variante)................................................................... 128
Abbildung 93: Mockup #14 - Kommentar-Fenster................................................................................................ 129
Abbildung 94: Mockup #15 - Popup-Fenster zur Kommentarabgabe...................................................................... 130
SketchCoLab
•••
•••
TABELLENVERZEICHNIS
Tabelle 1: Überblick zu den Begriffen Kooperation, Koordination und Kollaboration.................................................... 8
Tabelle 2: Vor- und Nachteile von E-Kollaboration und E-Kooperation....................................................................... 12
Tabelle 3: Vor- und Nachteile digitalen und analogen Zeichnens............................................................................. 25
Tabelle 4: Mögliche Kernfunktionen / Features für das Überarbeiten (Annotation) von Zeichnungen innerhalb des
Prototyps.......................................................................................................................................................... 36
Tabelle 5: Mögliche Kernfunktionen / Features für das Bewerten von Zeichnungen innerhalb des Prototyps.................. 45
Tabelle 6: Gesten-Potential von Touchscreens........................................................................................................ 54
Tabelle 7: Vor- und Nachteile kapazitiver und resistiver Touchscreens....................................................................... 56
Tabelle 8: Überblick der technischen Daten des ASUS EeePad Transformer TF101..................................................... 60
Tabelle 9: Merkmale einer Zielgruppe.................................................................................................................. 68
Tabelle 10: Eckdaten der Nutzungskontext-Analyse................................................................................................ 69
Tabelle 11: Technische Daten zum entwickelten Prototyp....................................................................................... 131
Tabelle 12: Überblick der Funktionen in SketchCoLab............................................................................................ 133
Tabellenverzeichnis
SketchCoLab
•••
ABKÜRZUNGSVERZEICHNIS
CSS
Cascading Style Sheets
CSS ist eine Auszeichnungssprache mit der (X)HTML- Dokumente formatiert werden können
HTML
Hypertext Markup Language
HTML ist eine Markierungssprache zur Darstellung von Inhalten im World Wide Web (WWW)
PHP
Hypertext Preprocessor
PHP ist eine serverseitige Skriptsprache zur dynamischen Erstellung von Webseiten
MySQL
MY Sequential Query Language
MySQL ist ein frei verfügbares relationales Datenbanksystem
SBD
Scenario-Based-Design
Abkürzungsverzeichnis
SketchCoLab
01
EINFÜHRUNG
•••
1 EINFÜHRUNG
Kollaboration und Kooperation als Möglichkeit, Lern-, Geschäfts- oder Designprozesse zu optimieren, beschleunigen
und zu verbessern ist eine bereits seit vielen Jahren gängige Strategie und hielt vor allem mit der Etablierung des
Internets immer mehr Einzug in den Bereich des computergestützten Arbeitens. Mittlerweile zeigen viele Anwendungen und Konzepte mit verschiedensten Ansätzen, in
welcher Form der Entwurfsprozess in gestalterischen Disziplinen wie Interfacedesign, Datenvisualisierung, etc. durch
digitale Kollaboration und Kooperation unterstützt werden
kann. Eine Reihe von Anwendungen richtet primär den Fokus auf den Teilaspekt des Zeichnens und weniger auf die
gemeinsame Überarbeitung und Bewertung. Vor allem die
Kombination der elektronischen Überarbeitung und Bewertung von Zeichnungen in einer zentralen Anwendung wird
kaum abgedeckt.
Darüber hinaus sind viele der bestehenden Anwendungslösungen im Bereich des kollaborativen Zeichnens
und der Evaluation vornehmlich auf die Nutzung über
Desktop-PCs ausgelegt und nicht für den Einsatz auf mobilen Endgeräten. Es gibt einige Projekte, die Devices wie
Multitouch-Tische oder digitale Whiteboards mit mobilen
Geräten verbinden, jedoch spielen Tablet Computer als
ausschließliches Kollaborations- und Kooperationsgerät
bisher weniger eine Rolle. Vor allem für den Bereich des
digitalen Zeichnens bietet das immer mehr an Bedeutung
gewinnende Gerät Möglichkeiten, die Kollaboration und
Kooperation mittels computergestützter Systeme für den
Nutzer zu verbessern und intuitiver zu gestalten.
In der vorliegenden Arbeit wurde deshalb ein interakti-
ver Prototyp (SketchCoLab) entwickelt, der die Chancen und
Potentiale der kollaborativen und kooperativen Zusammenarbeit in einer Gruppe mit den technischen Vorzügen eines
mobilen Geräts wie dem Tablet Computer kombiniert. Zentraler Bestandteil der Anwendung ist die Überarbeitung und
Bewertung von Zeichnungen bzw. Scribbles (z. B. Icons,
Interfaces) zur Verbesserung des iterativen Gestaltungsprozesses.
Für die Umsetzung des Prototyps werden zunächst in
Kapitel 2 die theoretische Grundlagen zu den Themen
(elektronische) Kollaboration bzw. Kooperation und computergestütztes Design sowie relevante Ansätze der Überarbeitung und Bewertung von Zeichnungen betrachtet.
Ebenfalls wird die Geräteklasse der Tablet Computer und
Tablet PCs genauer vorgestellt und deren Potentiale als
kollaboratives und kooperatives Designtool erörtert. Die in
Kapitel 2 erarbeiteten Grundlagen fließen abschließend in
Kapitel 3 in die Konzeption und Realisierung sowie das
Interface-, Interaktions- und Gestaltungsdesign der Anwendung ein.
1
Einführung
SketchCoLab
02
THEORIE UND GRUNDLAGEN
•••
2 THEORIE UND GRUNDLAGEN
Die nachfolgenden Kapitel sollen einen grundlegenden
Überblick zum Thema Kollaboration und Kooperation (Kapitel 2.1) schaffen. Zunächst wird in Kapitel 2.1.1 auf die
Bedeutung und Unterschiede der beiden Begrifflichkeiten
Kollaboration und Kooperation im allgemeinen Kontext
eingegangen wird. Darauf aufbauend werden die Begriffe
Kollaboration und Kooperation in Kapitel 2.1.2 um den
Gesichtspunkt der computergestützten Gruppenarbeit erweitert und somit der Fokus auf das Thema E-Kollaboration und E-Kooperation bzw. Computer Supported Collaborative Work / Computer Supported Cooperative Work
(CSCW) gesetzt.
Der Aspekt in Kapitel 2.2 ist neben der Betrachtung
von computergestütztem, kollaborativen und kooperativen
Design als ein spezielles Anwendungsgebiet, auch der
Vergleich der Möglichkeiten des digitalen und analogen
Entwerfens (Kapitel 2.2.1). Darüber hinaus wird ein Überblick über existierende Ansätze und Konzepte bezüglich
der Überarbeitung (Kapitel 2.2.2) und Bewertung (Kapitel
2.2.3) von Zeichnungen innerhalb des Designprozesses
aufgezeigt.
Abschließend erfolgt im Teil Theorie und Grundlagen in
Kapitel 2.3 eine kurze Einführung in die Welt der TabletPCs
und Tablet Computer, die für den in dieser Bachelorthesis
entwickelten Prototypen eine Rolle spielen. Beginnend mit
der Begriffsdefinition und dem Einstieg in die Historie und
Entwicklung (Kapitel 2.3.1) der TabletPCs und Tablet Computer, erfolgt im Kapitel 2.3.2 ein kurzer Einblick in die
zugrundeliegende Touchscreen- und Multitouchtechnologie, bevor in Kapitel 2.3.3 die Eignung von TabletPCs und
Tablet Computern als kollaboratives und kooperatives Designtool erörtert wird . Abschließend wird in Kapitel 2.3.4
konkret auf das ASUS EeePad Transformer TF101 mit seinen Spezifikationen eingegangen, das in dieser Arbeit als
Testgerät zur Verfügung stand.
Aufbauend auf den erarbeiteten theoretischen Grundlagen erfolgt in den nachfolgenden Kapiteln die Übertragung der Erkenntnisse auf die Konzeption und Gestaltung
der Anwendung SketchCoLab als interaktiver Prototyp zum
kollaborativen und kooperativen Überarbeiten und Bewerten von Zeichnungen auf mobilen Endgeräten.
5

SketchCoLab
•••
2.1. Kollaboration und Kooperation
Im sprachlichen Gebrauch werden Kollaboration und Kooperation oft ohne Unterscheidung oder gar im selben Kontext genutzt. Außerdem wird der Begriff der Kollaboration
häufig auf unterschiedliche, unzureichende oder, speziell
in der deutschen Sprache auch mit einer negativen Konnotation (Kollaboration als Zusammenarbeit mit dem Feind)
(DUDEN, 2000, S. 555) verwendet.
Deshalb ist es für das grundlegende Verständnis wichtig, sich zunächst der jeweiligen sprachlichen Bedeutung
sowie der Unterschiede zwischen den beiden Begriffen
klar zu werden.
2.1.1. Definitionen und Grundlagen
Es ist hilfreich die Semantik der beiden Wörter zu betrachten. Die gemeinsame Vorsilbe „Kon-“ hat ihren Ursprung
im lateinischen Präfix „con-“ und wird mit den Begriffen
„mit“, „zusammen“ oder „nebeneinander“ übersetzt (DUDEN, 2012).
Dabei wird die Vorsilbe „Kon-“ zu „Ko-“ vor h und
Selbstlauten (Kooperation), zu „Kol-“ vor dem Buchstaben
l (Kollaboration), zu „Kom-“ vor b, m, und p und zu „Kor-“
vor einem r (WISSENMEDIA GMBH, 2012).
Das Präfix „Ko-“ drückt somit eine Beziehung zwischen
zwei Subjekten oder Objekten aus, die „miteinander“, „zusammen“ oder „gemeinsam“ handeln, bzw. etwas miteinander zu tun haben (STOLLER-SCHAI, 2009, S. 34).
Die Wortstämme der beiden Begriffe weisen ähnliche
Bedeutungen auf. So wird Kollaboration vom lateinischen
6
SketchCoLab
2 Theorie und Grundlagen
Wort „laborare“ („sich anstrengen“, „abmühen“, „arbeiten“) abgeleitet, Kooperation stammt vom lateinischen
Wort „operari“ („tätig sein“, „wirken“, „handeln“) (MARQUARDT, VOIGT, 2009).
Es ist daher nachvollziehbar, dass die beiden Wörter
Kollaboration und Kooperation häufig gleichwertig bzw.
im selben Zusammenhang verwendet werden. Um weiter
zu differenzieren findet man in der Literatur einige Definitionen und Ansätze, welche sowohl die Gemeinsamkeiten,
als auch die Unterschiede der beiden Begriffe genauer verdeutlichen.
Kooperation
ROSCHELLE & TEASLEY definieren die kooperative Arbeit
folgendermaßen:
„cooperative work accomplished by the division of labor
among participants, as an activity where each person is
responsible for a portion of the problem solving…”
(ROSCHELLE & TEASLEY, 1995, S. 70)
Daraus abgeleitet ist Kooperation primär gekennzeichnet
durch die Lösung von Aufgaben durch jeweils verschiedene Aufgabenträger um ein gemeinsames übergeordnetes
Ziel zu erreichen. Entscheidend dabei ist, dass die zu realisierende Gesamtaufgabe in unterschiedliche Teilaufgaben
gegliedert wird, für die jeweils eine bestimmte Person oder
eine Gruppe verantwortlich ist. Somit dienen die Aktivitäten innerhalb einer Kooperation zwar einem Gesamtziel,
jedoch wird durch Arbeitsteilung dafür gesorgt, dass die
kooperierenden Personen oder Gruppen jeweils unterschiedliche Aufgabenziele verfolgen.
•••
Die Motivation für eine Kooperation ist die Aussicht ein
gemeinsames Ziel besser, leichter oder schneller zu erreichen, als dies den jeweiligen Kooperationspartnern alleine
möglich wäre (STOLLER-SCHAI, 2009, S. 38).
Darüber hinaus zeichnet sich Kooperation meist durch
Beibehaltung der hierarchischen Strukturen und Befugnisse
der jeweiligen kooperierenden Partner, getrennte Handhabung der Ressourcen und Austausch von Informationen nur
nach Bedarf aus (KVAN, 2000).
Kollaboration
Grundlegend unterscheidet sich der Ansatz der Kollaboration von Kooperation dadurch, dass im Vorfeld keine
Arbeitsaufteilung stattfindet und alle Teilnehmer einer Kollaboration gemeinsam eine oder mehrere Aufgaben bearbeiten. Auch hier steht, noch deutlicher als bei der Kooperation, der Aspekt des Erreichens eines gemeinsamen Ziels
im Vordergrund. ROSCHELLE & TEASLEY definieren Kollaboration gegenüber Kooperation wie folgt:
entstehen. Wie bei der Kooperation sind mögliche Gründe
für eine Kollaboration das schnelle, bessere und einfachere
Erreichen bestimmter Ziele.
STOLLER-SCHAI (2009, S. 36) erweitert die Motivation
dahingehend, dass Subjekte oder Objekte kollaborieren,
um etwas herzustellen oder um etwas zu erreichen, das
sie jeweils für sich getrennt betrachtet nicht selbst erreichen
könnten und bezeichnet dies als Emergenzeffekt. Währungen für Emergenzeffekte sind beispielsweise „miteinander
Spass haben“, „mitgestalten können“, „vom Wissen der
anderen profitieren“.
Ähnlich, aber noch einen Schritt weiter bzw. individueller betrachtet, schreibt MICHAEL SCHRAGE in Bezug auf
kollaborative Kreation in seinem Buch SHARED MINDS:
„…collaboration as mutual engagement of participants
in a coordinated effort to solve the problem together.”
(ROSCHELLE & TEASLEY, 1995, S. 70)
„...collaboration is the process of shared creation: two or
more individuals with complementary skills interacting to
create a shared understanding that none had previously
possessed or could have come to on their own. Collaboration creates a shared meaning about a process, a
product, or an event. In this sense, there is nothing routine
about it. Something is there that wasn’t there before.”
(SCHRAGE, 1990, S. 40)
Wichtig bei einer Kollaboration ist demnach auch das
wechselseitig beeinflussende und koordinierte Einbringen
der jeweiligen Kollaborationspartner im Sinne einer gemeinsamen Problemlösung. Kollaboratives Arbeiten findet
in aller Regel heterarchisch statt, was eine mehr oder weniger vollkommene Gleichberechtigung aller Teilnehmer bedeutet und gegenüber der Kooperation Rechte und Pflichten dynamisch durch den Kollaborationsprozess an sich
Damit lässt sich Kollaboration dahingehend erweitern,
dass durch den wechselseitigen und sich beeinflussenden
Prozess beim kollaborativen Arbeiten zwischen zwei oder
mehreren Teilnehmern mit sich ergänzenden Fähigkeiten
und Stärken, etwas komplett Neues (beispielsweise in Form
von gemeinsamem Verständnis) entsteht, was die jeweiligen Individuen von sich aus alleine nicht besitzen oder erreicht hätten.
Kooperieren
Eine gemeinsame Aufgabe wird
in Teilaufgaben gegliedert und
von verschiedenen Aufgabenträgern erfüllt. Der Grad der individuellen Arbeit ist hoch und das
Erreichen eines gemeinsamen
Ziels steht nicht zwangsläufig im
Vordergrund.
Kollaborieren
Zum Erreichen eines gemeinsamen übergeordneten Ziels erfolgt
die gemeinsame Bearbeitung
einer oder mehrerer Aufgaben
durch die Teilnehmer einer
Gruppe in enger Zusammenarbeit. Der Grad der individuellen
Arbeit ist dabei niedrig.
7
Kollaboration und Kooperation
SketchCoLab
•••
Es zeigt sich somit, dass die Begriffe Kooperation und Kollaboration beim genaueren Betrachten zwar unterschiedliche Bedeutungen haben, es aber auch Gemeinsamkeiten
und Schnittpunkte gibt. Sowohl Kooperation als auch Kollaboration dienen zum Erreichen eines gemeinsamen Ziels
und ergänzen sich darüber hinaus als Aktionsformen. So
müssen beispielsweise die innerhalb einer Kooperation erreichten Teilaufgaben abschließend zu einer Gesamtlösung
zusammengeführt werden, was ohne kollaborative Prozesse kaum denkbar ist. Im Gegensatz dazu, können aber
auch kooperative Maßnahmen den Kollaborationsprozess
erleichtern und entlasten (STOLLER-SCHAI, 2009, S. 38).
Kooperation
Bei einer Kooperation ist jedoch der Fokus auf das gemeinsame Ziel oder die gemeinsame Mission bei den Kooperationspartnern als weniger ausgeprägt anzusehen, als bei
einer kollaborativen Zusammenarbeit. Abbildung 1 verdeutlicht noch einmal die Unterschiede zwischen Kooperation und Kollaboration auch hinsichtlich des stattfindenden
Informationsaustausches.
Während bei der Kollaboration gemeinsam an der
Erfüllung der gleichen Aufgabe gearbeitet wird und ein
wechselseitiger Informations- und Kommunikationsfluss bei
meist Gleichberechtigung der Teilnehmer stattfindet, verhält
es sich bei einer kooperativen Zusammenarbeit anders.
Koordination
Kollaboration
• Kurze Laufzeit
• Längere Laufzeit
• Langfristig
• Informelle Beziehungen
• Mehr formelle Beziehungen
• Tiefgreifende Beziehung
• Oft keine klar definierte Mission
• Fokus auf einen speziellen Einsatz oder ein
Programm
• Verpflichtung gegenüber einer gemeinsamen
Mission
• Keine definierte Struktur
• Etwas Planung
• Resultiert in einer neuen Struktur
• Kein Planungsbestreben
• Offene Kommunikationskanäle
• Umfangreiche Planung
• Partner teilen Informationen über das
Projekt soweit vorliegend
• Autorität wird immer noch von den
Individuen beibehalten
• Klar definierte Kommunikationskanäle auf
• Individuen behalten Autorität bei
• Ressourcen werden geteilt
allen Ebenen
• Kollaborative Struktur bestimmt Autoritäten
• Ressourcen werden seperat beibehalten
• Ressourcen werden geteilt
• Kein Risiko
• Größeres Risiko
• Geringe Intensität
• Höhere Intensität
Fazit:
Informell, oft keine Definition gemeinsamer
Ziele. Kein gemeinsames Planen, Informationen
werden dann geteilt, wenn notwendig
Fazit:
Etwas Planung und Kommunikation wird benötigt und dadurch ein engeres Arbeitsverhältnis
entwickelt
Fazit:
Zusammen arbeiten, gemeinsame in Zusammenarbeit entwickelte Verpflichtungen und
Ziele. Führung, Ressourcen, Risiken, Kontrolle
und Ergebnisse werden geteilt. Es wird mehr
vollbracht, als jeweils individuell erreicht
werden könnte
Tabelle 1: Überblick zu den Begriffen Kooperation, Koordination und Kollaboration
Darstellung nach AASL (1996)
8
SketchCoLab
•••
Dort ist der Informations- und Kommunikationsaustausch
in der Regel hierarchisch geprägt und ein mögliches gemeinsames Ziel wird durch das jeweilige Abarbeiten der
Teilaufgaben erreicht (siehe auch Tabelle 1).
2.1.2. E-Kollaboration und E-Kooperation
In Zeiten der Globalisierung und der Flut an Informationen hat sich die Art der Zusammenarbeit in Gruppen und
Teams nachhaltig geändert. Aufgrund der enormen sozialen Veränderungen und der daraus entstandenen Herausforderungen im Arbeitsumfeld, liegt der Schwerpunkt mehr
denn je auf der möglichst optimalen Zusammenarbeit von
Gruppen und räumlich verteilten Partnern. Gefördert wurde
dies durch die sich ständig weiterentwickelnden technologischen Möglichkeiten, wie beispielsweise die Entwicklung
von Großrechnern hin zu vernetzten Personal-Computern
und die damit einhergehende Entstehung lokaler Netzwerke und des Internets. Ausgehend von dieser Entwicklung
beschreiben E-Kooperation und E-Kollaboration (Vorsilbe „E-“ für elektronisch) die computergestützte, vernetzte
und somit dezentrale Zusammenarbeit innerhalb virtueller
Teams, in der Regel auf Internetbasis (TSCHANZ, SCHEIDEGGER, RÜEGSEGGER & SIEBER, 2003, S. 2).
Computer Supported Collaborative Work / Computer Supported Cooperative Work (CSCW)
E-Kollaboration und E-Kooperation sind gleichzusetzen mit
den von PAUL CASHMAN und IRENE GREIF erstmalig bereits 1984 geprägten Bezeichnungen Computer Supported
Collaborative Work bzw. Computer Supported Cooperative Work (CSCW).Nach HASENKAMP (1994, S. 15) befasst sich das als interdisziplinäres Forschungsgebiet (u. a.
E-Kollaboration
und E-Kooperation
Die Begriffe sind gleichzusetzen
mit CSCW. Die Vorsilbe “E-„
bezeichnet die Übertragung der
Kommunikation und Handlung
innerhalb der Kollaboration und
Kooperation vom physischen in
den virtuellen Raum.
Kommunikations- und Interaktionswege
Gruppe 1
Teilnehmer 1
Teilnehmer 2
Teilnehmer 1
Teilnehmer 2
Teilaufgabe
Teilziel
KOLLABORATION
Teilnehmer 3
gemeinsame
Aufgabe / Ziel
...
KOOPERATION
Gruppe X
Gesamtaufgabe
Ziel
Teilnehmer 1
Teilnehmer 3
Teilnehmer 2
Teilnehmer 4
Teilaufgabe
Teilziel
Teilnehmer 3
Abbildung 1: Unterschied zwischen Kooperation und Kollaboration
Eigene Darstellung
9
SketchCoLab
•••
CSCW
CSCW steht für Computer
Based Cooperative Work bzw.
Computer Based Collaborative
Work und ist ein interdisziplinäres Forschungsgebiet, das sich
sowohl mit der Arbeit in einer
Gruppe, als auch mit der möglichst optimalen Unterstützung
kollaborativer und kooperativer
Prozesse durch Computerunterstützung beschäftigt.
Informatik, Soziologie, Psychologie) anzusehende CSCW
einerseits mit der Arbeit in der Gruppe und andererseits
mit der Computerunterstützung kooperativen bzw. kollaborativen Arbeitens und Handelns. Das Ziel dabei ist neben
einem möglichst ganzheitlichen Verständnis für die Arbeitsprozesse in Teams, die Effektivität und Effizienz von GrupSoziale Veränderungen
penarbeit durch den Einsatz von Informations- und Kommunikationstechnologien zu verbessern.
JOHANSEN (1991) fasst die Einflüsse und Basis für das
Forschungsgebiet CSCW zusammen und unterteilt diese in
soziale und technologische Entwicklungen, die für die Entstehung verantwortlich sind (siehe Abbildung 2).
Technologische Fortschritte
Flexibilisierung
Telefon
Glasfaser
Umstrukturierungen
Multimedia
Globalisierung
Mobile Endgeräte
Neue Organisationsformen
Glasfaser
PCs / Laptops
Allianzen
LANs
Team
Team
Team
Kollaborative
Arbeitsgruppen
Abbildung 2: Einflüsse auf die Entstehung von CSCW und Groupware
Darstellung nach JOHANSEN (1991)
10
SketchCoLab
Groupware
•••
Kollaboration und Kooperation vs. E-Kollaboration und E-Kooperation
Der entscheidende Unterschied zu den Begriffen Kollaboration und Kooperation ist somit in der Übertragung der
Handlungen und Kommunikation vom physischen in den
virtuellen Raum zu sehen. Kommunikation dient innerhalb
des kollaborativen und kooperativen Arbeitens in einer
Gruppe zum Austausch von Informationen und ist ein zentraler Bestandteil für Interaktionen. So unterscheidet sich
beispielsweise der Grad der Kommunikation je nach Intensität der auszutauschenden Informationen. (BORGHOFF &
SCHLICHTER, 2000, S. 110) Wie Abbildung 3 zeigt, erfordern vor allem Kooperation und Kollaboration gegenüber
anderen Phasen der Zusammenarbeit (Information, Koordination) in einer Gruppe ein hohes Maß an Kommunikation,
da alle Beteiligten auf ein gemeinsames Ziel hinarbeiten.
Mit der Übertragung der Interaktionen und Kommunikation auf computergestützte Systeme geht jedoch der
komplette oder teilweise Verlust von gestischen, mimischen
und sprachlichen Feinheiten sowie der Informationen zur
kulturellen und sozialen Orientierung einher. Dadurch entsteht zunächst der Eindruck, dezentrale, computergestützte
Kollaboration und Kooperation kann im virtuellen Raum
nicht oder zumindest nicht zufriedenstellend funktionieren.
INFORMATION
gering
KOORDINATION
KOOPERATION
Grad der Kommunikation in der Gruppe
Trotz der Komplexität, die kooperative und vor allem kollaborative Handlungen mit sich bringen, und der daraus
resultierenden hohen Ansprüche an CSCW, kann die computervermittelte Zusammenarbeit neben Problemen, auch
Chancen und neue Möglichkeiten bedeuten.
Diese ergeben sich aus der Übertragung der Interaktionen in den virtuellen Raum und sind auch nur in diesem
Kontext möglich. So kann beispielsweise die nicht vorhandene physische Präsenz der Gruppenmitglieder zu einer
erhöhten Kommunikations-Effizienz führen und somit zu
einem schnelleren, leichteren oder einfacheren Erreichen
des angestrebten Ziels. Auch können Arbeitsprozesse
durch computergestützte Kommunikation flexibler gestaltet
werden, sie ermöglichen die Archivierung von Kommunikationsabfolgen oder erlauben die Anreicherung der Kommunikationsprozesse durch zusätzliche Informationen, beispielsweise durch visuelle Elemente wie Bilder und Videos
(STOLLER-SCHAI, 2009, S. 72 ff.).
Eine erweiterte Betrachtung der Probleme und Chancen
von Kommunikationshandlungen innerhalb computergestützter Systeme zeigt Tabelle 2.
Informieren
Sehr geringe Form der Zusammenarbeit, da Informationsaustausch meist nur in einer Richtung stattfindet und Absender
und Empfänger kaum Kontakt
haben.
Koordinieren
Absender und Empfänger stehen
in direktem Kontakt und stimmen
ihre Handlungen ab, beispielsweise durch gemeinsame
Nutzung von Ressourcen.
KOLLABORATION
hoch
Abbildung 3: Intensität des Informationsflusses innerhalb einer Gruppe
Darstellung nach BORGHOFF & SCHLICHTER [2000]
11
SketchCoLab
•••
Groupware
Eine weitere von Greenberg stammende Definition zum
Thema CSCW zeigt, dass neben der Festlegung als
wissenschaftliche Disziplin der Begriff Groupware als ein
zusätzlicher Aspekt im Kontext der computergestützten
Arbeit auftaucht (siehe Abbildung 4).
„CSCW is the scientific discipline that motivates and
validates groupware design. It is study and theory of how
people work together, and how computer and related
technologies affect group behaviour.”
(GREENBERG, 1991, S. 1)
Erweitert man GREENBERGS Aussage durch JOHANSENS
Definition von Groupware, so versteht man darunter den
Probleme computervermittelter Kommunikation
„allgemeinen Begriff für spezielle computerbasierte Hilfe,
die für den Einsatz innerhalb kollaborativer Arbeitsgruppen gestaltet wurde“. Dabei kann „Groupware Software,
Hardware, Dienste und/oder Unterstützung für Gruppenprozesse beinhalten“ (JOHANSEN, 1988, S. 1, Übers.
THOMAS SOYTER).
Groupware (auch CSCW-System genannt) soll demnach die computerbasierte kollaborative und kooperative
Zusammenarbeit innerhalb von Teams erleichtern und beim
Erreichen gemeinsamer Ziele helfen. Dies wird in der von
ELLIS, GIBBS & REIN zusammenfassenden Betrachtung unterstützt und hinsichtlich eines Interfaces für eine gemeinsame Arbeitsumgebung erweitert wird:
Chancen computervermittelter Kommunikation
• Große Unsicherheit bei Anfängern, die über keine oder wenige
Erfahrung im Umgang mit den neuen Medien haben
• Kommunikation im virtuellen Raum ist oft persönlicher und ehrlicher
• Verlust der „Orientierung“ innerhalb des virtuellen Raums möglich,
da physischer Kontext fehlt. Kann z. B. zu dissozialem Verhalten
führen
• Lern- und Arbeitsprozesse können mit Hilfe computerunterstützter
Kommunikation flexibler gestaltet werden
• Anonymität und fehlender sozialer Kontext können zu einem falschen
kommunikativen Verhalten, z. B. Verlust der Höflichkeit führen
• Das Digitalisieren von Kommunikationsabfolgen ermöglicht die
Archivierung und erleichtert die Suche nach relevanten Informationen
- Vorgänge können in Form von Video, Audio, etc. angereichert
werden
• Mögliche Überreaktion auf schriftliche Äußerungen, da z. B.
gestische und mimische Zusatzinformationen fehlen
• Mehr Zeit zum Überlegen und zur Reflexion bei asynchronen
Kommunikationsabfolgen, da keine sofortige Reaktion erfolgen muss
• Schwierig im virtuellen Raum zusammen produktiv zu sein und z. B.
sinnvolle Entscheidungen effektiv zu treffen
• Inhalte können gleichzeitig während des Kommunikationsprozesses
dargestellt, diskutiert und überprüft werden
• Durch Wegfallen des Aufwands für die physische Präsenz, kann die
Kommunikation effektiver werden, da vermehrt eine Konzentration
auf die Inhalte erfolgt
Tabelle 2: Vor- und Nachteile von E-Kollaboration und E-Kooperation
Eigene Darstellung nach STOLLER-SCHAI (2009, S. 73 ff.)
12
SketchCoLab
•••
„Groupware are computer-based systems that support
groups of people engaged in a common task (or goal)
and that provide an interface to a shared environment.“
ELLIS, GIBBS & REIN (1991)
Klassifikationen von Groupware
Aufgabe der meist softwarebasierten technischen Systeme
respektive Groupware ist es den Aspekt der Gruppenarbeit
neu zu gestalten, sowie die Interaktion zwischen Nutzern
im virtuellen Raum zu fördern und zu koordinieren. Dabei ergeben sich verschiedene Ansätze zur Einteilung der
computerunterstützten Gruppenarbeit und der verwendeten Werkzeuge. Eine Möglichkeit ist, die Werkzeuge nach
der Form der Interaktion zwischen Benutzern im Hinblick
auf Zeit und Raum zu unterscheiden. Eine weitere in der
klassischen Literatur vorgenommene Einteilung orientiert
sich am Grad der Unterstützung in Bezug auf die Bereiche
Kommunikation, Koordination und Kooperation. Die Klassifizierung nach funktionsorientierten Anwendungsbereichen
stellt ebenfalls eine oft genannte Methode der Einteilung
von CSCW-Systemen dar. Im Folgenden sollen die genannten Ansätze exemplarisch vorgestellt werden, um sowohl
einen Überblick über wichtige Aspekte und Eigenschaften
von Groupware bzw. Groupware-Werkzeugen zu erhalten, als auch über einen Eindruck bezüglich der Herausforderungen, die an solche CSCW-Systeme gestellt werden.
Groupware
Groupware, auch CSCWSysteme genannt, dienen zur
Unterstützung computerbasierter
Kollaboration und Kooperation. Primär handelt es sich um
Software-Lösungen - aber auch
Hardware, Dienste oder andere
den Gruppenprozess unterstützende Systeme fallen unter den
Begriff Groupware.
Organisationswissenschaften
Anthropologie
Wirtschaftswissenschaften
Informatik
Soziologie
CSCW
Ethnographie
Groupware / CSCW-Systeme
Psychologie
Arbeitswissenschaften
Wirtschaftsinformatik
Abbildung 4: Zusammenhang zwischen CSCW und Groupware
Eigene Darstellung
13
SketchCoLab
•••
Raum-Zeit-Taxonomie
Die Unterscheidung von CSCW-Systemen hinsichtlich des
Einsatzes innerhalb von Zeit und Raum wurde von ROBERT
JOHANSEN geprägt. Er entwickelte eine zweidimensionale Matrix, in der die Werkzeuge zur computergestützten Arbeit in „synchron“ und „asynchron“ bzw. „räumlich
zeitgleich / synchron
entfernt“ und „an einem Ort“ kategorisierte. Während
bei synchroner Interaktion bzw. Kommunikation (z. B. per
Chat-System) Benutzer mittels CSCW-Werkzeugen eine gemeinsame Aufgabe oder Tätigkeit gleichzeitig bearbeiten,
sind asynchrone Interaktionen (z. B. per Email) geprägt
durch die zeitversetzte Zusammenarbeit und Kommunika-
zeitversetzt / asynchron
Zeit
räumliche
Ko-Präsenz
• Elektronische Meeting-Systeme
• Elektronische Meeting-Systeme
• Face-to-face-Kommunikation
• E-Mail
• Wahlsysteme
• Gemeinsam genutzte Dateien
• Präsentationsunterstützung
• Elektronische Bulletin Boards
• Sitzungsraum
• Diskussionsdatenbanken
• Workﬂow-Systeme
• Gruppenkalender
Raum
• Geteilte PC-Arbeitsplätze
fehlende räumliche
Ko-Präsenz
• Video-Konferenz
• Brief
• Gemeinsam genutzte Whiteboords
• Fax
• Text-Chat
• Anrufbeantworter
• Gemeinsame genutzte Anwendungen
• E-Mail
• Telefongespräch
• News-Groups
Abbildung 5: Raum-Zeit-Matrix in der ursprünglichen Form
Darstellung nach JOHANSEN (1988, S.44)
14
SketchCoLab
•••
tion von Nutzern. Neben dem zeitlichen Aspekt wird darüber hinaus bezüglich der physischen Präsenz der Mitglieder einer Gruppe unterschieden, also ob sie sich in einem
Raum befinden oder voneinander entfernt sind (JOHANSEN, 1988, S.44).
Abbildung 5 zeigt diese Raum-Zeit-Matrix und gibt einen Überblick über die Kategorisierung verschiedener Interaktionsformen und Groupware-Werkzeuge.
Die zeitliche und räumliche Einteilung ist eine zwar oft
genutzte und einfache Klassifizierungsmethode von CSCWSystemen, die jedoch durchaus Schwachstellen und Probleme aufwirft. Einerseits ist es mittlerweile dank der rasanten
Entwicklung der Kommunikationstechnologien nicht mehr
so wichtig, wo und wann die Anwendung der Groupware
erfolgt, da durch die räumlich und zeitlich unabhängige
Nutzung des Internets orts- und zeitbezogene Grenzen
verschwinden. Andererseits ist die Raum-Zeit-Matrix nicht
als starre Ein- und Abgrenzung geeignet. So können viele Groupware-Werkzeuge innerhalb der Matrix mehrfach
oder aber auch schwer bzw. gar nicht eingeordnet werden
(BORGHOFF & SCHLICHTER, 2000, S. 119).
Die von JOHANSEN entwickelte Raum-Zeit-Matrix wurde deshalb von JONATHAN GRUDIN (1994) durch den
zusätzlichen Aspekt der „Vorhersehbarkeit“ erweitert (siehe Abbildung 6). Durch die Punkte „vorhersehbar“ bzw.
„nicht vorhersehbar“ soll eine Kategorisierung von im Vorfeld bezüglich Raum oder Zeit nicht definierbaren Systemen möglich gemacht werden. Dennoch können auch bei
dieser Matrix, Systeme mehr als einer Kategorie zugeordnet werden, was eine exakte Abgrenzung der einzelnen
verschieden (asynchron),
vorhersehbar
gleich (synchron)
Raum-Zeit-Matrix
Modell zur Klassifikation von
Groupware, bei dem die
Groupware-Systeme hinsichtlich
der Faktoren Zeit (zeitgleich
oder zeitlich versetzt) und Raum
(räumlich nah und räumlich
entfernt) eingeordnet werden.
verschieden (asynchron),
nicht vorhersehbar
Zeit
• Face-to-face-Kommunikation
verschiedener Ort,
vorhersehbar
verschiedener Ort,
nicht vorhersehbar
Raum
gleicher Ort
• Organisation von
Schichtarbeit
• Schwarzes Brett
• Sitzungsraum
• Video-Konferenz
• E-Mail
• Kooperatives Schreiben
via Draft Passing
• Mobilfunkkonferenz
• Asynchrone rechnergestützte
Konferenz
• Vorgangsbearbeitung
Abbildung 6: Erweiterte Raum-Zeit-Matrix (GRUDIN)
Darstellung nach GRUDIN (1994)
15
SketchCoLab
•••
Synchrone
Kollaboration / Kooperation
Zeitgleiche kollaborative und
kooperative Zusammenarbeit
innerhalb einer Gruppe (z. B.
mittels Chat).
Werkzeuge und Systeme zum Teil verhindert.
Eine weniger starre Einteilung bietet dagegen die von
TEUFEL, SAUTER, MÜHLHERR & BAUKNECHT (1995, S.
25) angepasste Raum-Zeit-Matrix von JOHANSEN (siehe
Abbildung 7). Anhand der Gruppeneditoren (mehrere Nutzer arbeiten an einem Dokument oder Objekt) sieht man
bei dieser Form der Kategorisierung beispielsweise, dass
Systeme innerhalb der Matrix keine eindeutige Zuordnung
Asynchrone
aufweisen müssen. So gibt es Gruppeneditoren, mit denen
Nutzer gleichzeitig an einem Dokument (synchron) arbeiten können und andere Editoren, die die teilnehmenden
Nutzer über Änderungen benachrichtigen, jedoch nicht in
Realzeit (asynchron). Wichtig ist demnach, dass die Einteilung innerhalb der Matrix dynamisch gesehen werden
kann und Groupware-Systeme zwischen den Schnittstellen
bzw. innerhalb aller Segmente agieren sollten, da gerade
Zeit
elektronische
Post-Systeme
Zeitversetzte kollaborative und
kooperative Zusammenarbeit
innerhalb einer Gruppe (z. B.
mittels Email).
asynchron
spez. Datenbanken
verteilte
Hypertext-Systeme
spez. Planungs-Systeme
Workflow Management-Systeme
Bulletin Board-Systeme
Gruppeneditoren
synchron
Video- bzw.
Desktop-Konferenzen
Sitzungs- und
Entscheidungsunterstützungs-Systeme
Raum
benachbart
Abbildung 7: Erweiterte Raum-Zeit-Matrix (TEUFEL)
Darstellung nach TEUFEL, SAUTER, MÜHLHERR & BAUKNECHT (1995, S. 25)
16
SketchCoLab
entfernt
•••
das den Einsatz von Groupware notwendig und interessant
macht (JOHANSEN, 1991).
Überträgt man zusammenfassend die Aspekte der
Raum-Zeit-Taxonomie auf Systeme für computergestützte
Kooperation und Kollaboration zeigt sich, dass Groupware-Werkzeuge zur Unterstützung am gleichen Ort zur gleichen Zeit, am gleichen Ort zu unterschiedlicher Zeit, sowie
an unterschiedlichen Orten zu gleicher Zeit und an unterschiedlichen Orten zu unterschiedlicher Zeit zur Verfügung
gestellt werden. Anspruch von Groupware-Systemen sollte
es sein, alle vier Quadranten der Matrix abzudecken und
somit sowohl synchron und asynchron, als auch lokal und
verteilt benutzbar zu sein (ELLIS et al., 1991).
3K-Modell
Eine weitere Möglichkeit der Klassifizierung von CSCWSystemen greift den bereits genannten Intensitätsgrad der
stattfinden Interaktionen innerhalb einer Gruppe auf. Beim
3K-Modell (siehe Abbildung 8) wird allgemein zwischen
den drei Bereichen Kommunikation, Koordination und Kooperation unterschieden. Verteilt nutzbare Werkzeuge werden danach kategorisiert, in welchem Ausmaß sie jeweils
diese Bereiche unterstützen (TEUFEL et al., 1995, S. 27 f.).
Der Punkt Kooperation ist innerhalb dieses Dreiecks durch
Kollaboration erweiterbar bzw. austauschbar.
Darüber hinaus definieren TEUFEL et al. die sich überschneidenden Systemklassen Kommunikation, gemeinsame Informationsräume sowie Workflow Management und
Workgroup Computing, um eine Zusammenfassung von
CSCW-Systemen zu ermöglichen.
Die Systemklasse Kommunikation dient dem Austausch
von Informationen durch das Überwinden von Zeit- und
Raumunterschieden. Ebenfalls, wie in der bereits dargestellten Raum-Zeit-Matrix, werden die Werkzeuge einer Groupware somit auch hinsichtlich synchroner und asynchroner
Aspekte beleuchtet. Systeme der Klasse gemeinsame Informationsräume unterstützen den Informationsaustausch
innerhalb der Gruppe, während die weitere Systemklasse
Workflow Management Werkzeuge zur Gruppenkoordination zur Verfügung stellt. Ziel der Systeme der Klasse Workgroup Computing ist eine möglichst optimale Kooperation
und Kollaboration der Gruppenmitglieder zu erreichen.
Kommunikationsorientierte Werkzeuge (z. B. Chat, EMail) dienen dem möglichst zeitnahen und verlässlichen
Austausch von Informationen und stellen somit den Grundstein für die Zusammenarbeit in einer Gruppe dar. Ziel der
Koordinationswerkzeuge (z. B. Termin- und Ressourcenplanung) ist es, kooperative und kollaborative Gruppenprozesse möglichst effizient zu planen, während Werkzeuge
zu Kooperations- und auch Kollaborationszwecken (z. B.
Gruppeneditoren, elektronische Sitzungsräume) dazu dienen, gemeinsame Ziele möglichst effizient zu erreichen.
Auch hier können die Werkzeuge hinsichtlich asynchron
und synchron unterschieden werden, sind jedoch im Gegensatz zur Raum-Zeit-Matrix nach JOHANSEN keiner
starren Einordnung innerhalb der Matrixfelder unterworfen. Beispielsweise ist bei Gruppeneditoren eine zeitgleiche und / oder zeitversetzte Arbeit an einem Objekt möglich, die eine unflexible Kategorisierung wenig sinnvoll und
nicht möglich macht (TEUFEL et al., 1995, S. 27 f.).
3K-Modell
Möglichkeit der Klassifikation
von Groupware durch Betrachtung des Intensitätsgrades der
vorhandenen Interaktionen
innerhalb einer Gruppe. Die drei
Bereiche die zur Kategorisierung innerhalb des 3K-Dreiecks
dienen, sind Kommunikation,
Koordination und Kooperation
(bzw. Kollaboration).
Anwendungsorientierte Klassen
Abschließend gilt es noch, die ebenfalls oft genannte Einteilung von CSCW-Systemen nach ELLIS et al. (1991) zu
17
SketchCoLab
•••
ennen. Hier werden CSCW-Systeme in die verschiedenen
Anwendungsklassen Nachrichtensysteme, Gruppeneditoren, elektronische Sitzungsräume, Computer-Konferenzen,
gemeinsame Informationsräume, intelligente Agenten und
Koordinationssysteme unterteilt.
Nachrichtensysteme ermöglichen die Kommunikation
zwischen Nutzern auf elektronischer Basis (z. B. Email).
Gruppeneditoren erlauben das synchrone bzw. asynchrone Bearbeiten von Objekten, z.B. Dokumenten. Die elektronischen Sitzungsräume bieten durch das Sammeln von
beispielsweise Informationen, Arbeitsbereiche zur Unterstützung von Entscheidungen innerhalb der Gruppe an.
Computer-Konferenzen stellen synchrone und asynchrone
Plattformen für Video-, Audio- und Textkonferenzen dar.
Kommunikation
Systemklasse
VideokonferenzSysteme
Kommunikation
E-Mail
BulletinBoardSysteme
gemeinsame
Informationsräume
spez.
Datenbanken
WorkflowManagementWerkzeuge
verteilte
HypertextSysteme
Planungssysteme
Koordination
WorkflowManagement
WorkgroupComputing
Kooperation
Abbildung 8: 3K-Modell
Darstellung nach TEUFEL et al. (1995, S. 27)
18
SketchCoLab
Entscheidungsund Sitzungsunterstützungssysteme
GruppenEditoren
•••
Die gemeinsamen Informationsräume ermöglichen die gemeinsame Verwaltung bzw. den gemeinsamen Zugriff auf
Informationen. Intelligente Agenten sind meist autonom
agierende Programme innerhalb der Groupware, die für
den Nutzer spezielle Aufgaben erledigen (z.B. Protokollierung). Koordinationssysteme bilden Aufgaben zur Koordination von Aktivitäten innerhalb der Gruppe ab, um ein
gemeinsames Ziel zu erreichen.
Diese Art der Einteilung ermöglicht aufgrund des Praxisbezuges eine einfache Form der Kategorisierung, hat
jedoch ebenfalls das Problem, dass Systeme teilweise auch
mehrfach zugeordnet werden können. Z. B. ist es denkbar,
dass Gruppeneditoren auch Nachrichtensysteme beinhalten und somit eine redundanzfreie Zuordnung innerhalb
der anwendungsorientierten Klassen schwierig wird. Außerdem besteht das Problem der Aktualität, da Anwendungsklassen mit der Zeit verschwinden oder dazukommen
könnten (BORGHOFF & SCHLICHTER, 2000, S. 119 ff.).
„Awareness“
CSCW-Systeme zu Unterstützung von computergestützter
kooperativer bzw. kollaborativer Arbeit erfüllen neben der
Darstellung der eigentlichen Aufgabe eine weitere wichtige Funktion, den sogenannten Aspekt der „Awareness“.
Damit wird das Bewusstsein der Nutzer bezüglich anderer am Geschehen beteiligter Gruppenmitglieder innerhalb der Groupware bezeichnet (auch „User Awareness“
bzw. „Group Awareness“ genannt). DOURISH & BELLOTTI
(1992) definieren „Group Awareness” wie folgt:
“Group Awareness is as an understanding of the activities of others which provides a context for own activity.”
(DOURISH & BELLOTTI, 1992)
Die Mechanismen der „Awareness“ spielen vor allem bei
der synchronen computergestützten Kollaboration und Kooperation eine wichtige Rolle. Ein Instrument der „User
Awareness“ bzw. „Group Awareness“ sind beispielsweise
Benutzerlisten innerhalb von Chat-Programmen, bei denen
sichtbar ist, wer sich im Moment im Chatraum befindet und
wer nicht.
Laut GREENBERG, GUTWIN & COCKBURN (1996)
sind verschiedene Arten der „Awareness“ zu unterscheiden, auf die kurz eingegangen werden soll, da sie einen
wichtigen Bestandteil einer Groupware und des kollaborativen und kooperativen Arbeitens ausmachen:
„Informal Awareness“ beschreibt ähnlich dem bereits
genannten Begriff „User Awareness“, das Bewusstsein darüber, welche Gruppenmitglieder derzeit anwesend sind,
ob sie verfügbar oder beschäftigt sind und ggf. mit welcher
Aktivität sie beschäftigt sind.
„Social Awareness“ ist das Bewusstsein über Informationen, die eine Person über andere im Groupware-System
teilnehmende Nutzer in einem sozialen und dialogorientierten Kontext erhält, beispielsweise in welchem emotionalen Zustand eine Person ist oder welche Interessen sie hat.
„Social Awareness“ bedeutet aber auch sich darüber im
Klaren zu sein, was man von anderen Gruppenmitgliedern
erwarten kann und welche Rolle, Stärken und Fähigkeiten
jeder innerhalb einer Gruppe hat (GUTWIN, STARK &
GREENBERG, 1995).
„Structural Awareness“ ist eine Art des „Gewahrseins“
Anwendungsorientierte Klassen
Sie erlauben eine praxisnahe
Kategorisierung durch definierte
Anwendungsbereiche in Form
von Nachrichtensystemen,
Gruppeneditoren, elektronische
Sitzungsräumen, ComputerKonferenzen, Gemeinsamen
Informationsräumen, Intelligenten
Agenten und Koordinationssystemen.
19
SketchCoLab
•••
Awareness
Der Begriff bezeichnet das
“Gewahrsein” bzw. Bewusstsein
bezüglich anderer am Gruppenprozess beteiligter Mitglieder.
Awareness wird durch Informationen über beispielsweise
Aufgaben, Ziele, räumliche
Präsenz, Pflichten oder aktuelle
Tätigkeit der Gruppenmitglieder
definiert.
darüber, wie die Strukturen und Prozesse innerhalb einer
Gruppe aussehen und welche Rolle und Verantwortlichkeit
den jeweiligen Gruppenmitgliedern zuzuordnen ist. Darüber hinaus bedeutet „Structural Awareness“:
„... awareness (that) involves knowledge about such
things as people’s roles and responsibilities, their positions on an issue, their status, and group processes.“
(GREENBERG et al., 1996)
Demnach gehören Informationen über die Einstellung der
Gruppenmitglieder bezüglich eines Themas oder Problems
genauso dazu, wie das Bewusstsein gegenüber dem eigenen Status oder bestimmten Abläufen innerhalb der Gruppenarbeit.
„Work Space Awareness“ wird definiert als „... the upto-the minute knowledge about another group member’s
interaction with a shared workspace.“ (GREENBERG et al.,
1996)
Diese Form der „Awareness“ befasst sich mit der Frage,
in welchem gemeinsamen Arbeitsbereich andere Nutzer
arbeiten, mit welchen Aktionen sie gerade beschäftigt sind
und welche Änderungen sie vornehmen oder vorgenommen haben. Demnach ist „Work Space Awareness“ das
zeitnahe Wissen über die Interaktionen der anderen Gruppenmitglieder innerhalb eines gemeinsamen Arbeitsbereiches.Dieses Wissen über den gemeinsamen Arbeitsbereich
ist essentiell wichtig, um eine möglichst hohe Effektivität
und Effizienz bei der Zusammenarbeit zu gewährleisten.
GUTWIN & GREENBERG (1996) definieren bestimmte
Elemente, welche die „Work Space Awareness“ auszeichnen:
20
SketchCoLab
• Präsenz: Informationen über die Präsenz der verschiedenen Teilnehmer einer Gruppe
• Ort: Informationen über die Orte, an denen gearbeitet wird
• Aktivitätsniveau: aktueller Stand der Bearbeitungsintensität
• Aktionen: Informationen über aktuell stattfindende
Handlungen und Aktivitäten
• Absichten: zukünftig relevante Handlungen oder
Orte
• Veränderungen: getätigte Modifikationen
• Objekte: Informationen über geänderte Objekte
• Reichweiten: Reichweite der Sichtbarkeit von Gruppenteilnehmern
• Möglichkeiten: potentielle Handlungen anderer
Teilnehmer
• Einflussbereich: Informationen zum Wirkungskreis
anderer
• Erwartungen: Ideen und zukünftige Handlungen
anderer Gruppenmitglieder
Darüber hinaus gibt es verschiedene Faktoren, die
ebenfalls auf Awareness Einfluss nehmen und die es möglichst optimal zu steuern gilt. Zum einen ist der Aspekt der
Synchronizität eines Gruppenprozesses zu betrachten. So
werden bei synchronen Interaktionen andere Informationen
benötigt, als bei asynchroner Zusammenarbeit und Kommunikation. Das Speichern und zeitversetzte Abrufen von
Informationen ist primär bei asynchronen Prozessen relevant, während bei synchronen Abläufen Informationen in
Echtzeit notwendig sind.
Weitere Faktoren stellen die von GAVER et al. (1992)
•••
genannten Dimensionen Aufmerksamkeit und Planung innerhalb von Interaktionen dar. Zentrale Fragen dabei sind:
Wie viel Aufmerksamkeit ist für eine bestimmte Interaktion nötig und wie hoch ist der Planungsaufwand dafür? Je
nach Konstellation werden unterschiedliche Informationen
in verschiedener Intensität benötigt.
Abschließend spielt laut GUTWIN & GREENBERG
(1995) die Ähnlichkeit von Sicht und Aufgabe eine weitere
wichtige Rolle bezüglich des Informationsbedarfs im gemeinsamen Arbeitsbereich. So werden beispielsweise bei
gleicher Sicht und unterschiedlichen Aufgaben vor allem
allgemeine Informationen über den anderen Teilnehmer
und seine Aufgabe relevant sein. Dies ist z. B. dann der
der Fall, wenn zwei Teilnehmer das gleiche Dokument, jedoch mit unterschiedlicher Intention lesen. Handelt es sich
dagegen um verschiedene Sichten und verschiedene Aufgaben, sind bereits weniger detaillierte Informationen zu
Handlungen anderer Teilnehmer oder deren Anwesenheit
ausreichend. (GROSS & KOCH, 2007, S. 26 f.)
Potentiale und Anwendungsgebiete von CSCW
Die bisherigen Ausführungen zum Thema Kooperation /
Kollaboration und E-Kooperation / E-Kollaboration, wie
auch die in Abbildung 9 von STOLLER-SCHAI (2009, S.
5) erwähnten Potentiale (speziell E-Kollaboration im Unternehmen), zeigen die Möglichkeiten und Chancen der
computergestützten kollaborativen und kooperativen Zusammenarbeit.
Menschen sind in diesem Sinne gemeinsam kreativer
und erarbeiten nachhaltigeres Wissen. Darüber hinaus
können sie mittels (E-)Kooperation und (E-)Kollaboration
gemeinsame Ziele schneller und einfacher erreichen so-
wie insbesondere durch kollaboratives Arbeiten „Neues“
schaffen, zu dem ein Einzelner nicht in der Lage wäre.
Desweiteren ist durch verbesserte Kommunikations-, Koordinations- und Kooperationsprozesse eine Steigerung der
Effizienz und Transparenz innerhalb von Projekten möglich
(HORNSTEIN, FISCHLER, PERTEK & KOLLER, 2008, S. 16).
Der Einsatz von Kommunikationstechnologien erlaubt
außerdem weitere Möglichkeiten wie Archivierung, Tagging oder die Anreicherung von Informationen durch Anhänge und lässt sowohl räumliche, als auch zeitliche Grenzen verschwinden.
Die Potentiale ermöglichen den Einsatz von CSCW innerhalb der verschiedensten Anwendungsgebiete. Beispiele sind der Einsatz kollaborativer und kooperativer Werkzeuge im Bereich der Softwareentwicklung, der Bildung
und Schulung (E-Learning), sowie der Telekooperation (mediengestützte arbeitsteilige Leistungserstellung zwischen
individuellen Aufgabenträgern, Organisationseinheiten
und Organisationen, die über mehrere Standorte verteilt
sind).Designorientierte Disziplinen wie Produktdesign oder
Architektur sind ebenfalls denkbare Einsatzgebiete für
CSCW-Systeme, als auch der Bereich des kollaborativen
und kooperativen Gestaltens zur Unterstützung des Designprozesses (BORGHOFF & SCHLICHTER, 2000, S. 103 ff.).
Dieser Anwendungsbereich soll im nachfolgenden Kapitel nun genauer betrachtet werden.
21
SketchCoLab
•••
Potenzial
Konsequenzen
• Menschen sind zusammen kreativer
• Internetbasierte Kollaboration erfordert neue
Strategien und Organisationsstrukturen
• Kollaborative Ergebnisse sind nachhaltiger
• MitarbeiterInnen brauchen kollaborative
Kompetenzen
• Kollaboration macht Wissen und Handlungsmuster explizit und reﬂektierbar
• Das kollaborative Unternehmen braucht
kollaborative Technologien
• Durch internetgestützte Kollaboration
entstehen neue Geschäftspotenziale
Warum
E-Kollaboration?
Fakten
Notwendigkeit
• Das Internet ist kollaborativ
• Komplexität erfordert Kollaboration
• Die digitale Wirtschaft ist kollaborativ
• Laterale Kommunikation und laterale
Kooperation nehmen an Bedeutung zu
• Geographische Entfernung erfordert
E-Kollaboration und F2F-Kollaboration
• Internetbasierte Produkte und Dienstleistungen müssen internetgestützt hergestellt
werden
Abbildung 9: Potentiale von E-Kollaboration (in Unternehmen)
Darstellung nach STOLLER-SCHAI (2009, S. 5)
22
SketchCoLab
•••
2.2. Computergestütztes kollaboratives
und kooperatives Gestalten
2.2.1. Digitales und analoges Zeichnen
Warum Zeichnen wichtig ist
„Sketches don’t tell, they suggest.“
(BUXTON, 2007, S. 113)
Für Designer ist die Möglichkeit, durch Zeichnen schnell
und einfach Ideen zu generieren, essentiell für den kreativen Prozess. Das was viele Worte oft nur unzureichend
erklären können, kann in einem Bild oder einer Zeichnung
meist leichter vermittelt werden. Dabei kommt es zunächst
nicht auf die korrekte und möglichst realistische Darstellung
von Formen, Objekten und Farben an, sondern mit Hilfe
von Scribbles eine Ideen- und Kommunikationsbasis für
sich selbst und andere zu schaffen, die nicht mit unnötigen
Details ablenkt (LANDAY & MYERS, 2001).
Schnelles Zeichnen bzw. Skizzieren ist demnach eine
Problemlösungsmethode mit der Personen Ideen und Gedanken schnell bewerten, überarbeiten oder ersetzen können. Dabei ist die kognitive Beanspruchung bezüglich der
Aktivität des Zeichnens an sich (primär beim analogen
Zeichnen) sehr gering, so dass fast die gesamte Konzentration auf den Designprozess direkt fokussiert werden kann
(PLIMMER & APPERLEY, 2002).
Da Design in der Regel als iterativer Prozess zu sehen
ist (TVERSKY, 1999), wird dieser durch die schnelle und
einfache Möglichkeit des Skizzierens unterstützt. Verschie-
dene Experimente haben gezeigt, dass Zeichnen als unterstützende Maßnahme während eines Designprozesses zu
qualitativ besseren Ergebnissen führt und darüber hinaus
die Zusammenarbeit, also Kollaboration und Kooperation,
innerhalb einer Gruppe unterstützen und fördern kann.
(CRAFT & CAIRNS, 2009; PLIMMER & APPERLEY, 2002).
Speziell Designer nutzen beim Gestalten, vor allem in
der frühen Ideenphase ebenfalls räumliche Eigenschaften
der Umgebung. So werden Skizzen und Entwürfe auf dem
Tisch ausgebreitet oder an Pinnwänden und auf Whiteboards gezeigt. Dies fördert die Diskussion und ermöglicht
einen einfachen Zugang und die Sichtbarkeit der Designartefakte für alle Gruppenmitglieder (GEYER, JETTER, PFEIL
& REITERER, 2010).
Analoges Zeichnen
Das Zeichnen mit Papier und Stift stellt dabei die gängigste Form dar, die eingesetzt wird um Gedanken und Ideen
darzustellen. Das analoge Skizzieren bietet dabei viele
Vorteile. So können Ideen freier und schneller exploriert
werden, aber auch den Kreativitätsprozess fördern. Forschungsergebnisse zeigen, dass Designer zu variantenreicheren Lösungen kommen, wenn sie auf Basis von handgezeichneten Entwürfen auf Papier arbeiten. Der Grund dafür
ist, dass skizzierte Entwürfe auf Papier meist mehrdeutig
bzw. weniger konkret und detailreich sind als computergenerierte Ansätze. Somit ist mehr Interpretationsspielraum
vorhanden, der die Aufmerksamkeit nicht auf Details lenkt,
die im frühen Designstadium eher unwichtig sind (LANDAY
& MYERS, 2001).
Darüber hinaus ist das Entwerfen auf Papier günstig,
meist frei verfügbar bzw. ‚wegwerfbar‘ und zeigt charak-
23
Computergestütztes kollaboratives und kooperatives Gestalten
SketchCoLab
•••
teristische Eigenheiten des Zeichners beim Skizzieren und
Schreiben (BUXTON, 2007, S. 111 ff.). Einen wichtigen
Aspekt stellt dabei Papier als Trägermedium dar, das aus
dem (Design-)Alltag kaum wegzudenken ist und aufgrund
verschiedener physikalischer Eigenschaften überzeugt. Papier ist beispielsweise sehr flexibel – Zeichnungen können
daher sehr einfach mit anderen Leuten geteilt werden. Darüber hinaus ist es robust und vielseitig einsetzbar (WEIBEL
et al., 2011).
Kollaboratives Arbeiten wird durch die effektive Kombination aus Kommunikation und Visualisierung erreicht, die
den Beteiligten ein besseres Problemverständnis und das
gemeinsame Erarbeiten von Lösungen ermöglicht (PLIMMER & APPERLEY, 2002).
Analoges Zeichnen hat aber auch eine Reihe von Nachteilen. So ist die Modifikation nur in begrenztem Maße
möglich, ohne etwas neu zeichnen oder aufwändig vervielfältigen zu müssen. Der Platz auf einem Blatt ist begrenzt
und auf Skizzen findet man oft Anmerkungen, die meist
hilfreicher als die eigentliche Zeichnung sein können. Papier eignet sich jedoch weniger als „Designspeicher“ und
lässt die Gründe für bestimmte Entscheidungen während
des Gestaltens oft nicht mehr nachvollziehbar erscheinen
(WEIBEL et al., 2011). Darüber hinaus ist das Archivieren
und Verwalten analoger Skizzen meist wenig komfortabel.
Digitales Zeichnen
Obwohl Stift und Papier beim Skizzieren und Zeichnen
meist präferiert werden, bieten interaktive und computergestützte Systeme ebenfalls eine Reihe von Möglichkeiten und
Vorteile, um den Designprozess zu unterstützen. Zunächst
zeichnen sie sich vor allem dadurch aus, dass die meisten
24
SketchCoLab
Nachteile der analogen Arbeitsweise aufgehoben werden.
Das Zeichnen im digitalen Kontext bietet grenzenlosen
Platz und einen erweiterten Überblick durch Zoomen und
Verschieben. Eine Vielzahl von Werkzeugen ermöglicht
eine vielfältige Bearbeitung, die im Gegensatz zum analogen Zeichnen nicht destruktiv erfolgen muss. So können
(z. B. durch Ebenen), Änderungen an Skizzen durchgeführt
werden, ohne den aktuellen Stand direkt modifizieren zu
müssen. Durch die digitale Basis ist das Speichern, Transformieren und Archivieren von Designartefakten auf einfache und schnelle Weise möglich (PLIMMER & APPERLEY,
2002).
In Bezug auf Kollaboration und Kooperation bietet das
elektronische Zeichnen z. B. auf einem mobilen Gerät
wie dem Tablet Computer weitere Vorzüge. Zwar ist beim
analogen Zeichnen ebenfalls eine kollaborative und kooperative Zusammenarbeit möglich, die zwar schnell und
effektiv sein kann, sie ist aber darauf begrenzt, dass sich
die Teilnehmer zeitgleich am selben Ort aufhalten. Computergestützte Systeme bieten dagegen die Möglichkeit der
Kollaboration und Kooperation über örtliche und räumliche
Grenzen hinweg (siehe Punkt E-Kollaboration und E-Kooperation). Durch die Verwendung eines Tablet Computers verschwimmen diese Grenzen aufgrund der hohen Mobilität
des Gerätes noch ein Stück mehr.
Die vielen zusätzlichen Möglichkeiten des digitalen
Zeichnens können jedoch zugleich Nachteile sein. Während, wie bereits erwähnt, das Skizzieren auf dem Papier
an sich wenig kognitive Belastung erfordert, können computergestützte Systeme bei deren Verwendung schnell gedanklich belasten oder gar überfordern. Durch eine Vielzahl zur Verfügung gestellter Werkzeuge werden Entwürfe
•••
und Ideen oft zu konkret dargestellt, was vor allem während
des frühen prototypischen Skizzierens bezüglich Kreativität
und Ideenreichtum hinderlich sein kann. Darüber hinaus ist
analoges Skizzieren meist schneller als digitales Zeichnen,
da weniger Entscheidungen während des Gestaltens (z. B.
Auswählen des richtigen Werkzeuges) gefällt werden müssen (PLIMMER & APPERLEY, 2002).
Analoges Zeichnen / Skizzieren
Tabelle 3 zeigt noch einmal zusammenfassend eine Reihe
von Vor- und Nachteilen des digitalen und analogen Zeichnens.
Gemeinsames Gestalten
Der Gestaltungsprozess ist in der Praxis oft durch einen linearen Ablauf geprägt, bei dem der Informationsfluss zwischen den Teilnehmern einer Gruppe, die ihr Expertenwis-
Digitales Zeichnen / Skizzieren
Vorteile
• Schnelles und freies Explorieren
• Unbegrenzter Platz zum Zeichnen
• Intuitiv und einfach in der Anwendung
• Einfache Speicherung, Archivierung und Suche
• Günstig und meist frei verfügbar
• Vielfältige Bearbeitungsmöglichkeiten durch viele Werkzeuge
• Sehr schnell in der Umsetzung
• Nicht-destruktive Bearbeitung möglich
• Geringe kognitive Belastung beim Zeichnen an sich
• Erweiterter Überblick (z. B. durch Zoomen)
• Papier als flexibles, robustes und vielseitiges Medium
• Kollaboration und Kooperation ohne räumliche Grenzen möglich
• Kreativitätsfördernd durch Mehrdeutigkeit
• Kollaboratives bzw. kooperatives Arbeiten vor Ort wird gefördert
durch effektive Kombination von Kommunikation und Visualisierung
Nachteile
• Verwalten und Archivieren analoger Zeichnungen aufwendig
• Kognitive Be- und Überlastung verursacht durch die vielen
Möglichkeiten bzw. die digitale Arbeitsumgebung
• Papier als räumlich begrenztes Material
• Langsamer (aufgrund der vielen zu treffenden Entscheidungen bei der
Nutzung digitaler Zeichnen-Werkzeuge)
• Modifikationen schwierig, ohne neu zeichnen zu müssen
• Skizzen z. B. oft zu Beginn zu detailreich (hemmt die Kreativität bzw.
Ideengenerierung)
• Zu Grunde liegende Entscheidungsprozesse in Form z. B. von
Anmerkungen meist schlecht nachvollziehbar (Designspeicher)
• Vervielfältigung aufwendig
Tabelle 3: Vor- und Nachteile digitalen und analogen Zeichnens
Eigene Darstellung
25
SketchCoLab
•••
sen jeweils einbringen, sequentiell erfolgt. Ein Grund dafür
ist, dass ein Designprozess meist durch eine Reihe von
sich wiederholenden Schritten über mehrere Abteilungen
und Disziplinen geprägt ist. Design an sich besitzt jedoch
grundsätzlich kooperatives und vor allem kollaboratives
Potential. Das unterstützen Studien, die zeigen, dass interaktive Kollaboration in Gruppen zu besseren Resultaten
führen kann, als durch einzelne Personen. Vor allem für die
frühe Gestaltungphase, in der es auf das schnelle Entwickeln, Zeichnen, Bewerten und auch Verwerfen von Ideen
ankommt, ist Kollaboration und Kooperation ein wichtiger
Aspekt (CLIFTON et al., 2011).
Bedeutend dabei ist die Betrachtung des Faktors Zeit.
Neben der „Awareness“ spielt beim Gestalten in interaktiven Umgebungen die Frage nach der synchronen bzw.
asynchronen Zusammenarbeit in einer Gruppe ebenfalls
eine zentrale Rolle (siehe auch vorheriges Kapitel Kollaboration und Kooperation). So gilt es beispielsweise zu
klären, wann eine zeitgleiche oder zeitversetzte Zusammenarbeit sinnvoll ist und wie das durch die interaktive
Anwendung möglichst optimal unterstützt werden kann.
Im Folgenden sollen deshalb einige praktische Ansätze und Projekte dargestellt werden, die für den im Rahmen dieser Arbeit entstandenen interaktiven Prototypen
(SketchCoLab) von Bedeutung sind. Die Anwendungsbereiche sind dabei vielfältig und beschränken sich nicht nur
auf Zeichnungen oder Skizzen. Neben den innerhalb eines
Gestaltungprozesses bestehenden Aspekten wie Überarbeiten, Zeichnen und Bewerten ist auch die mögliche kollaborative und kooperative Zusammenarbeit in unterschiedlicher Form zu prüfen. Die Betrachtung relevanter Projekte
soll dabei helfen, wichtige und denkbare Anforderungen
26
SketchCoLab
an eine mobile Anwendung zur gemeinsamen Überarbeitung und Bewertung von Zeichnungen aufzuzeigen.
•••
2.2.2. Praktische Ansätze zum gemeinsamen
Überarbeiten von Zeichnungen
Annotation
Das Überarbeiten von Texten, Zeichnungen, Skizzen oder
anderen visuellen Elementen ist meist eng verbunden mit
deren Erstellung und ein zentraler Bestandteil innerhalb
des kollaborativen Prozesses. Neben der herkömmlichen
Überarbeitung in Form einer Editierung, bei der bereits Bestehendes ganz oder teilweise ersetzt wird, stellt die Annotation (Einzeichnung, Vermerk) (DUDEN, 1990, S. 63)
eine weitere Möglichkeit der Überarbeitung dar.
Dabei bezieht sich eine Annotation immer auf einen
exakten Kontext innerhalb des jeweiligen annotierten Objektes. Dies kann in einem Textdokument ein bestimmter
Wortlaut bzw. Satz oder in einer Skizze ein bestimmtes
Detail sein. Annotationen können sich aber auch auf ein
komplettes Objekt beziehen. Dabei ist es nicht relevant, ob
eine Annotation visuell direkt auf dem Objekt selbst oder
separat (z. B. auf einem extra Zettel oder im digitalen Bereich innerhalb eines eigenen Fensters) sichtbar ist. Wichtig ist lediglich, dass es einen Verweis der Annotation auf
die annotierte Stelle gibt (RIEDEWALD, 2003, S. 6).
Der Vorgang des Annotierens wird folgendermaßen definiert:
„… to add short notes to a book or piece of writing to
explain parts of it.“
(LANGENSCHEIDT-LONGMAN, 2001, S. 45)
Dies bedeutet, dass sich der Begriff der Annotation primär auf die Bearbeitung analoger oder digitaler Texte be-
zieht. Aber auch das Annotieren anderer Visualisierungen
wie Skizzen, Bilder, Diagramme, Videos oder Websites
sind denkbare Einsatzbereiche.
Das Editieren und Annotieren mit dem Stift auf Papierdokumenten ist ein einfacher und natürlicher Weg, Anregungen, Änderungen und Kommentare aufzunehmen. Dadurch wird die Kommunikation und somit der kollaborative
bzw. kooperative Vorgang zwischen den beteiligten Personen gefördert. Die Übertragung dieser intuitiven Form
der Überarbeitung in eine interaktive Umgebung, erlaubt
darüber hinaus erweiterte Möglichkeiten. So können Annotationen beispielsweise modifiziert, übertragen, gespeichert sowie orts- und zeitungebunden mit anderen „geteilt“
werden (PLIMMER, GRUNDY, HOSKING & PRIEST, 2006).
Generell werden zwei Formen der elektronischen Annotation unterschieden: Textorientierte Lösungen und Anwendungen die auf dem Einsatz sogenannter „digitaler
Tinte“ („digital ink“) basieren. „Digital ink“ beschreibt die
Technologie Handgeschriebenes bzw. Handgezeichnetes
erstellt mit Hilfe eines Stifts, Touchscreens oder der Maus
in seiner natürlichen Form auf digitalen Displays darzustellen. Dagegen erfolgt bei textbasierten Anwendungen, die
Eingabe ausschließlich über die Tastatur (und Maus), was
eher als unintuitiv und umständlich erachtet wird (PLIMMER,
CHANG, DOSHI, LAYCOCK & SENEVIRATNE, 2010).
Für das Verfassen größerer Textmengen eignet sich diese Form der Annotation jedoch besser als die stiftbasierte
Variante. Meist ist im praktischen Einsatz eine Kombination
der beiden Annotationsformen sinnvoll.
Es gibt eine Reihe von Ansätzen, die die Annotation
und Auszeichnung von Inhalten ermöglichen. Annotation
ist mit nahezu jedem Grafik- oder Illustrationstool wie Ad-
Annotation
Annotation ist die Auszeichnung
von Objekten bzw. Details innerhalb der Objekte in Form von
Anmerkungen oder beigefügten
Informationen. Die Anmerkungen
stehen direkt im Kontext mit den
annotierten Stellen.
27
SketchCoLab
•••
obe Photoshop (Bildbearbeitungssoftware) oder Adobe
Illustrator (Illustrationswerkzeug) möglich. Außerdem gibt
es eine Vielzahl von Anwendungen, die das kollaborative
und kooperativen Zusammenarbeiten in unterschiedlichen
Bereichen, wie z. B. dem Designbereich unterstützen. Die
hier beispielhaft vorgestellten Projekte beziehen sich auf
Anwendungen, die vornehmlich für den Einsatz auf mobilen Geräten geeignet sind und deren primäres Anwendungsgebiet die Annotation von Inhalten ist.
RELEVANTE PROJEKTE UND ANWENDUNGEN
Skitch (Abbildung 10)
Ursprünglich für die Annotation und Auszeichnung von
Abbildung 10: Skitch Interface
Quelle: http://www.skitch.com » Abruf am 05.02.2012
28
SketchCoLab
Screenshots gedacht,ist Skitch ein Tool, das sich auch zum
Editieren und Annotieren von Bildern, Skizzen und Zeichnungen eignet. Skitch ist als App für den mobilen Einsatz
auf Tablet Computern, sowie Smartphones konzipiert. Das
Annotieren, Auszeichnen und auch Bewerten von Inhalten erfolgt über Formen, Marker, Texte, Pfeile oder kleine
Zeichnungen. Darüber hinaus ist es möglich, z. B. per
Email, Facebook, Twitter oder durch Hochladen auf die
Skitch-Website, die bearbeiteten Inhalte mit anderen Personen zu „teilen“.
Das Annotieren von direkt über das mobile Gerät erstellten Fotos und die Möglichkeit schnell und einfach Pfeile
zu setzen, um die Aufmerksamkeit auf bestimmte Details
zu lenken, sind weitere Features. Das kooperative und kollaborative Überarbeiten eines bestimmten Objektes ist mit
Skitch möglich, erfolgt jedoch in asynchroner Form. Annotierte und zur Verfügung gestellte Inhalte können somit
zwar von anderen ebenfalls editiert und ausgezeichnet
werden, allerdings nur zeitversetzt. Eine zeitgleiche und
zentrale Überarbeitung des exakt gleichen Inhalts durch
mehrerer Nutzer wird nicht unterstützt.
Neben Skitch gibt es weitere ähnliche Tools, wobei viele
davon zur Erstellung und Annotation von Screenshots ausgelegt sind.
iAnnotate (Abbildung 11)
Während viele Annotationstools ihren Schwerpunkt auf die
Auszeichnung von Bild- oder Textdokumenten legen, gibt es
ebenfalls eine Reihe von Anwendungen, die speziell für die
Annotation von Internetseiten durch einen Browser erstellt
wurden. Eine wichtiger Aspekt ist der flexible Charakter
von Websites, die sich oft bezüglich Form und Inhalt än-
•••
dern können. iAnnotate ist eine Mehrbenutzer-Lösung, die
die Annotation mittels „digitaler Tinte“ über einen Browser
ermöglicht. Die Anwendung bietet lediglich drei Funktionen der Annotation: Auszeichnungen mit dem FreiformStift, „Highlighting“ mit dem Marker und das Löschen von
Annotationen. Die erstellten Auszeichnungen und Anmerkungen können gespeichert, aufgerufen und mit anderen
über eine Internetadresse „geteilt“ werden. Alle zu einer
Website gehörenden und von verschiedenen Anwendern
vorgenommenen Annotationen können auf der gleichen
Seite dargestellt werden. Hier kann die Kollaboration und
Kooperation zwar prinzipiell zeitgleich erfolgen, jedoch
nicht auf einer gemeinsamen Arbeitsoberfläche. iAnnotate
ist mit einem Algorithmus ausgestattet, der die Zuordnung
der Annotationen zu den jeweiligen HTML-Elementen innerhalb einer Website sicherstellt.
Abbildung 11: iAnnotate - Annotation innerhalb Websites
Quelle: PLIMMER et al. (2010)
Abbildung 12: Remarkz
Quelle: Screenshot http://www.remarkz.com/F5oRPY » Erstellt am 05.02.2012
Remarkz (Abbildung 12)
Eine ähnliche Lösung stellt Remarkz dar, ein Bookmarklet
(Makro für den Browser) mit dem Websites annotiert werden können. Neben den Features, Inhalte einer Internetseite
mit Text, Pfeilen oder Freiformen auszuzeichnen, wird auch
die Annotation durch emotionale Symbole (z. B. Smiley)
ermöglicht. Die durch den Nutzer getätigten Auszeichnungen werden direkt dem nächstliegenden HTML-Element zugeordnet, können aber auch frei verschoben werden. Eine
besondere Funktion stellt die Timeline dar. Durch sie kann
der sequentielle Ablauf der Auszeichnungen durch einen
bzw. mehrere Benutzer im Nachhinein nachvollzogen werden. Die Annotationen können mit anderen Nutzern per
Email, Facebook oder Twitter geteilt werden. Somit ist eine
kollaborative und kooperative Zusammenarbeit möglich,
29
SketchCoLab
•••
die aber nur zeitversetzt und nicht zentral innerhalb eines
gemeinsamen Arbeitsbereiches erfolgen kann.
u-Annotate (Abbildung 13)
Die an der RWTH Aachen entstandene Anwendung uAnnotate stellt die benutzerzentrierte Möglichkeit der Freiform-Annotation durch „digitale Tinte“ von Online-E-Learning-Inhalten zur Verfügung. Ziel des webbasierten Tools
ist das freie Auszeichnen und Annotieren von Inhalten mit
Hilfe stiftgestützter Geräte, wie z. B. einem Tablet Computer. Neben der freien Annotation durch Stiftwerkzeuge
ist auch die Textauszeichnung durch Marker möglich. Die
Überarbeitungen können gespeichert und über eine Importund Exportfunktion mit anderen Lernenden geteilt werden.
Abbildung 13: u-Annotate
Quelle: http://dbis.rwth-aachen.de/cms/projects/u-annotate » Abruf am
05.02.2012
30
SketchCoLab
PhotoAnnotate (Abbildung 14)
Eine reduzierte Form der Annotation ist die Markierung von
Inhalten. Die App PhotoAnnotate arbeitet ausschließlich
mit Markern in Form der Metapher „Stecknadel“, die per
Fingertipp oder Stifteingabe auf Fotos, Bilder, Skizzen, etc.
gesetzt und mit entsprechenden Informationen wie Text, Internetadressen sowie Audioaufnahmen verknüpft werden
kann. Ein freies Annotieren durch Stift- oder Pfeilwerkzeuge
ist nicht vorgesehen. Die asynchrone Zusammenarbeit wird
durch das „Teilen“ per Email oder Facebook unterstützt,
wobei die zeitgleiche Überarbeitung durch mehrere Anwender an einem Objekt nicht möglich ist.
Abbildung 14: PhotoAnnotate
Quelle: http://itunes.apple.com/de/app/photo-annotate-ewp/
id439877294?mt=8 » Abruf am 05.02.2012
•••
TheCommentor (Abbildung 15)
Die Webapplikation TheCommentor ermöglicht, neben den
gängigen Formen der Annotation mittels Formen und Text,
die Auszeichnung durch Sprache bzw. Ton. Darüber hinaus können nicht nur pixelbasierte Formate wie Bilder,
sondern auch PDF-Dokumente markiert und ausgezeichnet
werden. Für das Teilen der annotierten Inhalte können die
gewünschten Nutzer eingeladen werden, die über eine
spezielle Internetadresse dann ebenfalls die entsprechenden Inhalte auszeichnen und markieren können. Sobald
eine Überarbeitung abgeschlossen wird, werden alle beteiligten Personen per Email benachrichtigt. Demnach ist eine
zeitgleiche Überarbeitung grundsätzlich möglich, jedoch
ohne Unterstützung einer „Workspace-Awareness“ bzw.
eines gemeinsamen Arbeitsbereiches.
laboration und Kooperation durch unterstützende Kommunikationsmöglichkeiten im Vordergrund. So können neben
einfachen Textboxen zur Kommunikation auch strukturierte,
sich aufeinander beziehende Kommentare (ähnlich wie in
einem Forum) zu bestimmten Bereichen des annotierten Dokuments erstellt werden. Auch ein Chat zur Unterstützung
von Diskussionen ist integriert. Die Teilnehmer werden, sofern sie offline sind, per Email verständigt, wenn eine Überarbeitung erfolgt bzw. ein neuer Kommentar vorhanden ist.
Weitere interessante Features stellen der Vergleich von Bildern bzw. Inhalten und die umfangreichen Konfigurationsoptionen für Benutzerprofile (Rollen und Berechtigungen)
dar. ConceptShare arbeitet mit gemeinsamen Workspaces,
die für definierbare Nutzer zugänglich sind und die bei-
ConceptShare (Abbildung 16)
Bei dieser Anwendung steht neben dem Auszeichnen von
vielfältigen Inhalten (Bilder, Textdokumente, Videos) die Kol-
Abbildung 15: TheCommentor » http://www.thecommentor.com/
Quelle: Screenshot http://www.thecommentor.com/file/sdusl » Erstellt am
06.02.2012
Abbildung 16: ConceptShare » http://www.conceptshare.com/
Quelle: http://media.smashingmagazine.com/images/conceptshare.png »
Abruf am 06.02.2012
31
SketchCoLab
•••
spielsweise sämtliche Elemente eines Entwurfs beinhalten.
Damit ist eine synchrone Kollaboration und Kooperation
innerhalb einer gemeinsamen Arbeitsoberfläche möglich.
Twiddla (Abbildung 17)
Die umfangreiche webbasierte Anwendung für Designkollaboration eignet sich neben der Überarbeitung von Zeichnungen, Bildern, Websites und Dokumenten auch als Brainstorming- und sogar eigenständiges Zeichnen-Tool. Wie
eine Reihe ähnlicher Anwendungen ist Twiddla auf eine
Echtzeitkollaboration ausgerichtet, bei der mehrere Nutzer
parallel innerhalb einer gemeinsamen Arbeitsumgebung
arbeiten können. Die Zusammenarbeit kann jedoch auch
zeitversetzt stattfinden. Hier wird der Aspekt der Kommunikation ebenfalls durch Chat unterstützt. Das Tool bietet
darüber hinaus eine Vielzahl an Annotationsmöglichkeiten
wie Pfeile, Pinsel, Formen und Texte an.
Abbildung 17: Twiddla » http://www.twiddla.com
Quelle: Screenshot http://www.twiddla.com/746559 » Erstellt am
06.02.2012
32
SketchCoLab
iAnnotate PDF (Abbildung 18)
Wie bereits erwähnt, ist die Annotation auch bei Textdokumenten eine wichtige Form der Überarbeitung. iAnnotate PDF ist eine App, die das Auszeichnen und Markieren
von PDFs auf dem iPad ermöglicht. Ähnlich der bekannten
Anwendungen Adobe Acrobat und Adobe Acrobat Reader können Textdokumente in vielfältiger Weise annotiert
werden. Neben der Auszeichnung durch den Freiform-Stift
oder Notizen können Informationen in Form von Sprache
oder Bildern dem Dokument hinzugefügt werden. Darüber
hinaus gibt es spezielle Möglichkeiten der Textmarkierung
durch Unterstreichen und Durchstreichen von beliebigen
Textstellen. Der Aspekt der Kollaboration und Kooperation
erfolgt durch den asynchronen Austausch der markierten
Abbildung 18: iAnnotate PDF
Quelle: http://www.wisecwa.com/digitaloffice/wp-content/uploads/2010/06/iannotate1.jpg » Abruf am 06.02.2012
•••
Dokumente mit anderen Personen z. B. per Email.
Multi-User Sketchpad (Abbildung 19)
Abschließend soll erwähnt werden, dass eine Vielzahl der
Tools für Designkollaboration vornehmlich für das gemeinsame Zeichnen oder Malen ausgelegt sind und weniger für
das Annotieren von Inhalten. Ein Beispiel ist das als Experiment konzipierte webbasierte Multi-User Sketchpad, bei
dem mehrere Personen gleichzeitig an einem Bild arbeiten.
Das Besondere daran ist, dass es keine definierten Nutzer gibt, die speziell zu einer Zusammenarbeit eingeladen
wurden. Jeder der die Website aufruft, kann sich bei der Erstellung eines gemeinsamen Werkes beteiligen (Stichwort:
Kunst-kollaboration bzw. Art Collaboration). Der Umfang
der Optionen ist dabei minimal gehalten. Das Zeichnen ist
nur mit einem Stiftwerkzeug mit fester Größe möglich und
Abbildung 19: Multi-User Sketchpad » http://mrdoob.com/projects/
multiuserpad/
Quelle: http://www.usefuldistractions.co.uk/wp-content/uploads/2011/02/
Multiuser-Sketchpad1-695x469.jpg » Abruf am 06.02.2012
die Kommunikation wird lediglich durch eine Chatfunktion
unterstützt.
Auch wenn einige der vorgestellten praktischen Ansätze
sich nicht oder nur zum Teil auf die konkrete Überarbeitung
von Zeichnungen fokussieren wird deutlich, dass kollaboratives und kooperatives Annotieren von visuellen Inhalten
eine wichtige Funktion darstellt. Maßgeblich führt sie zu
einer intensiven Beschäftigung mit dem Inhalt und einem
verstärkten Ideenaustausch (PLIMMER et al., 2010).
ERKENNTNISSE FÜR DEN PROTOTYP
Die Annotation ist konsequenterweise als zentraler Aspekt
der Überarbeitung von Zeichnungen in den entwickelten
Prototypen eingeflossen. Durch die Betrachtung der vorgestellten Projekte, die allerdings nur als eine Auswahl zu sehen sind und weiterer Recherchen, lassen sich einige Kernfunktionen herausarbeiten. Gemeint sind dabei Funktionen,
die eine mobile Anwendung zur gemeinsamen Überarbeitung von Zeichnungen in Form der Annotation auszeichnen. Grundsätzlich lässt sich sagen, dass viele der existierenden Ansätze webbasierte Lösungen sind. Diese sind
sowohl für den mobilen Einsatz, als auch für den Einsatz
auf Desktop-Rechnern geeignet und ermöglichen eine plattformübergreifende Verwendung. Die Umsetzung als App,
für mobile Endgeräte wie Tablet Computer oder Smartphones, ist ebenfalls gängig, jedoch weniger verbreitet.
Annotationsarten
Nahezu alle der untersuchten Annotationstools unterstützen
die beiden gängigen Formen der Annotation durch Texteingabe und digitale Tinte. Dies ist darauf zurückzuführen,
33
SketchCoLab
•••
dass die Kombination der beiden Annotationsarten eine
größtmögliche flexible Überarbeitung durch den Nutzer
erlaubt. So werden die Vorteile beider Annotationsformen
genutzt. Werden beispielsweise Kommentare geschrieben,
ist die Annotation per Texteingabe durch (Touchscreen-)
Tastatur praktischer, als wenn ein bestimmter Inhaltsbereich
nur durch ein Wort ausgezeichnet werden soll. Dann ist
das freihändige Schreiben mit digitaler Tinte intuitiver und
schneller.
Werkzeuge zur Annotation
Die Möglichkeiten zur Annotation sind vielfältig und richten
sich darüber hinaus nach den zu annotierenden Inhalten.
So erfordert das Auszeichnen von Textdokumenten zum Teil
andere Werkzeuge (z. B. Text unterstreichen oder durchstreichen) als die reine Bild- oder Fotoannotation. Da innerhalb dieser Arbeit die Überarbeitung von Zeichnungen
und Skizzen im Vordergrund steht, werden vornehmlich die
Werkzeuge zur Bildauszeichnung betrachtet.
Das zentrale Tool zur Auszeichnung stellt der FreiformStift dar. Er entspricht nahezu der intuitiven Auszeichnung
mit Stift und Papier. Der Freiform-Stift wird häufig für eine
erweiterte und verbesserte Annotation durch weitere Optionen wie Farbwahl oder Strichstärke ergänzt.
Neben der Möglichkeit Inhalte mit dem Freiform-Stift
auszuzeichnen, stellen aber auch verschiedene definierte
geometrische Formen wie Kreise und vor allem Pfeile wichtige Werkzeuge dar. Letztere dienen in der Regel zur Verknüpfung von Auszeichnungen mit den jeweils relevanten
Bereichen innerhalb des Annotationsobjekts.
Eine weitere wichtige Form der Auszeichnung ist das
Markieren bzw. „Highlighting“. Ähnlich wie mit einem
34
SketchCoLab
analogen Text-Marker können damit Inhalte hervorgehoben werden, ohne dass der jeweilige Teil „übermalt“ wird.
Auch dieses Werkzeug besitzt meist zusätzliche Funktionen
wie z. B. die Möglichkeit der Farbwahl.
Eine erweiterte Form der Annotation ist die Integration von Bildern, Sprach- und Videoaufnahmen, die durch
die Übertragung der Annotation in den digitalen Kontext
ermöglicht wird. Diese Werkzeuge müssen nicht zwangsläufig Teil eines Annotationstools sein, nutzen jedoch die
vielfältige Ausdrucksweise von Menschen.
Workflow
Abgesehen von der eigentlichen Annotation werden auch
den Workflow betreffende Features benötigt. Primär sind
Möglichkeiten gemeint, die die auf der Arbeitsoberfläche
stattfindenden Nutzer-Aktivitäten kontrollieren. So ermöglichen nahezu alle Annotationstools das Löschen von Inhalten durch einen „Radiergummi“ und das Rückgängigmachen und Wiederholen von Arbeitsschritten. Ebenfalls wird
meist das Zoomen und Verschieben der Arbeitsfläche bzw.
der einzelnen Annotationselemente unterstützt.
Archivieren und Speichern
Eine weitere Stärke elektronischer Annotationstools ist die
einfache Archivierung und Speicherung von Auszeichnungen. So können die annotieren Inhalte in den gängigen
Tools meist in Form von Bildern auf digitalen Datenträgern
gespeichert werden und erlauben damit einen bequemen
und schnellen Austausch annotierter Inhalte.
Die Möglichkeit des Austausches der Inhalte ist ein wichti-
•••
ger Aspekt der Kollaboration und Kooperation. Ein Großteil der recherchierten Tools unterstützt die Zusammenarbeit
durch die Möglichkeit des asynchronen „Teilens“ von annotierten Inhalten. Die jeweiligen Inhalte werden, beispielsweise per Email, an andere Nutzer zur Betrachtung oder
weiteren Annotation übermittelt. Es entsteht ein Austausch
zwischen mehreren Personen, der die Zusammenarbeit
fördert. Wenige Tools erlauben das synchrone Annotieren
innerhalb einer zentralen gemeinsamen Arbeitsoberfläche.
Somit ist der Workspace bezüglich der Zusammenarbeit
einer Gruppe ein zentraler Aspekt. Die gängigen Annotationstools stellen dem Anwender eine persönliche Arbeitsumgebung zur Verfügung. Das bedeutet, dass innerhalb dieser Arbeitsfläche lediglich ein Nutzer tätig ist und somit
die Annotation dezentral erfolgt. Denkbar ist aber auch
das Annotieren von Skizzen und Zeichnungen innerhalb eines gemeinsamen Arbeitsbereiches durch mehrere Nutzer
in Realzeit. Einige Lösungen beinhalten eine Kombination
zwischen synchroner und asynchroner Zusammenarbeit
bzw. erlauben wahlweise eine zeitgleiche bzw. zeitversetzte Zusammenarbeit auf einer gemeinsamen Arbeitsfläche.
Dabei ist zu bemerken, dass sowohl die synchrone, als
auch asynchrone Form der Kollaboration und Kooperation
jeweils Vor- und Nachteile bietet. Bei der zeitversetzten Zusammenarbeit ist vor allem die Flexibilität für die einzelnen
Gruppenmitglieder zu nennen. Nutzer können Informationen in Ruhe ordnen und ihre Interaktionen zeitlich selbst bestimmen. Der Nachteil der asynchronen Zusammenarbeit
ist demnach, dass eine oft notwendige zeitnahe Kollaboration und Kooperation unterlaufen wird. Bei der synchronen Zusammenarbeit dagegen wird eine direkte und natürliche Kommunikation unterstützt. Informationen erhalten
die Nutzer unmittelbar und können darauf schnellstmöglich
reagieren. Nachteil ist die geringere Flexibilität für alle Beteiligten. So müssen alle Gruppenmitglieder zu einem bestimmten Zeitpunkt verfügbar und motiviert sein (VIOLINO,
2007).
Während die zeitversetzte Zusammenarbeit meist durch
asynchrone Werkzeuge wie Emails oder der Sharing-Funktion sozialer Netzwerke erfolgt, wird eine zeitgleiche Zusammenarbeit innerhalb elektronischer Annotations- oder
Zeichenanwendungen oft per Chat ermöglicht. Diese Form
der Interaktion erlaubt eine ähnlich direkte Kommunikation
wie ein persönliches Gespräch oder eine Telefonkonferenz.
Synchrone Kommunikationsformen wie Audio- oder Videokonferenz sind weitere Möglichkeiten, die aber weniger
zum Einsatz kommen.
Welche Form der Zusammenarbeit bzw. welche Kollaborations- und Kooperationstools ein Annotationstool
unterstützen soll, liegt an der Zielsetzung und wird durch
diese maßgeblich bestimmt. Tabelle 4 zeigt zusammenfassend sowohl die hier erarbeiteten zentralen Kernfunktionen
von Annotationssoftware, als auch weitere denkbare und
sinnvolle Features die für die Entwicklung des Prototypen
interessant sind.
35
SketchCoLab
•••
Kernfunktionen
Erweiterte Features
Werkzeuge zur Annotation
• Freiform-Stift
• Geometrische Formen
• Pfeile
• Sprach- bzw. Tonaufnahmen
• Marker
• Bildintegration
- Material auf dem eigenen PC
- Durch interne Kamera des Gerätes
• Farbe (für Marker und Freiform-Stift)
• Verschiedene Pinsel
• Textboxen
• Emotionale Symbole (z. B. Smilies, Häkchen, Like-It-Symbol, etc.)
Workflow
• Löschen von Inhalten
• Arbeitsfläche leeren
• Arbeitsschritte wiederholen oder rückgängig machen
• Verwaltung durch Ebenen
• Zoomen innerhalb der Arbeitsfläche
• Historie zur Visualisierung der einzelnen Bearbeitungsschritte
• Verschieben einzelner Annotationselemente
• Raster zur Unterstützung der Orientierung
Archivieren und Speichern
• Export als Bild
• Spezielles Speicherformat (zur Unterstützung der späteren erneuten
Bearbeitung unter Beibehaltung der einzelnen Annotationselemente)
• Verschiedene Dateiformate für den Export
Tabelle 4: Mögliche Kernfunktionen / Features für das Überarbeiten (Annotation) von Zeichnungen
innerhalb des Prototyps
Eigene Darstellung
36
SketchCoLab
•••
Kernfunktionen
Erweiterte Features
Asynchron
• Möglichkeit des „Sharings“ durch Email
• Weitere „Sharing“-Funktionen (z. B. soziale Netzwerke, etc.)
• Sich aufeinander beziehende und / oder auf bestimmte Bereiche
beziehende Textinformationen
• Unterstützung der Awareness (welche Annotationen wurden von
welcher Person vorgenommen)
• Verschiedene Rollen und Berechtigungen für Nutzer
• Benachrichtigung bei Aktivitäten anderer
Synchron
• Chat
• Audio- und Videokonferenz
• Unterstützung der Workspace-Awareness durch Darstellung der
beteiligten Nutzer
• Sich aufeinanderbeziehende und / oder auf bestimmte Bereiche
beziehende Real-Zeit-Textinformationen
• Unterstützung der Workspace-Awareness durch Kennzeichnung der
Aktivitäten des jeweiligen Nutzers
• Verschiedene Rollen und Berechtigungen für Nutzer
• Benachrichtigung bei Aktivitäten anderer wenn Nutzer offline
• Kombination von gemeinsamer und eigener Arbeitsfläche
Tabelle 4 (Fortsetzung): Mögliche Kernfunktionen / Features für das Überarbeiten (Annotation) von
Zeichnungen innerhalb des Prototyps
Eigene Darstellung
37
SketchCoLab
•••
2.2.3. Praktische Ansätze zum gemeinsamen
Bewerten von Zeichnungen
Tagging
„Tagging“ ist die Annotation von
Inhalten durch frei definierbare
Textinformationen (Schlagworte).
„Tags“ erlauben die Identifikation und Kategorisierung der Inhalte nach bestimmten Kriterien.
Neben dem Überarbeiten eignet sich Annotation ebenfalls
zur Bewertung von Inhalten. Symbole, die emotionale Zustände zeigen wie (z. B. Smileys), sind eine einfache und
schnelle Möglichkeit Elemente zu evaluieren und diese Bewertung anderen Teilnehmern zu kommunizieren. Generell
stellen sowohl die Annotation in Form von Texteingabe
durch Tastatur, als auch mit „digitaler Tinte“ praktische Ansätze dar. Die Bewertung von Inhalten erfolgt primär nach
optischen und inhaltlichen Gesichtspunkten. Dabei stellt
eine Bewertung eine subjektive Form der Meinungsäußerung dar, die vor allem durch die Erfahrungen und Sichtweise des Bewertenden geprägt ist.
Wie eine Bewertung von Inhalten durch freies Schreiben bzw. Zeichnen stattfinden kann, zeigt sich aus den
Erkenntnissen des vorherigen Kapitels, in dem auf die Form
der Annotation durch „digitale Tinte“ bereits näher eingegangen wurde. Im Folgenden sollen das Annotieren mit
Hilfe von „Tags“ und weitere Möglichkeiten der Bewertung
dargestellt werden, die auch für den Prototyp relevant sind.
„Tagging“
„Tagging“ oder auch „Labeling“ beschreibt die konkrete
Annotation von Inhalten durch Textinformationen („Tags“)
mittels Tastatureingabe. Erweitert betrachtet versteht man
unter „Tags“ Schlagworte, die in der Regel keinen formalen Vorgaben unterworfen sind und dem Nutzer eine freie
Auszeichnung von Inhalten erlauben. Vom technischen
Blickwinkel aus gesehen, ist „Taggen“ das Erzeugen eines Datenbankeintrags, der die Relation zwischen dem
38
SketchCoLab
„getaggten“ Objekt, dem „Tag“ an sich und dem Urheber darstellt. „Tags“ können laut MÜLLER-PROVE verschiedenste Aufgaben erfüllen. Gängige Funktionen sind die
Identifikation des „getaggten“ Inhalts nach Themengebiet,
Art oder Urheber. Eine für diese Arbeit relevante Funktion ist darüber hinaus das Feststellen von Qualitäten und
Charakteristiken („Identifying Qualities or Characteristics“)
von Objekten und meint das Hinterlegen einer subjektiven
Meinung (Bewertung) meist durch Adjektive. Eine weitere
wichtige Aufgabe von Tags ist die Aufgabenorganisation
(„Task Organizing“). Damit beschreiben Anwender Aufgaben, die zu einem bestimmten „getaggten“ Objekt gehören. Ein Beispiel hierfür ist das „Taggen“ einer Zeichnung
bzw. eines bestimmten Details innerhalb einer Zeichnung
mit dem „Tag“ „Überarbeiten“ (FROHNER, 2010, S. 13
ff.; MÜLLER-PROVE, 2008, S. 16).
Die Verwendung von „Tags“ hat eine Reihe von Vorteilen. Neben ihrer einfachen und flexiblen Handhabung, sind
„Tags“ erweiterbar und können darüber hinaus aggregiert
werden. Durch ihre Flexibilität eignen sich „Tags“ für nahezu jede Situation, jeden Zweck und jede Form von Informationen. Außerdem erlauben „Tags“ gleichzeitig eine Kategorisierung sowie eine emotionale Ausdrucksform. Gefühle
und Meinungen, zentrale Bestandteile von Bewertungen,
können somit mitgeteilt werden. „Tags“ helfen Inhalte zu
organisieren und erleichtern die gezielte Suche nach Informationen. Ein weiterer wichtiger Vorteil ist die Möglichkeit
der Kollaboration und des „Teilens“. So können „Tags“ zu
bestimmten Inhalten zusammen erarbeitet und genutzt werden (SMITH, 2007, S. 23 ff.). Kollaboratives „Tagging“,
auch „Social Tagging“ genannt, bezeichnet somit den Vorgang der Annotation (durch Schlagworte) gemeinsam ge-
•••
nutzter Inhalte durch mehrere Nutzer (FROHNER, 2010,
S. 16). Es gibt eine Reihe von Anwendungsgebieten für
„Tagging“. Gängig sind Systeme, die persönliche Informationen wie Bilder und Emails organisieren oder Anwendungen, die das „Taggen“ von Websites mit anderen Nutzern
ermöglichen („Social Bookmarking“).
Spielbasierte Ansätze beim „Taggen“
Darüber hinaus gibt es aber auch Ansätze in spielerischer
Form. Hier trägt das „Tagging“ dazu bei, Daten zu einem
bestimmten Objekt zu sammeln, das Objekt zu beschreiben und somit die Qualität der „Verschlagwortung“ zu erhöhen. Die Daten werden bei dieser Form innerhalb eines
Spiels „getaggt“. Durch die Vielzahl an diesen kollaborativ entstandenen „Tags“ zeigt sich ein „gemeinsamer Konsens“ darüber, was z. B. ein Foto oder eine Zeichnung darstellt. Denkbar sind unterschiedlichste Spielprinzipien, die
den Nutzer motivieren sollen, Inhalte zu „taggen“ (SMITH,
2007, S. 11).
Diese spielbasierten Ansätze lassen sich aber nicht nur
dafür einsetzen möglichst viele Daten zu generieren, sondern sind ebenfalls als Bewertungstool innerhalb des Designprozesses denkbar.
„Rating“ durch Symbole
Neben der Auszeichnung und Bewertung von Bildern, Videos und sonstigen medialen Inhalten mit Hilfe von „Tags“,
stellt das „Rating“ durch bestimmte Zeichen und Symbole
eine weitere Bewertungsmöglichkeit dar. Mit Hilfe einer
frei definierbaren Skala werden beispielsweise Inhalte im
jeweiligen Kontext bewertet. Meist wird dafür eine Skala
von fünf Bewertungsstufen angesetzt, die durch Sterne sym-
bolisiert wird. Je „besser“ etwas bewertet wird, desto mehr
Sterne werden angezeigt. Diese Form des „Ratings“ hat
sich vor allem im Internet etabliert. Neben dem E-Commerce-Bereich, bei dem das „Rating“ vor allem dem Aufbau
von Vertrauen dient, gibt es ebenfalls eine Reihe von Ansätzen, bei denen gestalterische Inhalte wie Zeichnungen
oder Fotos auf diese Art bewertet werden. Eine weitere
noch reduziertere Form des „Ratings“ stellt z. B. der durch
Facebook bekannt gewordene „Like-Button“ dar, der mit
einer simplen Geste (Daumen hoch bzw. Daumen runter)
eine Bewertung von Inhalten ermöglicht.
Kommentare
Abschließend soll die Bewertung durch textbasierte Annotation in Form von Kommentaren erwähnt werden. Wie bereits bei den Ansätzen zur Überarbeitung von Zeichnungen
angedeutet, eignen sich Kommentare zur Unterstützung der
Kommunikation und können auch bewertende Aussagen
beinhalten.
Kommentare als Bewertungsinstrument sind oft in Verbindung mit einem „Rating“ durch Symbole verknüpft, die
die vereinfachte Bewertung mit zusätzlichen Informationen
erweitern und deren Zustandekommen erklären.
RELEVANTE PROJEKTE UND ANWENDUNGEN
Es werden nun einige Ansätze zur Bewertung von visuellen
Inhalten aufgezeigt, um relevante Aspekte für den Prototyp
herauszufiltern. Die vorgestellten Projekte sind nicht nur auf
die Bewertung von Bildern oder Zeichnungen ausgelegt,
sondern betreffen auch andere Ressourcen. Dabei wird
der Fokus auf Anwendungen gesetzt, die das „Tagging“
39
SketchCoLab
•••
oder „Rating“ als Bewertungsmöglichkeiten einsetzen. Die
Evaluation durch Annotation in Form „digitaler Tinte“ ist
mit den meisten bereits im vorherigen Kapitel vorgestellten
Anwendungen möglich.
ESP Game (Abbildung 20)
Einen interessanten Ansatz zur Auszeichnung und Bewertung von Bildern liefert LUIS VON AHN mit dem ESP
Game. Ziel war es, die Motivation und Freude von Nutzern am Spielen mit dem Produzieren nützlicher Ergebnisse zu kombinieren. Da Computer kaum in der Lage sind
die Bedeutung von Bildern zu erkennen und zu beschreiben, ist die einzig sinnvolle Möglichkeit, Inhalte manuell
durch Menschen zu „taggen“. Dies kann aber schnell sehr
aufwendig und teuer werden. Von Ahn wollte durch den
spielerischen Ansatz das Auszeichnen großer Bilddatenmengen erleichtern, ohne den Nutzern das Gefühl einer
langweiligen oder lästigen Pflicht zu geben.
Das ESP Game wird online mit zwei zufällig bestimmten Partnern gespielt, die nicht miteinander kommunizieren können, jedoch kollaborativ innerhalb einer zentralen
Spieloberfläche synchron oder asynchron zusammenarbeiten. Beide Spieler sehen das gleiche Bild und sollen dieses
mit einem Begriff beschreiben. Stimmen die Begriffe der
beiden Spieler überein, wird das nächste Bild angezeigt
und sie erhalten Punkte. Ziel der Spieler ist es in 2 ½ Minuten so viele Übereinstimmungen beim „Taggen“ der Bilder
zu erreichen wie möglich. Die Vorschläge des jeweils anderen Teilnehmers sind für die Spieler nicht sichtbar. Durch
die Integration von dynamisch generierten Tabu-Wörtern
wird ein spezifischeres Auszeichnen der Bilder ermöglicht.
Ist zu einem Bild bereits ein gemeinsamer Begriff gefunden
40
SketchCoLab
worden, wird dieser als Tabu-Wort hinterlegt. Erscheint das
entsprechende Bild im Laufe eines Spiels wieder, werden
die Tabu-Wörter den Spielern angezeigt und zwingen diese nach alternativen bzw. spezifischeren „Tags“ zu suchen.
Zu beachten ist, dass es nicht die Aufgabe der Spieler ist
ein Bild exakt zu beschreiben, sondern lediglich ein aussagekräftiges Label dafür zu finden. Da es eine Vielzahl
an Paaren gibt, die das Spiel parallel spielen, entsteht
ein großer Bestand aussagekräftiger Daten (VON AHN &
DABBISH, 2004).
Die Anwendungsbereiche für diesen Ansatz sind vielseitig, weshalb Google nach der Veröffentlichung ein ähnliches Tool, den „Google Image Labeler“, realisierte. Ziel
Abbildung 20: ESP Game » http://www.gwap.com/gwap/gamesPreview/espgame/
Quelle: http://many.corante.com/images/esp1.jpg » Abruf am 07.02.2012
•••
war es innerhalb kurzer Zeit den riesigen Bildbestand von
Google möglichst optimal zu „verschlagworten“ und damit
eine verbesserte Bildersuche zu ermöglichen.
Sketcharoo (Abbildung 21)
Ein ähnliches Konzept wie das ESP Game verfolgt die
Webplattform Sketcharoo. Dabei stehen jedoch nicht Fotos sondern Zeichnungen im Vordergrund. Bei der spielbasierten Anwendung zeichnen zwei zufällig ausgewählte
Spieler jeweils abwechselnd, vorgegebene Begriffe und
erraten den passenden Begriff. Der Gedanke hinter diesem
Konzept ist es, ein besseres Verständnis zu erlangen, wie
Personen Textbegriffe in Zeichnungen und wieder zurück in
Text übertragen. Sketcharoo kombiniert deshalb den spielerischen Ansatz mit einer Art Umfrage, bei der Teilnehmer die innerhalb des Spiels entstandenen Zeichnungen
Abbildung 21: Sketcharoo » http://www.sketcharoo.com/
Quelle: Screenshot http://www.sketcharoo.com/game/ » Erstellt am
07.02.2012
mit Begriffen bzw. „Tags“ versehen können (HEBECKER &
EBBERT, 2010).
Eine synchrone und zentrale Kollaboration bzw. Kooperation erfolgt somit beim Zeichnen und „Erraten“ der Begriffe, während innerhalb der Umfrage eine asynchrone
kollaborative und kooperative Zusammenarbeit stattfindet.
LabelMe (Abbildung 22)
Die webbasierte Anwendung LabelMe ist eine Kombination aus Annotations- und Taggingtool. Die Annotation erfolgt nicht auf die Bilder im Ganzen, sondern auf Details
innerhalb der Bilder. Die Nutzer können mit Hilfe von Annotationswerkzeugen (Polygontool und Radierer) bestimmte Objekte in einem zufällig gezeigten Bild (oder Video)
markieren und mit einem passenden Begriff „taggen“. Dem
Anwender werden bereits von anderen Nutzern annotierte
Abbildung 22: LabelMe » http://labelme.csail.mit.edu/
Quelle: Screenshot http://www.labelme.csail.mit.edu/tool.html?collection=La
belMe&mode=i&folder=static_houses_boston_2005&image=IMG_3636.jpg »
Erstellt am 07.02.2012
41
SketchCoLab
•••
und „getaggte“ Bereiche mit den jeweiligen Schlagworten
angezeigt. Es steht ihm frei, schon bearbeitete oder noch
offene Bereiche bzw. Objekte zu „taggen“. Ziel dieses Projektes ist es, möglichst optimale Algorithmen zur computergestützten Erkennung von Objekten durch einen umfassenden Datenbestand zu entwickeln („Sketch Recognition
Systems“) (RUSSELL, TORRALBA, MURPHY & FREEMAN,
2008).
Die Umsetzung als kollaboratives Webtool soll bei der
Erarbeitung einer möglichst großen Datenbasis helfen. Im
Gegensatz zum ESP Game werden die Nutzer zum Mitmachen allerdings nicht in Form eines Spiels motiviert. Kollaboration und Kooperation kann zeitgleich oder zeitversetzt
erfolgen, unterstützt jedoch nicht die „Awareness“ in Bezug auf andere Teilnehmer.
Buzzillions (Abbildung 23)
„Rating-Systeme“ werden, wie bereits erwähnt, vor allem
im E-Commerce-Bereich genutzt um Vertrauen zwischen
(potenziellen) Käufern und Verkäufern aufzubauen. Buzzillions ermöglicht die Kombination eines herkömmlichen „Ratings“ mit Sternen und „Tags“. Dabei können die Reviews,
also Berichte über einzelne Produkte, mit frei definierbaren
„Tags“ zu „Vorteilen“ „Nachteilen“ und „Geeignet für…“
vergeben werden. So können Nutzer Produkte schneller bewerten und der Einsatz von „Tags“ erlaubt darüber hinaus
die Erstellung flexibler Reviews (SMITH, 2007, S. 10 f.).
Neben der Website gibt es Buzzillions ebenfalls als
mobile App. Der Kollaborations- bzw. Kooperationsaspekt
wird durch das gemeinsame Bewerten von gleichen oder
unterschiedlichen Produkten erreicht, aus dem sich durch
die Menge der Bewertungen eine aussagekräftige Informa-
42
SketchCoLab
tionsbasis ergibt.
Rate My Drawings (Abbildung 24)
Die Website bietet neben dem „DrawChat“, einem MultiUser-Chatraum in dem Nutzer gemeinsam in Echtzeit ein
Bild oder eine Zeichnung erstellen können, die Bewertung
von Inhalten durch ein einfaches 5-stufiges „Rating-System“
in Verbindung mit einer Kommentarfunktion. Die Kommentare können durch vordefinierte emotionale Symbole bzw.
Aussagen erweitert werden und losgelöst von der Bewertungsskala erfolgen.
Bewertungssysteme, die mit einer Kombination aus Kommentaren und „Rating“ arbeiten, sind in vielfältiger Form
und für unterschiedliche Anwendungsgebiete vertreten.
Abbildung 23: Buzzillions » http://www.buzzillions.com/
Quelle: Screenshot http://www.buzzillions.com/reviews/asus-eee-pad-transformer-tf101-b1-10-1-led-tablet-computer-tegra-2-ghz-reviews#writeReview » Erstellt
am 07.02.2012
•••
Flickr (Abbildung 25)
Die Foto-Community Flickr ist eine der ersten Webanwendungen (auch als App verfügbar), die „Tags” einsetzte.
Primär dienen die „Tags“ zur Kategorisierung der Bilder
innerhalb des großen Datenbestands und unterstützen
somit die Nutzer bei der Suche nach relevanten Inhalten.
Bewertende „Tags“ die z. B. die Qualität eines Bildes auszeichnen sind ebenfalls möglich. Das gemeinsame Ziel,
einen möglichst großen Bestand an Bildern aufzubauen
und Bilder mit anderen zu „teilen“ wird durch kooperatives „Tagging“ unterstützt, da jeder Urheber eines Bildes
die „Verschlagwortung“ für seine Inhalte vornimmt. Ein
Bewertungsinstrument stellt die Möglichkeit dar, Kommentare zu den Bildern bzw. für bestimmte Details innerhalb
der Bilder abzugeben.
ERKENNTNISSE FÜR DEN PROTOTYP
Abbildung 24: Rate My Drawings » http://www.ratemydrawings.com/
Quelle: Screenshot http://www.ratemydrawings.com/drawings/manga/102935.html » Erstellt am 07.02.2012
Abbildung 25: Flickr » http://www.flickr.com/
Quelle: Screenshot http://www.flickr.com/photos/setik01/2505603657/ »
Erstellt am 07.02.2012
Wie bereits im vorherigen Kapitel lassen sich durch die
weiteren erarbeiteten Erkenntnisse, mögliche und für den
Prototyp relevante Ansätze zur Bewertung von Zeichnungen herausfiltern (siehe auch Tabelle 5).
Bewertungsansätze
Nutzer können „Tags“ als kollaboratives und kooperatives
Tool zur Evaluation von Zeichnungen und Skizzen einsetzen. Dabei ist nicht nur die Annotation der gesamten Inhalte, sondern auch von Details und Bereichen innerhalb der
Zeichnungen möglich.
„Tagging“ erlaubt die Bewertung sowohl nach gestalterischen Gesichtspunkten, als auch nach der semantischen
Bedeutung der Inhalte. „Tags“ sind daher eine schnelle und
flexible Möglichkeit den Gestaltungsprozess zu fördern
43
SketchCoLab
•••
und die Ergebnisqualität zu steigern.
Darüber hinaus stellen spielerische Lösungen eine Möglichkeit dar, den Vorgang des „Taggings“ für Anwender
spannender und motivierender zu gestalten. Dies ist vor
allem dann sinnvoll, wenn ein gemeinsamer Konsens zu
einer Zeichnung oder einem Bild getroffen werden muss.
Positiver Effekt ist die Qualität der „Tags“, die durch die
Erarbeitung einer Übereinstimmung erreicht wird. Die entstandenen Informationen führen wiederum zu einer verbesserten Möglichkeit, Zeichnungen im Zuge des Gestaltungprozesses iterativ und somit effektiv zu überarbeiten.
Die Bewertung durch Kommentare ist ebenfalls eine sinnvolle Option, beinhaltet jedoch die Problematik, dass die
eigentliche Aussage der Kommentare nicht kategorisierbar
ist. Während „Tags“ und „Ratings“ eine computergestützte Weiterverarbeitung und Auswertung ermöglichen, kann
die semantische Bedeutung innerhalb der Kommentare nur
von Menschen interpretiert werden. Da der Prototyp die
Auswertung der gewonnenen Ergebnisse erleichtern soll,
ist eine Kommentarfunktion – ähnlich wie die Bewertung
durch Annotation mit „digitaler Tinte“ – als alleiniges Bewertungsinstrument weniger geeignet. Kommentare können
jedoch als Kommunikationsmittel eingesetzt und zusammen
mit den anderen Ansätzen zur Bewertung kombiniert werden, um den Überarbeitungs- und Bewertungsprozess von
Zeichnungen zu unterstützen.
Eine weitere intuitive, jedoch weniger aussagekräftige
Form der Bewertung wird durch das „Rating“ erreicht.
Durch „Rating“ in Form von Symbolen wie Sternen oder
Gesten („Like-Button“) wird eine sehr allgemeine Aussage
zur Qualität eines Produktes, einer Zeichnung oder eines
Fotos getätigt. Diese Art der Bewertung ist demnach als
44
SketchCoLab
alleinige Möglichkeit für die Unterstützung des Gestaltungsprozesses kaum geeignet, da zu wenige Informationen aus
der Bewertung ersichtlich sind. Vielmehr ist eine Kombination von „Tagging“ und „Rating“ sowie Kommentaren
denkbar, um den Bewertungsprozess möglichst optimal zu
gestalten.
Die Möglichkeit gemeinsam innerhalb einer Gruppe Inhalte zu evaluieren, erfolgt meist in asynchroner Zusammenarbeit. Dies betrifft vor allem die Bewertung und Auszeichnung von Inhalten durch „Tags“ sowie durch „Rating“ und
Kommentare. Somit ist ein zeitversetztes kollaboratives,
d. h. die gleichen Inhalte werden von mehreren Personen
parallel „getaggt“ oder kommentiert bzw. auch kooperatives (mehrere Personen „taggen“ oder kommentieren unterschiedliche Inhalte) Teamwork denkbar.
Bei den vorgestellten spielbasierten Ansätzen, die „Tagging“ verwenden, erfolgt der kollaborative bzw. kooperative Ansatz oft durch eine zeitgleiche Zusammenarbeit
innerhalb eines gemeinsamen zentralen Arbeits- bzw.
Spielbereichs. Je nach Spielprinzip kann sich die Ansicht
auf den gemeinsamen „Workspace“ jedoch unterscheiden
sowie ein unterschiedlicher Grad der Aufgabenteilung und
Zusammenarbeit ergeben.
Werkzeuge zur Bewertung
Bei textbasierten Annotationsformen, wie dem „Tagging“
und Kommentaren, stellt – im Gegensatz zur Auszeichnung
durch „digitale Tinte“ – die Textbox das zentrale Werkzeug
dar. Unterstützt durch die Möglichkeiten der Tastatur sind
weitere Funktionen in der Regel nicht notwendig, können
•••
aber durch Textauszeichnungsoptionen erweitert werden.
Dies ist primär bei Kommentaren sinnvoll.
Das „Rating“ erfolgt ebenfalls lediglich durch eine einfache Nutzeraktion, indem entsprechende Symbole angeklickt werden.
von Interaktionselementen ermöglicht, die sich direkt bei
den Textelementen befinden.
Workflow
Da „Tagging“ und „Rating“ einfache und intuitive Interaktionsmöglichkeiten darstellen, sind wenige den Workflow
betreffende Features notwendig. Wichtigste Möglichkeit
stellt das Löschen und Editieren von bereits erstellten Texteingaben durch den Urheber dar. Dies wird meist in Form
Kernfunktionen
Erweiterte Features
Ansätze zur Bewertung
• „Tagging“
• Kommentare
• Annotation
• „Rating“
Werkzeuge zur Bewertung
• Textboxen
• Symbole wie Sterne
• Freiform-Stift
• Emotionale Symbole (z. B. Smilies, Häkchen, Like-It-Symbol, etc.)
• Vordefinierte „Tags“
Workflow
• Löschen von „Tags“
• Löschen von „Kommentaren“
• Editieren von „Tags“
• Editieren von „Kommentaren“
• Zuordnung von „Tags“ zu bestimmten Inhalten bzw. Details
• Zuordnung von „Kommentaren“ zu bestimmten Inhalten bzw. Details
• „Tags“ und Kommentare mit entsprechenden Nutzern verknüpfen
Tabelle 5: Mögliche Kernfunktionen / Features für das Bewerten von Zeichnungen innerhalb des Prototyps
Eigene Darstellung
45
SketchCoLab
•••
2.3. Tablet PCs und Tablet Computer
Stift oder Finger) als auch der Faktor Mobilität vermittelt.
Der Siegeszug der mobilen Endgeräte hält weiter an. Neben Smartphones verzeichnen nun Tablet PCs und Tablet
Computer, oft auch als Pads bezeichnet, hohe Verkaufszahlen. Die neuartigen und flachen Geräte erobern seit einiger Zeit damit sowohl den Markt, als auch immer breitere
Nutzergruppen.
Tablet PC
Zum Einstieg bieten RUTENBECK & RUTENBECK mit folgender Definition einen ersten Überblick, was Tablet PCs
charakterisiert:
2.3.1. Definitionen, Geschichte und Entwicklung
Einstieg
Im Hinblick auf die Aktualität und kontinuierliche Verbreitung dieser Form von mobilen Geräten sind einige Begriffe
in Verwendung, die im Vorfeld einer Erklärung bedürfen.
Eine klare Abgrenzung dieser Begriffe ist jedoch zum Teil
schwierig, da die Unterschiede innerhalb der verschiedenen Arten dieser mobilen Geräteklasse oft nicht eindeutig
sind und es darüber hinaus viele Überlappungen gibt, die
eine exakte Differenzierung erschweren. Im Folgenden
sollen zunächst die oft äquivalent und häufig genutzten
Schlagworte Tablet PCs und Tablet Computer differenziert,
sowie weitere relevante Begriffe zur Thematik erklärt werden.
Als erste Grundlage eignet sich die Betrachtung des gemeinsamen Begriffs „Tablet“. Aus dem Englischen übertragen bedeutet dieser so viel wie „Tafel“, „Schrifttafel“ oder
„Notizblock“ (PONS, 2012) und verdeutlicht somit bereits
die Vorteile und Eigenschaften dieser Geräteklasse. Ähnlich einer Tafel oder eines Notizblockes wird sowohl die
Bedienung mittels natürlicher Eingabemöglichkeiten (z. B.
„A tablet PC is a personal computer with a screen that
can be written on with a special pen and held like one
might hold a clipboard. The pen can be used to click or
select objects on the screen (including keys on a visual
keyboard), and most tablet PCs as include software applications that can record handwriting and convert handwriting to text. Tablet PCs bring with them most of the same
advantages and disadvantages found with traditional
laptop computers.“
(RUTENBECK & RUTENBECK, 2006, S. 241)
Der von Microsoft eingeführte Begriff des Tablet PCs beschreibt in erster Linie stiftbasierte Geräte ohne Tastatur,
deren wesentlicher Bestandteil ebenfalls die Handschriftund Gestenerkennung darstellt. Meist erfolgt die Eingabe
mit Hilfe von Digitizern, z. B. durch einen speziellen Stift,
dessen Spitze die Druckintensität und Position an den Tablet PC übermittelt.
Vom Umfang der Funktionen und Bauweise ähneln sie
den Note- und Netbooks und beinhalten somit die üblichen
PC-Komponenten wie Arbeitsspeicher, Festplatte oder Grafikkarte. Tablet PCs verfügen meist über ein angepasstes
Desktop-Betriebssystem (z. B. Linux, Windows) und sind
darüber hinaus für den mobilen Einsatz konzipiert. Eine
bekannte Form der Tablet PCs stellen die PDAs (Persönli-
Tablet PC
Von Microsoft eingeführter
Begriff, der stiftbasierte Geräte
beschreibt, die ohne eine
Tastatur auskommen und über
Handschrift-, sowie Gestenerkennung verfügen. Tablet PCs
verfügen über die üblichen PCKomponenten und ein angepasstes Desktop-Betriebssystem.
Tablet Computer
Neue durch das iPad forcierte Geräteklasse (meist in
Slate-Bauweise), die tragbare
über Touchscreen gesteuerte
Computer beschreibt, welche die
Technologie der Smartphones
aufgreifen und fortführen.
47
Tablet PCs und Tablet Computer
SketchCoLab
•••
cher Digitaler Assistent) dar, die jedoch meist nicht mit Digitizern, sondern mit berührungsempfindlichen Bildschirmen
zur Stifteingabe arbeiten und darüber hinaus auch weniger
leistungsfähig als allgemeine Tablet PCs sind. (BRAMBERG,
2011, S. 1 ff.; SCHULZE, 2010)
Abbildung 26: Beispiel eines
Tablet PCs in der Bauform
„Convertible“ (Dell Latitude)
Quelle: http://cdn.crn.de/fileadmin/images/Dell_Latitude%20
XT3_2.jpg » Abruf am 25.01.2012
Convertible
Tablet PCs in der Bauweise „convertible“ können aufgrund des
um 180 Grad drehbaren Bildschirms, sowohl als Notebook
mit Tastatur, als auch als Tablet
PC mit Stifteingabe verwendet
werden.
Tablet Computer
Tablet Computer stellen eine umfangreichere Kategorisierung dar und beschreiben allgemein mobile Computer,
deren Merkmale eine möglichst flache Bauweise, sowie
der Verzicht auf externe Eingabegeräte wie beispielsweise
Tastatur sind. Im Gegensatz zu Tablet PCs ist die Eingabeform generell nicht auf die Stifteingabe begrenzt, sondern
kann auch in anderer Form, z. B. per Touchscreen erfolgen. Technologisch gesehen wurden die Eigenschaften von
Smartphones, so auch entsprechende mobile Betriebssysteme auf diese Form der tragbaren Computer übertragen.
Eine der bekanntesten Eigenschaften von Tablet Computern ist die Erweiterung der Funktionalität durch „Applications“ sogenannte Apps (kleine Programme). Tablet
Computer werden oft auch als Pads, Surf- oder Webpads
bezeichnet und verfügen über eine geringere Leistungsfähigkeit als herkömmliche Desktopsysteme oder Notebooks.
Darüber hinaus werden sie primär für den Konsum von
digitalen Medien und Informationen eingesetzt, während
Tablet PCs sich auch für umfangreichere und kreative Aufgaben wie beispielsweise dem Zeichnen eignen. Den wohl
derzeit bekanntesten Vertreter solcher Tablet Computer
stellt das iPad dar (BRAMBERG, 2011, S. 10 f.; SCHULZE,
2010).
48
SketchCoLab
Merkmale von Tablet Computern und Tablet PCs
Durch die Begriffserklärungen wird deutlich, dass eine
klare Abgrenzung schwierig ist und sich darüber hinaus
viele Parallelen zeigen. Deshalb kommt es in der Praxis
zu einer Vermischung der beiden Begriffe, so dass diese
oft als identisch wahrgenommen und verwendet werden.
Generell lassen sich jedoch einige Eigenschaften die einen
Tablet PC oder Tablet Computer auszeichnen, feststellen.
In ihrem Buch BUILDING TABLET PC APPLICATIONS erörtern JARRETT & SU diese Eigenschaften, dabei sind die
Grenzen zwischen Tablet PC und Tablet Computer allerdings fließend zu betrachten.
Ein wichtiges Merkmal eines Tablet PCs und Tablet Computers ist demnach der Form-Faktor, der sich vor allem in
der Größe und Gestalt der Geräte widerspiegelt. Ziel ist
neben einem angenehm großen Display und einer möglichst flachen Bauart auch ein möglichst geringes Gewicht.
Die Herausforderung liegt darin, diese drei Parameter in
ihrer optimalsten Ausprägung miteinander zu kombinieren.
JARRETT & SU (2009, S. 4) beschreiben deshalb den idealen Tablet Computer bzw. Tablet PC als so dünn wie ein
Klemmbrett, so groß wie ein Blatt Papier, so leicht wie eine
Floppy Disk und so langlebig wie eine TV-Fernbedienung.
In Bezug auf den Form-Faktor sind mehrere Konzepte der
Gehäuseform zu unterscheiden.
Die ursprünglichste Form von Tablet PCs ist dabei die
Bauart „Convertible“ (englisch für umwandelbar), die sich
dadurch auszeichnet, dass es sich im Wesentlichen um
ein vollwertiges Notebook mit Tastatur und einem um 180
Grad drehbaren Bildschirm handelt (siehe Abbildung 26).
Umwandelbar bedeutet hier, Nutzer können das Gerät sowohl als Notebook mit Tastatur, als auch als Tablet PC mit
•••
Stifteingabe verwenden (SCHULZE, 2010).
Eine weitere gängige Bauart sind die sogenannten „Slates” (englisch für Schiefertafel), Geräte die aus nur einem
Block bestehen. Sie verzichten auf eine physische Tastatur und sind per Touchscreen und / oder Stifteingabe bedienbar (siehe Abbildung 27). Der Anschluss zusätzlicher
externer Geräte wie z. B. einer Tastatur ist aber generell
möglich. Die Slates begründen dabei maßgeblich die neue
Kategorie mobiler Geräte der Tablet Computer wie dem
iPad. (BRAMBERG, 2011, S. 3; SCHULZE, 2010)
Die „hybride” Bauform versucht die Vorzüge der beiden
Arten „Convertible“ und „Slate“ miteinander zu verbinden.
Die Tastatur kann ebenfalls hinter dem Bildschirm integriert
werden und ist zugleich jedoch komplett abnehmbar. Es
existieren allerdings nur wenige Modelle dieser Bauart.
(BRAMBERG, 2011, S. 4)
Als „UMPCs” (Ultra-Mobile PC) werden tragbare Computer bezeichnet, die kleiner als Subnotebooks oder Netbooks, jedoch etwas größer als PDAs sind. Sie setzen meist
auf den Einsatz eines vollwertigen Betriebssystems wie beispielsweise Windows 7 (siehe Abbildung 28). Es handelt
sich dabei um einen kompletten Personal Computer, der in
der Regel ausschließlich mittels Finger oder Stift gesteuert
wird. Es existieren aber darüber hinaus auch Modelle, die
die Eingabe per integrierter Tastatur oder spezieller Tasten
ermöglichen. Sie sind deshalb der Bauform der Slates zuzuordnen, jedoch in der Regel kleiner als herkömmliche
Tablet PCs bzw. Tablet Computer. (BRAMBERG, 2011, S.
4; SCHULZE, 2010)
JARRETT & SU beschreiben neben dem genannten Aspekt
der Form noch weitere Faktoren, die einen Tablet PC bzw.
Tablet Computer auszeichnen (siehe auch Abbildung 29).
So wird die Möglichkeit der Stifteingabe aufgrund
der Präzision, Zielgenauigkeit und Kontrolle als zentrale
Interaktionsart definiert, die jeder Tablet PC und Tablet
Computer zur Verfügung stellen sollte. Weitere Arten der
Steuerungen, z. B. mittels Finger, für alternative Anwendungsszenarien sind jedoch nicht ausgeschlossen und
werden von den meisten Geräten ebenfalls zur Verfügung
gestellt.
Tablet PCs und Tablet Computer sind darüber hinaus als
eigenständig funktionierende Geräte zu betrachten. Das
bedeutet, dass sie ohne den Anschluss an ein Host-Gerät
oder Netzwerk voll funktionsfähig sein müssen, wobei die
Integration innerhalb von Netzwerken als eine weitere
wichtige Eigenschaft anzusehen ist.
Die Unterstützung möglichst vieler Anwendungsbereiche ist ebenfalls ein zentraler Bestandteil. Dem Nutzer sollen alle Möglichkeiten, die auch ein Desktop-System bietet zur Verfügung stehen ohne Begrenzung auf spezielle
Einsatzbereiche (limitiert z. B. durch die Rechenleistung).
(JARRETT & SU, 2009, S. 5 f.) Dabei ist zu bemerken, dass
dies derzeit in der Praxis eher auf Tablet PCs und weniger
auf Tablet Computer zutrifft, die aufgrund ihrer meist (noch)
geringeren Leistungsfähigkeit und Ausstattung hinsichtlich
der Einsatzgebiete zum Teil eingeschränkt sind. Außerdem
zeigt sich, dass der große Erfolg der Tablet Computer im
Wesentlichen darauf basiert, dass diese Geräteklasse sowohl die Lücke zwischen Smartphones und Notebooks
schließt, als auch besonders für bestimmte Einsatzgebiete
(z. B. mobiles Surfen, Medieninhalte konsumieren) geeignet ist. Abschließend fasst die folgende Beschreibung die
bereits ausgeführten zentralen Eigenschaften eines Tablet
Computers bzw. Tablet PCs noch einmal zusammen:
Abbildung 27: Das iPad als
eines der bekanntesten „Slates“
Quelle: http://blog.guifx.
com/2010/01/27/touchscreensthat-changed-the-world/ » Abruf am
28.01.2012
Slates
Diese Bauweise beschreibt
Tablet PCs in sehr flacher Form,
die nur aus einem Block (ohne
Tastatur) bestehen und per Stift
oder Touchscreen bedient werden. Tablet Computer sind in der
Regel als „Slates“ konzipiert.
49
SketchCoLab
•••
Eigenständiges Gerät
Vielseitige
Anwendung
Merkmale
Stifteingabe
Form-Faktor
Abbildung 28: UMPC mit
Touchscreen und integrierten
Tastaturelementen
Großes Display
Geringes Gewicht
Flache Bauweise
Quelle: http://www.pressrelations.
de/presseservice_material/pressemitteilungen/pics/287356_
20077442215277778.jpg » Abruf
am 25.01.2012
Slate
Hybrid
UMPC
Convertible
Hybrid
Tablet PCs
Tablet Computer
Die hybride Bauweise vereinigt
die Vorteile der Formen „Convertible“ und „Slate“ mittels einer
zusätzlichen, abnehmbaren
Tastatur.
z. B.
PDAs
z. B.
Pads
UMPC
Ultra Mobile PCs sind kleine
Tablet PCs, die etwas größer als
PDAs, aber kleiner als Netbooks
sind und per Stift, Touchscreen
und / oder am Geräte vorhandenen Tastenelementen bedient
werden.
Touchscreen / Finger
Stiftbasierte Eingabe
Mobile Betriebssysteme wie
z. B. Android
Stiftbasierte Eingabe
Angepasste DesktopBetriebssysteme wie z. B.
Windows
Touchscreen / Finger
Hardware wie bei
Desktop-Rechnern z. B.
Festplatte, Grafikkarte
Abbildung 29: Unterschiede und Merkmale von Tablet PCs und Tablet Computern
Eigene Darstellung
50
SketchCoLab
•••
“A tablet computer is a thin stand-alone general-purpose
computer with an integrated interactive screen. It typically
has a large screen und accepts a special pen (a stylus) as
an input device.”
(JARRETT & SU, 2009, S. 4)
Abbildung 29 verdeutlicht noch einmal die Eigenschaften
und Differenzen von Tablet PCs und Tablet Computer.
Geschichte der Tablet PCs und Tablet Computer
Während der Siegeszug der Tablet Computer vor allem
durch die Einführung des iPads erst in den letzten zwei
Jahren begonnen hat, ist die Historie der mobilen und
„handlichen“ PCs entgegen des ersten Eindrucks keine
kurze Geschichte. Bereits vor über 40 Jahren (1968) entstand mit dem von Alan Kay entwickelten Dynabook (siehe
Abbildung 30) der heutige Vorläufer der Tablet PCs und
Tablet Computer und sogar sämtlicher mobiler Geräte. Vornehmlich geplant als digitales Malbrett für Kinder, sollte die
Eingabe mittels integrierter Tastatur, sowie per Stift möglich sein. Obwohl das Dynabook nie gebaut wurde, ist es
dennoch als Grundstein für die darauf folgenden weiteren
Entwicklungen anzusehen. (KEPPLER, 2010)
Erst Ende der 80er- und Anfang der 90er-Jahre entstanden mit der an Bedeutung gewinnenden stiftbasierten Interaktionsform neue innovative mobile Geräte, die versuchten
die Grundidee des Dynabooks fortzuführen. Als Grundlage
sollte die in den frühen 80er-Jahren als zukunftsträchtig angesehene Technologie der Handschrift-Erkennung dienen,
die von Nobelpreisträger DR. CHARLES ELBAUM 1991 in
Form eines ersten Handschrifterkennungssystems (Nestor-
Writer) weiterentwickelt wurde.
Zunächst allerdings wurde Anfang bis Mitte der 80erJahre der Fokus auf die Entwicklung tragbarer Computer,
den Notebooks gelegt. Man sah damals in den Notebooks
eine vielversprechende Möglichkeit, Mobilität mit Rechenpower und ausreichend Bildschirmplatz ideal zu kombinieren (MCLEAN, 2011).
1989 entstand dann als eines der ersten mobilen Geräte mit Touchscreen das von Jeff Hawkins konzipierte
GridPad (siehe Abbildung 31). Der spätere Gründer von
Palm, einem Hersteller von PDAs (Persönlichen Digitalen
Assistenten), setzte dabei auf die Eingabe mittels kleiner
Plastikstifte und trug somit maßgeblich zum Erfolg der PDAs
bei. Aber auch Microsoft sah zu dieser Zeit Potentiale im
Bereich der Tablet Computer und entwickelte ab 1992 die
zur Unterstützung der Stifteingabe gedachten Pen Extensions für Windows 3.1 (KEPPLER, 2010).Es wurden in den
90er-Jahren einige Geräte entwickelt, die darauf basierten, durchsetzen konnte sich das Konzept allerdings nicht.
Gründe für das Scheitern wurden sowohl in der schwierigen Handhabung, als auch in der fehlerhaften Handschriftenerkennung gesehen (BLICKENSTORFER, 2005).
Eines der Geräte war das von Toshiba entwickelte DynaPad T100X, das heute neben dem GridPad als einer der
ersten wirklichen Vorläufer der Tablet PCs gilt.
1993 stellte Apple mit Newton (siehe Abbildung 32),
einen als digitales Notizbuch ausgelegten Tablet PC vor,
der über eine lernfähige Handschrifterkennung verfügte
und ebenfalls stiftbasiert bedient werden konnte. Das Gerät floppte allerdings aufgrund des hohen Preises und fehlerhafter Funktionalität, führte jedoch erstmals den Begriff
der PDAs ein.
Abbildung 30: Dynabook
Quelle: http://bobjunior.com/wpcontent/uploads/2010/02/DynaBook.png » Abruf am 26.01.2012
Abbildung 31: GridPad
com/2010/01/27/touchscreensthat-changed-the-world/ » Abruf am:
28.01.2012
51
SketchCoLab
•••
Die Idee der stiftbasierten PDAs setzte sich erst ab 1996
mit der Einführung des Palm Pilots (siehe Abbildung 33)
endgültig durch, nachdem der 1992 vorgestellte Zoomer
weniger erfolgreich war, jedoch als Urvater aller PDAs gilt
(KEPPLER, 2010).
Die Bedeutung von PDAs sinkt heute jedoch mit der zunehmenden Verbreitung der Smartphones.
Nach der Vielzahl von Misserfolgen galt ab 1995 der
Bereich der stiftbasierten Computer und Tablet PCs zumindest für den Konsumentenmarkt als tot und viele Unternehmen sahen in dieser Technologie keine Zukunft mehr. Bill
Gates, Mitbegründer von Microsoft, hielt jedoch über die
Jahre an der Idee der stiftbasierten Computer fest und führte
Abbildung 32: Apple Newton
28.01.2012
den Begriff der Tablet PCs 2002 als Spezifikation ein und
sorgte damit nachhaltig für ein wiederbelebtes Interesse an
diesem Konzept. Die früheren Versuche, die Tastatureingabe mit einer komplett über Handschrift und Stimme funktionierenden Bedienung zu ersetzen, wurden aufgeweicht
und auch die mittlerweile fortgeschrittenen Technologien
(Multi- und Singletouch) begünstigen den weiteren Prozess
(BLICKENSTORFER, 2005).
Apple verschaffte schließlich mit der Einführung des
iPads 2010 dem Tablet PC bzw. der neuen Geräteklasse
Tablet Computer den endgültigen Durchbruch und konnte die entstandene Lücke zwischen Notebooks und PDAs
bzw. Smartphones erfolgreich schließen (DÖRNER, 2011).
1992
Windows für Microsoft Pen Computing
Toshiba Dynapad
Zoomer
1989
GRIDPad
1995
Microsoft Pen Computing 2.0
1968
Dynabook
1996
Palm Pilot
1993
Apple Newton
Abbildung 33: PalmPilot
com/2010/01/27/touchscreensthat-changed-the-world/ » Abruf am:
28.01.2012
1991
NestorWriter
Abbildung 34: Wichtige Meilensteine der Tablet PCs und Tablet Computer
Eigene Darstellung
52
SketchCoLab
2010
2010
iPad
2000
1990
1980
1970
1999
Microsoft Pocket PC
2002
Microsoft Tablet PC
•••
Abbildung 34 zeigt noch einmal einen Überblick wichtiger
Meilensteine der TabletPCs und Tablet Computer
Entwicklung und Prognose
Mittlerweile gibt es eine Vielzahl von Herstellern und die
ständig steigende Nachfrage sorgt weiter für beachtliches
Wachstum in diesem Bereich. Ein Vergleich der weltweit
verkauften Tablet Computer von Anfang 2010 bis Ende
2011 mit einer Steigerung der Absatzzahlen von über 470
Prozent zeigt dies deutlich (siehe Abbildung 35) (CREALYTICS, 2011).
Aber auch bezogen auf Deutschland etablierte sich der
Markt der Tablet Computer in den letzten Jahren und die
Verkaufszahlen werden laut aktueller Prognosen für das
Jahr 2012 und darüber hinaus sowohl deutschland- als
auch weltweit weiter steigen (BITKOM, 2011; GARTNER,
2010) (siehe Abbildung 36). In welcher Form sich der
Markt der digitalen Endgeräte durch die explodierenden
Absatzzahlen der Tablet Computer verändert, wird sich
zeigen.
Einige Prognosen gehen davon aus, dass eine Verschiebung und Substitution innerhalb der einzelnen Geräteklassen stattfinden wird. So werden z. B. laut einer Studie von Forrester Research für den amerikanischen Markt,
Netbooks von den Tablet Computern verdrängt werden
und bis 2015 sogar einen Anteil von 23 Prozent aller verkauften Computer ausmachen. Tablet Computer werden
demnach möglicherweise auch immer mehr die Rolle von
18
16
160
14
140
12
120
10
100
8
80
6
60
4
40
2
20
0
Mio.
0
Quartal 2 - 2010
Quartal 3 - 2010
Quartal 4 - 2010
Quartal 1 - 2011
Quartal 2 - 2011
Quartal 3 - 2011
3,5
4,4
9,7
7,2
14
16,7
Abbildung 35: Entwicklung der Verkaufszahlen von Tablet Computern (weltweit) von 2010 bis 2011
Eigene Darstellung nach Quelle: http://www.crealytics.de/blog/wpcontent/uploads/2011/11/Weltweit-Verkaufte-Tablet-PCs1.png » Abruf am
26.01.2012
Mio.
2010
2011
2012
2013
19,4 (0,8 in Deutschland)
154,1
Abbildung 36: Erwartete Entwicklung der Verkaufszahlen von Tablet Computern (weltweit) in den nächsten Jahren
Eigene Darstellung nach Quelle: http://www.bitkom.org/files/documents/Tablet_Computer_Absatz11_download.jpg und http://www.gartner.com/it/page.
jsp?id=1452614 » Abruf am 26.01.2012
53
SketchCoLab
•••
Desktop-PCs einnehmen und diese teilweise auch ersetzen
(SCHMIDT, 2010).
Taktiles Interface
Eingabegeräte wie Tastatur bzw.
Computermaus, um SoftwareInterfaces überhaupt „berühren“
zu können.
Touchscreen
Eine Form taktiler Interfaces, bei
der die Interaktion durch Erkennung eines oder mehrerer Berührungspunkte erfolgt, ausgelöst
durch Finger oder entsprechend
geeignete Geräte (z. B. Stift).
2.3.2. Berührungsempfindliche Bildschirme
Maßgeblich verantwortlich für den Siegeszug der Tablet
Computer ist neben der Mobilität, vor allem die Möglichkeit der direkten Eingabe und Steuerung durch Berührung
auf dem Monitor. Diese neuartige Form der Mensch-Computer-Interaktion erlaubt somit die Steuerung mit einem
(Singletouch), zwei (Dualtouch) oder mehreren Fingern
(Multitouch) und entspricht daher dem Anspruch einer möglichst direkten Manipulation bisher am meisten. Darüber
hinaus erlauben Bildschirme mit Multitouch-Technologie die
zeitgleiche Interaktion an verschiedenen Stellen auf dem
Bildschirm und bieten erweiterte Steuerungsmöglichkeiten
durch verschiedenste Gesten.
Touchscreens sind neben der Maus oder Tastatur der
Kategorie der taktilen Interfaces zuzuordnen, also Eingabegeräte mit denen die Steuerung von Software-Interfaces
überhaupt erst möglich wird (STAPELKAMP, 2010, S. 224).
Um sich zunächst der Unterschiede gegenüber den
Desktop-Systemen, die mit der Maus gesteuert werden, bewusst zu werden, sind mehrere Faktoren festzustellen (siehe
auch Tabelle 6). So gibt es bei der Steuerung über Single-,
Dual- und Multitouch-Screens keine Zeigesteuerung und
somit auch keine Hover-Effekte, es sei denn der Monitor
des betreffenden Geräts unterstützt eine Näherungsempfindlichkeit. Multitouch-Systeme erkennen darüber hinaus
mindestens zwei, in der Regel aber mehrere Berührungspunkte, während es bei der Steuerung mit der Maus nur
54
SketchCoLab
einen relevanten Interaktionspunkt gibt. Nachteilig bei der
Bedienung mittels berührungsempfindlicher Bildschirme ist
dagegen die geringere Präzision bei der Steuerung und
die Problematik, oft relevante Bildschirminhalte mit der
Hand während der Interaktion zu verdecken (DORAU,
2011, S. 56 f.).
Die Möglichkeit der stiftbasierten Bedienung, die nahezu alle Touchscreen-Geräte erlauben, relativiert diesen Nachteil aber zum großen Teil. Auch die haptische
Rückmeldung, die bei einer externen Tastatur oder Maus
gegeben ist, kann derzeit von den gängigen TouchscreenSystemen (noch) nicht abgebildet werden.
Darüber hinaus bietet jedoch diese neuartige Form der
Interaktion ein riesiges Potential und zeichnet sich durch
die vielfältigen Einsatzmöglichkeiten in verschiedensten
Anwendungsszenarien aus.
(Multi)Touch-Technologien
Technologisch gesehen, existieren mehrere Ansätze bei
Gestenpotential Touchscreen
Touch-Oberfläche
Zeigersteuerung
nein
2 Freiheitsgrade für Fingerbewegung
xy-Positionierung
2 Zustände pro Finger
• detektiert
• nicht detektiert
Tabelle 6: Gesten-Potential von Touchscreens
Darstellung nach DORAU (2011, S. 56)
•••
der Herstellung von Multitouch-Geräten, wobei die in Bezug auf Tablet Computer beiden gängigsten im Folgenden
kurz vorgestellt werden sollen.Der Großteil der derzeit verfügbaren Tablet Computer verfügt über ein Touchdisplay
mit kapazitiver Oberfläche. Diese Oberfläche besteht aus
einer Schicht, die elektrisch geladen ist und nach Berührung durch den oder die Finger ihre elektrische Ladung
verändert. Durch diese Veränderung der Ladung entsteht
die Positionsermittlung der aktuellen Interaktion und das
Gerät reagiert entsprechend (siehe auch Abbildung 37).
Vorteil der kapazitiven Bildschirme ist demnach, dass für
die Bedienung kein Druck notwendig ist und somit eine
äußerst stabile und kratzfeste Bauweise möglich ist. Dagegen ist die stiftbasierte Steuerung bei einer kapazitiven
Oberfläche grundsätzlich nicht möglich, es sei denn, es
handelt sich um einen elektrisch leitfähigen und speziell
den Anforderungen entsprechenden Stift.
Eine weitere Bauart berührungsempfindlicher Bildschirme stellt die resistive Oberfläche dar. Die Ermittlung der
gedrückten Position erfolgt durch die Veränderung des
elektrischen Widerstands auf der Oberfläche. Diese Oberfläche besteht aus zwei voneinander getrennten Schichten,
die sich zunächst nicht berühren. Erst durch leichten Druck
werden die beiden Schichten zusammengedrückt und lösen somit einen elektrischen Impuls aus, der für die Positionsermittlung sorgt (siehe auch Abbildung 38). Die resistive
Bauweise ermöglicht im Gegensatz zur kapazitiven Technologie die Bedienung mit jedem Gegenstand, also auch
einem normalen Stift. Dagegen sind resistive Bildschirme
anfälliger für Kratzer und dergleichen, da die Oberfläche
aus elastischem Material bestehen muss (DORAU, 2011,
S. 58 f.). Tabelle 7 zeigt zusammenfassend die jeweiligen
leitfähige
ITO Schichten
genaue Spannungsmenge an
allen Ecken des Touchscreens
X-Spannung
gleichmäßiges
elektrisches Feld
Resistiver Bildschirm
Die Position der Interaktion wird
durch die Veränderung des
elektrischen Widerstands auf
der Oberfläche ermittelt und
kommt durch Zusammendrücken
(elektrischer Impuls) zweier zunächst voneinander getrennter,
sich nicht berührender Schichten
zustande.
isolierte
Abstandhalter
Oberfläche
Abbildung 37: Funktionsweise kapazitiver Touchscreens
Eigene Darstellung nach Quelle: http://www.pocketpc.ch/faqworkshops/65128-resistiver-kapazitiver-touchscreen.html » Abruf am
28.01.2012
Glasscheibe
Die Oberfläche eines kapazitiven Touchscreens besteht aus einer elektrisch geladenen Schicht,
die bei Berührung durch den
Finger (oder speziellen Eingabestiften) die elektrische Ladung
verändert und somit die Position
der Interaktion aufnimmt.
Y-Spannung
flexible,
hartbeschichtete
Außenmembran
Kapazitiver Bildschirm
Abbildung 38: Funktionsweise resistiver Touchscreens
Eigene Darstellung nach Quelle: http://mehrspassdennje.com/wordpress/wpcontent/uploads/2009/08/resistiver_touchscreen.png » Abruf am 28.01.2012
55
SketchCoLab
•••
Vor- und Nachteile von kapazitiven und resistiven Touchscreens.
Abbildung 39: PLATO IV
28.01.2012
Über die Jahre folgten weitere Ansätze, wie beispielsweise ein 1984 von den Bell Laboratories entwickelter
Röhrenmonitor, der mittels Multitouch steuerbar war. 1985
stellte Bill Buxton, ein Pionier im Bereich der ComputerMensch-Interaktion, ein Touch-Tablet (siehe Abbildung 40)
vor, dass eine beliebige Anzahl von gleichzeitigen Berührungspunkten hinsichtlich Position und Druckintensität verarbeiten konnte.
Weitere wichtige Meilensteine waren zum einen das im
Jahr 1992 erschienene Mobiltelefon „Simon“ von IBM (siehe Abbildung 41), das als erstes Smartphone überhaupt
gilt und über einen Singletouch-Bildschirm verfügte. Zum
anderen die von der Firma Wacom entwickelten gleichna-
Meilensteine und Geschichte der Touchscreens
Die Entwicklung der berührungsempfindlichen Bildschirme
reicht bis in das Jahr 1965 zurück, in dem erstmals E. A.
Johnson eine Technik auf Basis kapazitiver Sensorik zur Entwicklung von Touchscreens beschreibt. Die gleiche Technik
also, die heute bei den meisten Tablet Computern zum Einsatz kommt. Der 1972 vorgestellte PLATO IV (siehe Abbildung 39) von IBM mit einer Infrarot-Berührungserkennung
gilt als erster Computer, der direkt über den Bildschirm gesteuert werden konnte.
Kapazitiver Touchscreen
Resistiver Touchscreen
Vorteile
• Besser geeignet für Multitouch
• Günstige Technologie
• Robuste Bauweise (z. B. kratzfestes Display)
• Barrierefreiheit: kann mit beliebigen Gegenstand bedient werden
(z. B. Armprothese)
• Lange Lebensdauer
• Präzise Interaktion durch dünne Stifte oder Fingernägel
• Gute optische Transparenz
Abbildung 40: Touch-Tablet
Bill Buxton
Quelle: http://billbuxton.com/
multitouchOverview.html » Abruf am
28.01.2012
• Sehr präzise Positionserkennung bei Interaktion
Nachteile
• Weniger präzise, da Eingabe generell mit den Fingern erfolgt
• Anfälliger für Kratzer, etc.
• Nicht barrierefrei
• Kürzere Lebensdauer
• Stifteingabe nur mit speziellen Stiften möglich (allerdings weniger
präzise, da dickere Spitzen)
• Positionserkennung bei Fingeraktion weniger präzise
• Handballen- bzw. Handschatten-Problem
Tabelle 7: Vor- und Nachteile kapazitiver und resistiver Touchscreens
Eigene Darstellung
56
SketchCoLab
•••
migen Grafiktabletts, die in der Lage waren, sowohl mehrere Geräte, als auch mehrere Berührungspunkte parallel
zu verarbeiten. Die Steuerung konnte dabei über einen
drucksensitiven Stift und gleichzeitig mit einem der Maus
ähnlichen Eingabegerät (Puck) erfolgen.
Die Touch- bzw. Multitouchtechnologie ermöglichte eine
Vielzahl weiterer interessanter Innovationen, wie beispielsweise die Entwicklung von Tangible Interfaces, Geräten die
die Identität, Position und Drehung verschiedener physikalischer Objekte erkennen und zur Steuerung nutzen können.
2007 gelang der Multitouch-Technologie mit dem Erscheinen des iPhones der Durchbruch. Neuartige Interaktionsformen wie das Pinching, also dem Vergrößern und
Verkleinern von Objekten mit einer Hand und die umfang-
reichen Nutzungsmöglichkeiten unterstützen den Erfolg.
Im gleichen Jahr erschien auch mit dem Microsoft Surface
(siehe Abbildung 42) ein multitouchfähiger Tisch, der sowohl mehrere Finger, Hände und Gesten erkennen kann,
als auch Objekte, die auf der Oberfläche des Tisches liegen. Erfolgreich fortgeführt wurden die Entwicklungen der
Multitouchtechnologie dann ebenfalls im Bereich der Tablet Computer und maßgeblich durch das iPad von Apple
geprägt (BUXTON, 2011; STAPELKAMP, 2010, S. 254).
Abbildung 43 zeigt einen Überblick über historische Meilensteine der Multitouch-Technologie.
Stifteingabe
Die Bedeutung der stiftbasierten Eingabe geht einher mit
Abbildung 41: IBM Simon
1972
PLATO IV von IBM:
erster per Bildschirm
steuerbarer Rechner
28.01.2012
1985
Bill Buxton: Entwicklung
eines Multitouch-Tablets
1965
E.A. Johnson: erstes Konzept
zum Thema Multitouch
1984
Per Multitouch bedienbarer
Röhrenmonitor, Bell Laboratories
2010
iPad
2010
2007
iPhone
2000
1990
1980
1970
1992
Wacom Grafiktabletts
2007
Microsoft Surface:
Multitouch-Tisch
Abbildung 42: Microsoft
Surface
28.01.2012
1992
Simon: erstes Smartphone von
IBM mit Singletouch-Bildschirm
Abbildung 43: Historische Meilensteine der Multitouch-Technologie
Eigene Darstellung
57
SketchCoLab
•••
der Technologie der Touchscreens. Während bereits die
ersten mobilen PDAs, z. B. der Apple Newton und der Palm
Pilot die Eingabe per Stift unterstützen, ist der Stift auch
aktuell ein oft genutztes Interaktionswerkzeug, maßgeblich
gefördert durch die anhaltende Verbreitung der Smartphones und Tablet Computer. Gründe hierfür sind der hohe
Grad an Präzision, die mit der Verwendung klassischer
Stifte einhergehende haptische Erfahrung, sowie eine im
Gegensatz zur Maus angenehmere Form der Bedienung.
Aber auch losgelöst vom Aspekt der mobilen Geräte, ist
die Stifteingabe eine wichtige Form der Mensch-MaschineInteraktion für verschiedenste Anwendungsbereiche. So
wurde mit dem Stifttablett ein vor allem für Grafiker optimiertes Eingabegerät geschaffen, welches die natürlichen
Merkmale von Zeichenwerkzeugen bei der Arbeit an einem PC überträgt (DORAU, 2011, S. 70 ff.).
Mögliche Einsatzgebiete sind dabei neben den klassischen gestalterischen Bereichen, wie Fotoretusche oder
Bildbearbeitung , auch Gebiete der Forschung, Lehre oder
Konstruktion.
2.3.3. Tablet Computer als kollaboratives und
kooperatives Gestaltungstool
Tablet Computer erfahren derzeit vor allem im Konsumentenbereich vermehrt Verbreitung und werden dort primär
zur Unterhaltung und Informationsbeschaffung genutzt.
Aber auch in Wirtschaft, Industrie, Verwaltung, sowie Bildung und Forschung ist der Tablet Computer und Tablet PC
längst angekommen. So findet er beispielsweise Verwendung in Krankenhäusern (elektronische Patientenakte), als
58
SketchCoLab
Lehr- und Lernmedium oder als unterstützendes Präsentationstool (BRAMBERG, 2011, S. 8).
Die Anwendungsmöglichkeiten sind vielseitig und der
Tablet Computer bzw. Tablet PC erfüllt somit eine bestimmte
Rolle in der Welt der digitalen Geräte. Dabei ist ein Ersatz
der herkömmlichen Desktop-Rechner allerdings nicht zu erwarten, vielmehr besetzen Tablet Computer eine Nische
bzw. überbrücken eine entstandene Lücke und vereinigen
wichtige Vorteile verschiedener Geräteklassen. Sie sind
aufgrund ihrer Bauart und Größe optimal für den mobilen
Einsatz geeignet, vielseitig in der Anwendung und unterstützen bzw. kombinieren die Stifteingabe mit der Touchscreentechnologie. Damit wird dem Nutzer eine intuitive,
natürliche und direkte Interaktionsform ermöglicht (JARRETT
& SU, 2009, S. 7 ff.).
Diese Vorteile machen die neuartige Geräteklasse demnach für viele Anwendungsgebiete zu einem interessanten
Werkzeug mit neuen und vielfältigen Möglichkeiten, so
auch für den Gestaltungsbereich, z.B. in Form des digitalen Zeichnens und Entwerfens.
Im Kontext des Prototypen
Zusammenfassend lässt sich eine Vielzahl von Argumenten
finden, warum sich das digitale Zeichnen auf einem Tablet
Computer sowohl für den allgemeinen Einsatz in Bezug auf
den Gestaltungsprozess, als auch konkret für die in diesem
Rahmen vorgestellte interaktive Anwendung SketchCoLab
zur Bewertung und Überarbeitung von Zeichnungen eignet.
Zunächst wird durch die stiftbasierte Eingabe die Übertragung der analogen und bereits bekannten Zeichenwerkzeuge in den digitalen Arbeitsraum ermöglicht und somit
•••
das gleiche haptische Gefühl sowie eine möglichst intuitive,
direkte und schnelle Form der Interaktion für den Anwender
erreicht. Auch wenn die Genauigkeit beim Zeichnen meist
nicht so hoch ist wie beim analogen Zeichnen oder den
Stifttabletts, eignen sich Tablet Computer vor allem für den
Bereich des prototypischen und schnellen Skizzierens.
Ein weiterer Punkt ist die Bauweise der Geräte, die sowohl bezüglich der weitestgehend freien Handhabung, als
auch in puncto Form (z. B. flach, ähnliches Format wie ein
Blatt Papier) einige positive Eigenschaften des Mediums
Papier aufgreift und überträgt.
Design
Skizzieren
Zeichnen
Evaluieren
Bewerten
Überarbeiten
Annotieren
Prototyp SketchCoLab
auf einem Tablet Computer
Prototyping
Implementierung
...
Die Technologien digitaler Geräte eröffnen zudem eine
Reihe zusätzlicher Möglichkeiten, wie die einfache Archivierung, Vervielfältigung und Suche der generierten Inhalte, die beim Zeichnen mit Stift und Papier nicht möglich
ist. Auch die Texteingabe kann wahlweise per Stift oder
Tastatur erfolgen und je nach Anforderung angepasst und
variiert werden. Das Internet ermöglicht darüber hinaus die
computergestützte Kollaboration und Kooperation, je nach
Bedarf in synchroner oder asynchroner, sowie räumlich unabhängiger Form und unterstützt somit das kreative Erarbeiten von nachhaltigen Gestaltungsansätzen.
Der Aspekt der Iteration, der Designprozesse häufig begleitet und sich gerade im frühen Stadium, also dem Skizzieren in schnellen Wiederholungen bestimmter Prozesskreisläufe (Erstellen – Verfeinern – Verwerfen) zeigt, wird
ebenfalls ermöglicht und gefördert (PLIMMER & APPERLEY,
2002).
Durch die Unterstützung kollaborativer und kooperativer Techniken innerhalb der Anwendung kann der Prototyp
bzw. Tablet Computer primär in den Phasen der Evaluation und Bewertung sowie beim Überarbeiten und Zeichnen
durch eine Gruppe, den iterativen Ablauf unterstützen. Abbildung 44 macht dies noch einmal deutlich.
Somit ist es möglich viele Nachteile analogen Skizzierens zu umgehen und Vorteile in den digitalen Kontext zu
übertragen. Die Möglichkeiten computergestützter Arbeit
können gewinnbringend während des Gestaltungsprozesses integriert und auf das mobile Gerät der Tablet Computer übertragen werden.
Abbildung 44: Iterativer Prozess im Kontext des Prototypen
Eigene Darstellung
59
SketchCoLab
•••
2.3.4. Das ASUS EeePad Transformer TF101
Abbildung 45: ASUS EeePad
Transformer TF101 mit andockbarer Tastatur („hybride“ Bauform)
Quelle: http://media.buzzers.co.za/photo/0/7111/
Asus+EeePad+Transformer.jpg »
Abruf am 25.01.2012
Für den in dieser Arbeit entwickelten interaktiven Prototypen diente das von der Firma ASUS hergestellte EeePad
Transformer TF101 als Testgerät (siehe Abbildung 45).
Es ist der Kategorie der Tablet Computer in hybrider
Bauart zu zuordnen. Als einer der wenigen auf dem Markt
befindlichen Geräte ist es mit einer andockbaren, auf das
Gerät abgestimmten Tastatur ausgestattet, in die zusätzliche Anschlüsse (z. B. USB-Port) und ein Touchpad integriert
sind. Die kompakte Integration der Tastatur ermöglicht es,
die herkömmliche Texteingabe mit der Touch-Bedienung
zu kombinieren. Sie eignet sich insbesondere für einige
im entwickelten Prototypen abgebildeten Features (z. B.
Kommentareingabe). Dies stellt jedoch kein Alleinstellungsmerkmal dar, da alle Tablet Computer mit einer externen
Tastatur (z. B. mittels Bluetooth) erweitert werden können.
Wie nahezu alle auf dem Markt befindlichen Geräte dieser Klasse verfügt das EeePad Transformer über einen berührungsempfindlichen Bildschirm mit kapazitiver Technik
(siehe Ausführungen zum Punkt Berührungsempfindliche
Bildschirme). Bei der Bedienung mit einem Stift wird nicht
Technische Daten
Betriebssystem
Android 3.2
Bildschirm
10,1 Zoll LED Backlight WXGA Display (1280 x 800 Pixel Auflösung), kratzfestes Glas
10 Finger Multitouch Unterstützung
Prozessor-Typ
NVIDIA® Tegra™ 2
Arbeitsspeicher
1 GB
Interner Speicher
16 GB/32 GB/Unbegrenzter ASUS Webstorage
Verbindungen
WLAN 802.11 b/g/n @ 2.4 GHz, Bluetooth V 2.1 + EDR
Kamera
1.2 Megapixel Kamera Vorderseite, 5 Megapixel Kamera Rückseite
Audio
Stereo Lautsprecher, SRS Premium Sound, High Quality Mikrofon
Eingaben & Ausgaben / Anschlüsse
1 x Mini HDMI
2 x Audio Jack (Kopfhörer/Mikrofon-In)
1 x Kartenlesegerät: Micro SD
Akku
9,5 Stunden; 24,4 Wh Li-Polymer Akku, 16 Stunden mit Dock
Maße
271 x 176,8 x 12,98 mm
Gewicht
680 g
Mobile Dockingstation
Keyboard, Touchpad
2 x USB 2.0
1 x Kartenlesegerät (MMC/SD/SDHC)
1 x 24,4 Wh Akku
™
Tabelle 8: Überblick der technischen Daten des ASUS EeePad Transformer TF101
Datenquelle: http://www.asus.de/Eee/Eee_Pad/Eee_Pad_Transformer_TF101/#specifications » Abruf am: 26.01.2012
60
SketchCoLab
•••
ganz die Präzision erreicht, die resistive Bildschirme erlauben. Das Zeichnen und händische Schreiben ist somit zwar
möglich, jedoch nicht in der Feinheit wie beispielsweise
mit einem Grafiktablett. Für das Zeichnen von Skizzen
oder handschriftlichen Notizen, die bei dem vorgestellten
Prototypen wichtige Funktionen darstellen, ist das EeePad
Transformer aufgrund der Bildschirmgröße von 10,1 Zoll
gut geeignet.
Als mobiles Betriebssystem kommt Android in der Version 3.2 zum Einsatz. Die Prototyp-Umsetzung als Webapplikation stellt jedoch eine plattformunabhängige browserbasierte Lösung dar, die auf allen gängigen Tablet Computer
und Tablet PCs funktioniert. Weitere technische Informationen im Überblick zeigt Tabelle 8.
61
SketchCoLab
03
PRAKTISCHE UMSETZUNG
•••
3 KONZEPTION UND PRAKTISCHE UMSETZUNG
Im praktischen Teil der Arbeit wird in den nachfolgenden
Kapiteln auf die Konzeption und Umsetzung des Prototyps
eingegangen.
In Kapitel 3.1 erfolgt zunächst die Vorstellung des Grobkonzepts in Form einer reduzierten Zielgruppenanalyse zur
Unterstützung der nutzerzentrierten Gestaltung und Ermittlung relevanter Funktionen des Prototyps (Kapitel 3.1.1).
Zudem wird in Kapitel 3.1.2 das grundlegende PrototypKonzept dargestellt, welches einen Überblick der erarbeiteten Funktionen zur Überarbeitung und Bewertung von
Zeichnungen, sowie zur kollaborativen und kooperativen
Zusammenarbeit aufzeigt.
In Kapitel 3.2 wird auf das entwickelte Feinkonzept
der Anwendung eingegangen. Dazu erfolgt zunächst die
Darstellung der zugrundeliegenden Informationsarchitektur
(Kapitel 3.2.1), welche die Struktur der möglichen Interaktionen und Informationseinheiten des Prototyps aufzeigt. Die
in Kapitel 3.2.2 vorgestellten Wireframes verdeutlichen
das Funktionslayout von SketchCoLab und stellen prototypisch die Interaktionen zwischen Anwendung und Nutzern
vor. In Kapitel 3.2.3 erfolgt anschließend die Betrachtung
relevanter Interaktionen auf der Grundlage touch- und stiftbasierter Interaktionsmechanismen.
In Kapitel 3.3 wird auf Form und Gestaltung von
SketchCoLab eingegangen. Neben typografischen Gesichtspunkten (Kapitel 3.3.1) wird das zum Einsatz kommende Farbkonzept (Kapitel 3.3.2) sowie die Gestaltung
der Icons und Symbole im Prototyp (Kapitel 3.3.3) aufgezeigt. Die in Kapitel 3.3.4 vorgestellten Mockups stellen
die Essenz der Konzeptionsphase dar.
Abschließend erfolgt in Kapitel 3.4 eine kurze Beschreibung zur technischen Umsetzung des Prototyps sowie ein
Überblick über die realisierten Funktionen.
65

SketchCoLab
•••
3.1. Grobkonzept
3.1.1. Zielgruppenanalyse und –ansprache
Zielgruppe
„If you don’t know who you’re talking to, how the heck do
you know what to say?”
(NICK USBORNE zitiert nach THISSEN, 2003, S. 32)
Eine Zielgruppe bestimmt maßgeblich durch ihre Bedürfnisse bzw. Absichten die Tiefe und Darstellung der Informationen sowie die Funktionen eines Produktes. Somit stellt sich
bereits während der Planungsphase die Frage, für wen
konkret wird das entsprechende Produkt umgesetzt und gestaltet. Wenn man die entsprechenden Besonderheiten und
Interessen einer Zielgruppe kennt, ist eine für beide Seiten
gewinnbringende Kommunikation bzw. das Erreichen gemeinsamer Ziele möglich. Das Erreichen dieser Ziele soll
bzw. kann während der Entwicklung durch Tests zur Evaluation der Benutzerfreundlichkeit (Usability-Tests) unterstützt
werden. Eine Zielgruppe zeichnet eine Reihe von bestimmten Merkmalen aus, wie Tabelle 9 zeigt. Je breiter eine
Zielgruppe dabei ist bzw. je mehr Zielgruppen man erreichen will, desto umfangreicher sind die zu beachtenden
Merkmale (STAPELKAMP, 2010, S. 333 f.).
Genau solch eine breite Zielgruppe soll durch das Konzept bzw. den Prototyp SketchCoLab erreicht werden. Die
konkrete Definition der Zielgruppe ist daher schwierig. Eine
Annäherung kann durch die Betrachtung der Nutzergrup-
66
SketchCoLab
3 Konzeption und praktische Umsetzung
pe von mobilen Geräten, insbesondere der Tablet Computer erfolgen, da der Prototyp primär auf diese Geräteklasse
ausgerichtet ist. Die Nutzer von Tablet Computern sind in
der Mehrheit in einem Alter von 30–59 Jahren, berufstätig mit mittleren und hohen Einkommen und verfügen über
einen hohen Bildungsstandard. Die Typologie der Tablet
Computer Nutzer besteht zusammenfassend aus „Entscheidern“ bzw. „Early Adoptern“ (frühzeitige Anwender) und
wird erweitert durch Frauen mittleren Alters (30–49 Jahren)
sowie jungen Männern (ab 20 Jahren) mit sehr großem
Interesse an neuen Technologien. Erweitert man die Betrachtung auf mobile Internetnutzer zeigt sich die erwähnte
Breite der Zielgruppe. Vertreten sind innerhalb dieser Nutzergruppe von Jugendlichen bis 19 Jahren, „Entscheidern“
(30–59 Jahre) und als Hauptzielgruppe („Heavy User“)
Männer zwischen 20 und 49 Jahren bis hin zu Senioren
(ab 50 Jahren) nahezu alle Altersklassen (IMUK Institut für
Medien und Konsumentenforschung, 2012; TOMORROW
FOCUS MEDIA, 2011).
Sowohl die Heterogenität der Zielgruppe der Nutzer
von mobilen Geräten, als auch der Anwendungszweck
des Prototyps in Form der Überarbeitung und Bewertung
von Zeichnungen erschwert eine engere Eingrenzung der
Zielgruppe. Möchte man dennoch die Zielgruppe weiter
konkretisieren, könnten im Kontext der Anwendung und in
Verbindung mit dem Profil von Tablet Computer Besitzern
vor allem „Entscheider“ und „Heavy User“, aber auch die
jüngeren Altersklassen relevant sein. Gestalter als „Entscheider“ z. B. in Bezug auf die Anwendung zur Unterstützung des Designprozesses, „Heavy User“ durch ihre Affinität zu neuen Technologien und jüngere Personen, für die
vor allem die Interaktion und Kommunikation mit anderen
•••
im Vordergrund steht, sind denkbare Nutzergruppen.
Neben der Festlegung der Zielgruppe ist es ebenfalls hilfreich, die mit dem Projekt angesprochene Benutzergruppe
zu definieren. Benutzergruppen unterteilen sich dabei in
drei verschiedene Kompetenzgrade: Anfänger, Fortgeschrittene und Experten. Diese Kompetenzgrade charakterisieren die Erfahrung, die ein Anwender mit einem Medium und dessen vermittelten Informationen hat. Im Hinblick
auf die Erfahrung mit interaktiven Produkten ist bei der im
Rahmen dieser Arbeit entstandenen Anwendung von der
Berücksichtigung fortgeschrittener Benutzergruppen und
Experten auszugehen.
Fortgeschrittene Nutzer zeichnen sich durch Erfahrungen mit interaktiven Systemen aus, beherrschen den Umgang mit diesen Systemen aber noch nicht vollständig. Sie
sind in der Lage vorhandene Kenntnisse mit neuen Erfahrungen zu verbinden und somit dazuzulernen.
Experten dagegen besitzen einen umfassenden Erfahrungsschatz im Umgang mit interaktiven Systemen und nutzen diese intuitiv zur Erreichung eindeutig definierter Ziele.
Experten stellen sich bei der Nutzung wenig Fragen, da
sie aufgrund ihrer Erfahrung nicht darauf angewiesen sind
jede Anwendungssituation zunächst zu analysieren (STAPELKAMP, 2010, S. 336 ff.).
Die beiden vorgestellten Benutzergruppen decken sich
dabei mit der Nutzergruppe mobiler Geräte, die den Umgang mit interaktiven Inhalten gewohnt sind. Relevante Fragen der beiden Benutzergruppen laut STAPELKAMP sind:
Der fortgeschrittene Nutzer stellt sich u. a. folgende Fragen bei der Nutzung interaktiver Systeme:
•
•
•
•
•
•
•
Worum geht es?
Was wird mir geboten?
Was kann ich erfahren?
Sind die Funktionsweisen neuartig?
Was kann ich Neues erfahren und erleben?
Wie kann ich weitere Erfahrungen sammeln?
Welche Ordnungsformen werden angeboten, vorgegeben oder sind selbst bestimmbar?
• Wie ist der Inhalt strukturiert?
Der Experte hat kaum Fragen zum Umgang mit dem interaktiven System, erwartet jedoch einiges:
• Kann das bereits fundierte Wissen erweitert werden?
• Welche Ordnungsformen werden angeboten?
• Gibt es erweiterte Suchfunktionen?
• Wie und womit wird es dem Anwender ermöglicht,
wichtige Aspekte schnell erkennen, klassifizieren
und einordnen zu können?
Insgesamt zeigt sich, dass aufgrund der Heterogenität und
Breite der Zielgruppe hinsichtlich sozio-demographischer
und persönlicher Merkmale eine exakt auf die Zielgruppe
ausgerichtete Konzeption und Gestaltung erschwert wird.
Daher ergibt sich die Erkenntnis, dass die Gestaltung des
interaktiven Prototyps in einem möglichst allgemein gültigen Kontext und für einen umfangreichen Anwenderkreis
erfolgen muss. Das Ziel ist demnach eine hochwertige und
funktionale Gestaltung, die weitestgehend keine Nutzergruppen ausschließt.
67
Grobkonzept
SketchCoLab
•••
Nutzungskontextanalyse
Wichtiger Bestandteil bei der Entwicklung, Umsetzung und
Evaluation eines Produktes bzw. Prototyps ist die Analyse
des Nutzungskontextes. Durch die Erkenntnisse „welche“
Nutzer „welche“ Ziele und Aufgaben in „welcher“ Umgebung verfolgen, lassen sich Gestaltungs- und Usabilityanforderungen für das jeweilige Produkt ableiten. Es wird dabei zwischen sozialen, organisatorischen, physischen und
technischen Umgebungen unterschieden, deren Definition
maßgeblich den Usabilitygrad bestimmt, den ein Produkt
bieten muss. Ebenfalls wichtig ist die Beschreibung des Produktes hinsichtlich Zweck, Funktionen und Anwendungsgebiet (WEBER, 2007, S. 332 ff.).
Auf eine umfangreiche Analyse des Nutzungskontextes
wird allerdings in dieser Arbeit aufgrund der nicht konkret
definierten und auch sehr breiten Zielgruppe, welche mit
dem interaktiven Prototyp erreicht werden soll, verzichtet.
Für eine exakte und anschauliche Darstellung der Ziel-
Zielgruppen-Merkmale
Sozio-demographische Merkmale
Persönlichkeitsmerkmale
• Geschlecht
• Progressives oder konservatives Weltbild
• Alter
• Emotional oder sachlich
• Familienstand
• Genügsam, ausdauernd oder ungeduldig
• Sozialer Status, Einkommen
• Risikobetont oder vorsichtig
• Bildungsniveau, Beruf
• Neugierig
• Freizeitverhalten
• Humoreigenschaften
• Kulturkreis
• Moralische Wertesysteme
Psychologische Merkmale
Gebrauchsspezifische Merkmale
• Vorlieben und Gewohnheiten
• In welchem Bereich wird das Produkt genutzt?
• Motivation
• Bevorzugte Wahrnehmungsform (visuell, akustisch)
• Bevorzugte Darstellungsart
• Bevorzugte Tiefe und Breite der Informationen
Tabelle 9: Merkmale einer Zielgruppe
Eigene Darstellung
68
SketchCoLab
Konzeption und praktische Umsetzung
•••
Eckdaten der Nutzungskontextanalyse
Eigenschaften der Benutzergruppe
Eigenschaften der Nutzungsumgebung
Allgemeine Daten
Technisches Umfeld
• Jugendliche bis ältere Erwachsene (19–59 Jahre)
• Keine Einschränkung in der Motorik
• Männlich und weiblich
• Keine Einschränkung in der Hand-Augenkoordination
• Hohes Bildungsniveau
• Normale Sehkraft
Vorerfahrung
Nutzungskontextanalyse
Analyse der Ziele, Aufgaben
und Nutzer, die ein Produkt nutzen (sollen) unter Einbezienung
der äußeren Umstände.
Physikalische Umgebung
• Fundierte bis gute Kenntnisse bei der Steuerung und Handhabung
von mobilen Geräten bzw. der Bedienung von Touchscreens
• Kein ungünstiger Lichteinfall auf die verwendete Geräteklasse
• Fortgeschrittener oder Experte bei der Nutzung interaktiver Systeme
• Nahezu unabhängig von der physikalischen Umgebung
• Nutzung „Indoor“ in verschiedensten Räumen (z. B. Arbeitszimmer,
Büro, Wohnzimmer) möglich - prinzipiell auch „Outdoor“ denkbar
• Geringe Geräuschkulisse zur besseren Konzentration
Mentale Eigenschaften
• Neutrale bis positive Einstellung zum Produkt
• Spaß und Interesse an Teamarbeit und der Erarbeitung gemeinsamer
Lösungen
• Kommunikations- und Ausdrucksfreudigkeit
• Interesse an neuen Technologien und Konzepten
Fähigkeiten
• Keine Einschränkung in der Motorik
• Keine Einschränkung in der Hand-Augenkoordination
• Normale Sehkraft
Tabelle 10: Eckdaten der Nutzungskontext-Analyse
Eigene Darstellung
69
Grobkonzept
SketchCoLab
•••
Scenario-Based-Design
Methode deren zentrales
Element, narrative Erzählungen über Nutzer und deren
Aktivitäten mit dem jeweiligen
Produkt bzw. der Anwendung
darstellen. Die entwickelten Szenarien unterstützen dabei den
Gestaltungs- und Entwicklungsprozess von nutzerfreundlichen
Produkten.
gruppe wird oft die Übertragung der Benutzereigenschaften aus der Nutzungskontextanalyse in sogenannte „Personas“ genutzt wird, die darüber hinaus einen wichtigen
Bestandteil von Szenarien ausmachen. Das von ALAN
COOPER entwickelte „Personas-Konzept“ stellt eine effektive Möglichkeit dar, Zielgruppen zu spezifizieren und somit den Gestaltungsprozess von Benutzerschnittstellen zu
unterstützen. Dabei werden exemplarisch Nutzer der Zielgruppe mit ihren Zielen, die sie innerhalb der jeweiligen
Anwendung erreichen möchten, dargestellt. Es handelt sich
demnach nicht um reelle Menschen, sondern um virtuelle
Abbilder, die es den an der Entwicklung beteiligten Personen erleichtern sollen, sich in die entsprechende Nutzergruppe hineinzuversetzen (THISSEN, 2003, S. 33 ff.).
Aufgrund der insgesamt sehr eingeschränkten Analyse
werden abschließend lediglich einige Eckdaten zum Nutzungskontext in Tabelle 10 dargestellt, die eine Grundlage für den Entwurf bzw. die Gestaltung von SketchCoLab
darstellen, jedoch auf Annahmen beruhen. Darüber hinaus
wird an dieser Stelle von einer Definition von „Personas“
bzw. Benutzerprofilen abgesehen, da geplant ist, den interaktiven Prototyp zu einem späteren Zeitpunkt in einem
realen Versuchsablauf zu testen.
Szenarien
Die gewonnenen Daten einer Nutzungskontextanalyse in
den konkreten Entwurfs- und Gestaltungsprozess zu übertragen ist oft problembehaftet und schwierig. Je nachdem
wie neuartig ein Produkt bzw. wie viel bereits an Wissen
und Vorgaben vorhanden ist, ist die Schwierigkeit der Übertragung der Informationen aus der Nutzungskontextanalyse höher bzw. geringer. Die entstehende Kluft kann durch
70
SketchCoLab
verschiedene Ansätze überwunden werden. Ein kreativer
Ansatz ist das von ROSSON und CAROLL entwickelte szenariobasierte Design („Scenario-Based-Design“) (WEBER,
2007, S. 336).
Im „Scenario-Based-Design“ (SBD) werden die aus der
Nutzungskontextanalayse gewonnenen Daten in kleine
Geschichten übertragen, die beschreiben wie Personen
das interaktive System innerhalb bestimmter Umgebungen
nutzen, um bestimmte Aufgaben zu erledigen. Szenarios
zeichnen sich durch ihre konkrete und zugleich flexible Art
aus, die es ermöglicht u. a. Ideen und Interaktionen vorab
zu prüfen und testen. „Scenario-Based- Design“ ist ein iterativer Prozess, der den beteiligten Personen (Entwickler
und Gestalter) darüber hinaus erlaubt, sich auf die Nutzerbedürfnisse zu fokussieren. Abbildung 46 zeigt die drei
Phasen des „Scenario-Based-Designs“.
Zunächst erfolgt in der Analysephase die Entwicklung
eines „Problem Scenarios“, dass aufzeigt, wie der Ablauf
und die Lösung einer Problemstellung ohne die Unterstützung des entsprechenden Produkts aussieht. In das Problemszenario fließt darüber hinaus die Analyse sämtlicher
beteiligter Personen („Stakeholder“) mit ein.
In den darauf folgenden Designphasen „Activity Scenarios“, „Information Scenarios“ und „Interaction Scenarios“
erfolgt dann die konkrete Weiterentwicklung des entwickelten Szenarios. Der Schritt „Activity Scenarios“ zeigt dabei
die Lösung der im Problemszenario dargestellten Aufgabe
mit Hilfe der entwickelten Anwendung und konzentriert
sich somit auf funktionale Aspekte. Im Anschluss erfolgt die
Ausarbeitung der Aktivitätsszenarien mit Hilfe der „Information Scenarios“, die festlegen, welche Informationen der
Nutzer benötigt und wie diese durch das interaktive System
•••
dargestellt werden müssen. Im dritten Schritt, den Interaktionsszenarien („Interaction Scenarios“) wird der Fokus auf
die Nutzeraktionen und das Feedback innerhalb der Aktionen gelegt.
In der letzten Phase des „Scenario-Based-Designs“ erfolgt dann die Evaluation und das „Prototyping“ (ROSSON
& CARROLL, 2002, S. 15 ff.).
Szenarien
ANALYSIS
Analysis of
stakeholders,
field studies
Problem Scenarios
Narrative kleine Geschichten,
die auf Basis der gewonnenen
Daten der Nutzungskontextanalyse erstellt werden und dabei
helfen sollen die Ergebnisse
möglichst optimal in das Produkt
einfließen zu lassen.
Claims about
current practice
DESIGN
Activity Scenarios
Metaphors, Information
Technology, HCI Theory,
Guidelines
Information Design Scenarios
Iterative Analysis of
usability claims &
redesign
Interaction Design Scenarios
PROTOTYPE & EVALUATION
Summative Evaluation
Usability Specifications
Formative Evaluation
Abbildung 46: Ablauf des Scenario Based Development Prozesses
Darstellung nach ROSSON & CAROLL (2002, S.25)
71
Grobkonzept
SketchCoLab
•••
Für das Konzept des interaktiven Prototyps werden nachfolgend zwei denkbare Szenarien aufgezeigt. Da auf die
Entwicklung von „Personas“ und eine umfangreiche Nutzungskontextanalyse in dieser Arbeit verzichtet wurde, stellen die beiden Szenarien lediglich eine Grundlage dar, um
exemplarisch Anwendungsmöglichkeiten von SketchCoLab
aufzuzeigen und repräsentieren daher nicht den vollständigen bzw. normalen Ablauf innerhalb eines „ScenarioBased-Developments“.
Anwendungszenario 1
Basierend auf der an der Hochschule der Medien entstandenen Forschungsarbeit zum Thema kollaboratives Entwerfen auf Multitouch-Geräten ist der Einsatz von SketchCoLab
als Ergänzung denkbar. Im Rahmen des Projekts betreut
von Prof. Ralph Tille und Monika Webers wurde in einer
Studie das gemeinsame Gestalten von Icons zu bestimmten
Begriffen mit Hilfe eines Multitouch-Tisches erforscht. Neben den kollaborativen und kooperativen Aspekten stand
ebenfalls die Untersuchung von Übereinstimmungen und
Differenzen in der Denk- und Arbeitsweise von Designern
und Nicht-Designern im Vordergrund. Der in dieser Arbeit
entstandene Prototyp eignet sich als weiterführendes Tool
um die in der Studie erarbeiteten Gestaltungsvorschläge
von Symbolen und Icons zu evaluieren und zu überarbeiten.
SketchCoLab vereinfacht die qualitative Auswertung der
Entwürfe, fördert den iterativen Designprozess und hilft somit bei der Erarbeitung hochwertiger Gestaltungslösungen
durch kollaborative und kooperative Zusammenarbeit. Als
Zielgruppe sind dabei Nicht-Designer zu sehen, die im
Zuge der Partizipation den Gestaltungsprozess entschei-
72
SketchCoLab
dend mit beeinflussen.
Anwendungszenario 2
Eine weitere Anwendungsmöglichkeit von SketchCoLab
stellt die Zielgruppe der Designer in den Fokus. Als in den
Workflow von Agenturen eingebettetes Instrument, könnte
der Prototyp bei der Erarbeitung möglichst optimaler Designlösungen helfen. Mehrere Designer könnten parallel
Entwürfe z. B. von einem Interface erstellen und diese über
SketchCoLab bewerten bzw. überarbeiten. Auch möglich
ist, dass unterschiedliche Bestandteile des Interfaces erstellt durch verschiedene am Projekt beteiligte Designer
von der gesamten Gruppe bewertet und überarbeitet werden. Abschließend würde sich im Idealfall eine Lösung herausbilden, die einen möglichst breiten Konsens und eine
hohe Qualität besitzt. Dabei ist es nicht notwendig, dass
dies gleichzeitig bzw. an einem Ort geschieht. Durch den
Einsatz mobiler Geräte wie einem Tablet Computer wird
dieser Aspekt verstärkt. Dabei eignet sich diese Form der
Groupware vor allem bei kleineren Gestaltungsaufgaben
als Bestandteil eines Gesamtauftrags, die ein extra Meeting
oder eine Konferenz überflüssig machen. Zwischenschritte
im iterativen Designprozess könnten somit unterstützt und
gefördert werden.
Ebenfalls denkbar ist der Einsatz von SketchCoLab als
Schnittstelle zwischen Designern und Auftraggebern. Beispielsweise könnten mehrere Entwürfe einer Website der
beauftragten Agentur durch den Kunden direkt überarbeitet und bewertet werden, um somit schnell und einfach die
Bedürfnisse des Auftraggebers zufriedenzustellen.
•••
3.1.2. Grundlegendes Prototypkonzept
Ausgehend von den in dieser Arbeit gewonnenen Erkenntnissen wird nachfolgend das für den interaktiven Prototyp
erarbeitete Konzept dargestellt. Die in Kapitel 2.2.1 und
Kapitel 2.2.2 bereits aufgezeigten möglichen Funktionen
und Features zur Überarbeitung und Bewertung von Zeichnungen sind dabei teilweise eingeflossen bzw. wurden erweitert oder modifiziert.
Das Konzept von SketchCoLab gliedert sich in vier Bereiche, die neben der geplanten Funktionalität, auch Aspekte
zur Kollaboration und Kooperation sowie die gewählten
Ansätze zur Bewertung und Überarbeitung aufzeigen. Abbildung 47 zeigt das Grobkonzept im Überblick, während
Abbildung 48 das Funktionslayout der Anwendung darstellt.
Überarbeiten
Ein zentraler Aspekt der Anwendung ist das Überarbeiten
von Zeichnungen. Es sind jedoch auch andere visuelle Darstellungen wie Bilder, Fotos oder Interfaces denkbar. Die
Überarbeitung erfolgt durch Möglichkeiten der Annotation.
Nutzer können eine Zeichnung annotieren und mit Hinweisen, Markierungen, Texten, Pfeilen durch das Stift- und TextWerkzeug versehen. Ebenfalls möglich ist die Erstellung
einer neuen Zeichnung in Bezug auf das Basisbild.
Um die Übersicht während der Zusammenarbeit zu
wahren, ist die gleichzeitige Annotation von mehreren Nutzern zwar möglich, erfolgt jedoch nicht innerhalb einer gemeinsamen Arbeitsfläche bzw. an einer für alle gleichzeitig
sichtbaren Zeichnung. Die Überarbeitungen anderer Nutzer können wahlweise eingeblendet, sowie überarbeitet
und als Basis neuer Annotationsversionen genutzt werden.
So entsteht eine Vielzahl neuer Gestaltungsansätze, die
durch die kollaborative und kooperative Zusammenarbeit
unterstützt werden.
Bewerten
Ein weiterer wichtiger Punkt ist die Bewertung von Zeichnungen. Durch die Überarbeitung in Form von Annotation
wird bereits eine Möglichkeit der Bewertung berücksichtigt. Nutzer können durch „handschriftliche“ Worte oder
Symbole (z. B. Smiley) ihre Meinung und Wertung ausdrücken. Als zusätzliche Bewertungsmöglichkeit sollten im ursprünglichen Konzept „Tags“ dienen. Diese hätten jeweils
für positive oder negative Aspekte der Zeichnung vergeben werden können und erlauben somit eine „bewertende Verschlagwortung“. Im Laufe der Konzeption hat sich
jedoch herausgestellt, dass die Einbindung von „Tags“ die
Übersichtlichkeit der Anwendung verringert und gerade für
nicht geübte Nutzer eine weitere kognitive Belastung darstellt. Damit wäre dem Anspruch einer möglichst einfachen
und transparenten Bedienung entgegengewirkt worden.
Darüber hinaus würde der zeitliche Aufwand zur Bewertung von Zeichnungen vergrößert werden, was gerade bei
einer hohen Anzahl zu bewertender Elemente ein störender Faktor ist.
Weitere Formen der Bewertung sind durch Kommentare
und Textboxen möglich. Textboxen können innerhalb von
SketchCoLab auf der Zeichnung platziert werden und dienen sowohl als Annotationshinweise, als auch als Bewertungsinstrument. Durch die Möglichkeit der freien Platzierung können sich die Informationen auf konkrete Details
innerhalb der Zeichnung beziehen, was die Transparenz
73
Grobkonzept
SketchCoLab
•••
Datenbasis = bestehende Zeichnungen von Icons, etc.
Datenbasis = bestehende Zeichnungen von Icons, etc.
Auf Details der Zeichnung
Auf die gesamte Zeichnung
Kollaboration
und Kooperation
Überarbeiten
• Freiform-Stift
• Radiergummi
• Textwerkzeug
Sharing
• Server
• Speichern
Bewerten
Kommunikation
• Kommentare
• Chat
• Rating
• BewertungsKommentar
Arbeitsbereich
• Individuell
Awareness
• User-Awareness: durch Namen, durch Ansicht der verschiedenen Versionen der einzelnen Nutzer
• Workspace-Awareness: wer hat welche Aktivitäten gemacht z. B. wer hat welche Kommentare bzw. Bewertungen abgegeben
Workflow
• Rückgängig / Wiederholen
• Speichern
• Arbeitsﬂäche löschen
Technologien
HTML5 / CSS / JavaScript
PHP / MySQL
Abbildung 47: Grobkonzept SketchCoLab
Eigene Darstellung
74
SketchCoLab
Interaktion
(Multi)Touch (Finger, Stift), Maus,
Texteingabe (Hardwaretastatur)
•••
für andere Nutzer verbessert und die Veranschaulichung
von Gedankengängen unterstützt. Technisch gesehen werden die Textinformationen in der Datenbank gespeichert
und beim Aufruf der jeweiligen Annotationsversion wieder
geladen und entsprechend positioniert. Die Textelemente
sind daher nicht fest auf der Zeichnung verankert und können auch nachträglich verschoben oder gelöscht werden.
Allerdings sind somit die Textinformationen auch nicht auf
der im Bildformat abgespeicherten Zeichnung sichtbar,
sondern nur innerhalb der Anwendung. Diesen Text innerhalb der abgespeicherten Bilder ebenfalls sichtbar zu machen wäre eine weitere Funktion der Anwendung. Zusätzlich bzw. alternativ könnte ein extra Auswertungstool diese
Problematik berücksichtigen und wäre darüber hinaus eine
sinnvolle Ergänzung, um eine einfache Analyse der generierten Daten zur Verfügung zu stellen.
SketchCoLab
Datenbasis
Gesamte Zeichnung
Annotation
Workflow
Skalieren der
Arbeitsfläche (durch
Browser möglich)
Bewertung
„Rating“ durch Sternchen
Chat
Individuelle Arbeitsfläche
Farbe
Bewertungskommentare
Kommentare
Größe der Spitze
Textboxen
Freiform-Stift
Radiergummi
Größe der Spitze
Arbeitsschritte rückgängig
machen bzw. wiederholen
Kollaboration &
Kooperation
Kommunikation
Textbox
Sharing
Freiform-Stift
Speichern
Permanent aktualisierte
Datenvorhaltung auf dem
Web-Server
Leinwand leeren
Speichern
Abbildung 48: Funktionslayout SketchCoLab
Eigene Darstellung
75
Grobkonzept
SketchCoLab
•••
Zentrales Bewertungstool stellt im Prototyp das „Rating“
in Form von Sternen dar. Gründe für diese Form der Bewertung liegen in der einfachen und schnellen Handhabung
und dem hohen Bekanntheitsgrad. Gerade wenn eine Vielzahl an Entwürfen vorhanden ist, ist ein möglichst kurzer
Workflow hilfreich. Dabei zeigt die Anzahl der vergebenen
Sterne die Höhe der Bewertung an. Die eingesetzte Skala
wird dabei in fünf Stufen eingeteilt (1 = sehr schlecht, 2 =
schlecht, 3 = mittel, 4 = gut, 5 = sehr gut) und entspricht somit den gängigen Rating-Systemen wie z. B. bei Amazon.
Die Nutzer können dabei in ganzen Schritten bewerten.
Halbe Schritte wie z. B. eine Durchschnittsbewertung von
„3,5“ werden in der Anzeige der Bewertungsskala berücksichtigt.
In Kombination mit der Bewertung in Form von Sternsymbolen stellt SketchCoLab darüber hinaus die Möglichkeit zur Verfügung, durch Kommentare weiterführende Informationen zur getätigten Bewertung hinzuzufügen. Das
macht es für die beteiligten Nutzer leichter, die Bewertungen anderer nachzuvollziehen und bietet somit neben der
reinen Bewertungszahl weitere semantische Informationen,
die zur Kommunikation, Auswertung oder Überarbeitung
genutzt werden können.
Ein weiterer Ansatz während der Konzeptionsphase war
die Überlegung, den Nutzern von SketchCoLab ebenfalls
die Möglichkeit der Bewertung und Kommentierung der
erstellten Annotationsversionen (anderer Nutzer) zur Verfügung zu stellen. Dadurch könnte der iterative Designprozess weiter verdichtet und die Erarbeitung einer möglichst
optimalen Gestaltungslösung zusätzlich gefördert werden.
Dagegen spricht der möglicherweise ausufernde Arbeitsaufwand durch evtl. ständig neu generierte Überarbeitun-
76
SketchCoLab
gen, die ebenfalls die Übersichtlichkeit stark einschränken
könnten. Daher wurde dieser Ansatz nicht in die Endversion des Prototyps implementiert.
Die Zusammenarbeit im Team soll durch mehrere Komponenten innerhalb der Anwendung unterstützt werden:
Datenbasis
Die Nutzer haben innerhalb von SketchCoLab Zugang
zu bestimmten Projekten, die verschiedene Zeichnungen
enthalten. Die Nutzer- bzw. Teamverwaltung steht dabei
jedoch weniger im Blickpunkt der Anwendung, genauso
wie die Projektverwaltung. Als Datenbasis wird durch die
Anwendung eine Reihe von (austauschbaren) Zeichnungen zur Verfügung gestellt, die bewertet und überarbeitet
werden können.
Kommunikation
Die Kommunikation unter den Anwendern soll primär durch
das Chat-Werkzeug, aber auch durch die Bewertungskommentare ermöglicht werden. Audio- oder Videokonferenz wären zwar denkbare Alternativen, würden jedoch
schnell unübersichtlich werden, wenn eine größere Anzahl
von Nutzern beteiligt ist. Aufgrund des geringeren Implementierungsaufwands und der dennoch sehr direkten und
schnellen Möglichkeit zu kommunizieren, stellt das ChatWerkzeug das zentrale Kommunikationstool innerhalb der
Anwendung dar. Eine Hardwaretastatur, wie sie das Testgerät zur Verfügung stellt, soll die Kommunikation durch
Texteingabe unterstützen bzw. erleichtern.
Eine weitere Möglichkeit der Kommunikation im Basis-
•••
konzept sah vor, die Bewertungen anderer Nutzer ebenfalls
kommentieren zu können und somit in Form eines reduzierten Forums einen Informationsaustausch zu fördern. Diese
Funktion wurde technisch zu großen Teilen bereits umgesetzt. Es zeigte sich jedoch, dass die Übersichtlichkeit der
Anwendung dadurch stark eingeschränkt wurde, da der
zur Verfügung stehende Platz begrenzt ist. Eine zunächst
erarbeitete Lösung bestand darin, die Kommentare bzw.
das Forum in ein extra Popup-Fenster auszulagern, was jedoch den direkten Bezug zu den Bewertungen erschwert
und ggf. auch den Workflow hemmt. Daher wurde diese
Form der Kommunikation in der Endversion des Prototyps
nicht mehr berücksichtigt, stellt jedoch in einer erweiterten
Version im Rahmen einer zufriedenstellenden Lösung ein
weiteres mögliches Feature dar.
Sharing
Das asynchrone „Teilen“ der überarbeiteten bzw. bewerteten Bilder wird durch die direkte Speicherung auf dem
Server ermöglicht. Dort können die jeweiligen Projekte
durch die Gruppenteilnehmer bei Bedarf wieder abgerufen
werden. Durch das Feature von SketchCoLab, die relevanten Daten innerhalb der Anwendung in kurzen Intervallen
zu aktualisieren, wird ein nahezu synchrones „Teilen” der
Datenbasis ermöglicht. Von Nutzern erstellte Annotationen
und Bewertungen werden somit nach Speicherung für andere ebenfalls gerade aktive Nutzer innerhalb der Anwendung sichtbar und können eingesehen bzw. überarbeitet
werden.
Ein zusätzliches Feature, um den Austausch zu fördern,
könnte durch die Möglichkeit ergänzt werden, überarbeitete und bewertete Zeichnungen jeweils als Bild zu spei-
chern und diese beispielsweise per Email mit anderen zu
„teilen“. Dabei enthalten die exportierten Bilder sämtliche
Informationen zu den getätigten Annotationen.
Arbeitsbereich
Innerhalb von SketchCoLab arbeiten die einzelnen Nutzer
jeweils in einem eigenen Arbeitsbereich und nicht wie
bei einer echten zeitgleichen Kollaboration auf einer gemeinsamen Zeichenfläche. Erste Überlegungen zum Anwendungskonzept hatten das Ziel, ein Tool zur EchtzeitKollaboration zu realisieren, wurden jedoch unter anderem
aufgrund der Komplexität verworfen. Darüber hinaus birgt
die synchrone Zusammenarbeit innerhalb einer gemeinsamen Arbeitsfläche die Gefahr zu unübersichtlich bzw.
ineffektiv zu werden, da ein erhöhter Kommunikations- und
Organisationsaufwand anfällt, der möglichst optimal unterstützt werden muss.
„Awareness“
Für den Bereich der „Awareness“ sind vornehmlich Funktionen zur „User-Awareness“ und „Workspace-Awareness“
eingeflossen. SketchCoLab zeigt dabei Informationen über
Nutzeraktivitäten, wie z. B. welcher User wann welche
Bewertung und Annotation vorgenommen hat. Die „UserAwareness“ wird zusätzlich bei der Verwendung des ChatTools unterstützt. Dabei dienen die Informationen vor allem
dazu, die Kommunikation transparent zu gestalten und den
Workflow zu vereinfachen bzw. zu unterstützen. Am Projekt beteiligte Nutzer können mit Hilfe der „Awareness“
konkret auf bestimmte Aktivitäten anderer Teilnehmer reagieren bzw. darauf Bezug nehmen.
77
Grobkonzept
SketchCoLab
•••
Versionsmanagement
Ein weiteres ursprünglich geplantes Feature ist die „Timeline“, mit der es den Nutzern ermöglicht werden sollte, die
Historie einer Überarbeitung bzw. Bewertung noch einmal
nachvollziehen zu können. SketchCoLab sollte dazu einen
Versionsvergleich anbieten, mit dem verschiedene gespeicherte Versionen einer überarbeiteten und bewerteten
Zeichnung miteinander verglichen werden können.
Workflow
Neben den bisher vorgestellten Funktionen sind einige weitere für den Arbeitsablauf wichtige Features im Prototyp
implementiert. In die Endversion von SketchCoLab sind das
„Rückgängigmachen“ und „Wiederholen“ von Arbeitsschritten, die Möglichkeit die Leinwand per Klick bzw.
„Tap“ zu leeren, sowie die Speichern-Funktionalität eingeflossen.Weitere geplante Features zur Verbesserung des
Workflows, wie das nachträgliche Bewegen von gezeichneten Elementen oder eine Zoom-Funktion wurden in Abwägung von Nutzen und Realisationsdauer nicht berücksichtigt.
Weitere Anmerkungen zur Kollaboration und Kooperation
Die Ansätze der Kollaboration und Kooperation wurden
innerhalb des Konzepts bisher wenig differenziert. Da
sich die beiden Begriffe, wie bereits im theoretischen Teil
der Arbeit aufgezeigt, zwar auf verschiedene Formen der
Zusammenarbeit beziehen, jedoch auch Schnittpunkte besitzen, ist eine genaue Abgrenzung in der Praxis häufig
schwierig.
Im Prototyp sind beide Varianten der Zusammenarbeit
denkbar bzw. vermischen sich. Somit bietet SketchCoLab
78
SketchCoLab
eine gewisse Flexiblität, welche die Zusammenarbeit je
nach Anforderung der beteiligten Nutzer oder des Projekts
unterstützt.
Primärer Aspekt bei einer Kollaboration ist die Bearbeitung einer oder mehrerer gemeinsamer Aufgaben mit
direktem Fokus auf das Erreichen einer gemeinsamen Mission. Dabei wird die Zusammenarbeit maßgeblich durch
das wechselseitige Einbringen der Teilnehmer beeinflusst.
Diesen Faktoren wird innerhalb des entwickelten Prototyps
zum Teil Rechnung getragen. Eine gemeinsame Aufgabe
könnte es beispielsweise sein, aus einem Set bestehender
Symbole bzw. Icons für einen bestimmten Begriff die geeignetste Variante als ein gemeinsames Ziel herauszufiltern
bzw. zu erarbeiten. Durch die Möglichkeit mittels Chat
miteinander zu kommunizieren bzw. durch die Einsicht erstellter Annotationen anderer Nutzer, kann demnach eine
wechselseitige Inspiration und Beeinflussung stattfinden.
Jeder Nutzer hat somit die gleiche Aufgabe und darüber
hinaus das gleiche Ziel.
Zusätzlich wird aber auch die kooperative Zusammenarbeit durch Arbeitsteilung unterstützt. So ist ein mögliches
Anwendungsszenario, dass eine Gruppe von Nutzern ein
bestimmtes Set an Entwürfen oder Zeichnungen bearbeitet,
während eine weitere Gruppe ein anderes Set des gleichen Projektes überarbeitet und bewertet. Verschiedene
Nutzer bzw. Gruppen tragen somit durch die Aufteilung
von Aufgaben zum einem Ziel bei. Eine Kooperation zeichnet sich darüber hinaus durch einen geringeren Grad der
Zusammenarbeit und einen erhöhten Anteil individueller
Arbeit aus. Ist demnach eine kooperative Zusammenarbeit
innerhalb der Projektgruppe relevant, so kann das bei der
Anwendung von SketchCoLab durch die Nutzer beeinflusst
•••
werden und z.B. auf die Kommunikation per Chat verzichtet werden. Auch kann die Intensität der Kommunikation
zwischen den Nutzern differieren, sodass Anwender die
wenig oder gar nicht mit anderen Teilnehmern kommunizieren eher kooperativ als kollaborativ etwas zum Ergebnis
beitragen.
Innerhalb des Prototyps ist sowohl die asynchrone, als
auch im gewissen Umfang die synchrone Zusammenarbeit
möglich. Sind Teilnehmer zeitgleich in der Anwendung
und kommunizieren hinsichtlich der gemeinsamen Aufgabenstellung, wird der Aspekt der Kollaboration verstärkt.
Bei einer asynchronen Zusammenarbeit können dagegen
die Gruppenmitglieder ihr eigenes Arbeitstempo bzw. den
Grad der Beeinflussung durch andere Nutzer bestimmen.
Hinweis: In Kapitel 3.3.4 (Mockups) erfolgt die Darstellung
der Visualisierung von SketchCoLab bzw. die Erläuterung
der im Prototyp abgebildeten Funktionen. Screenshots der
finalen Applikation werden aufgrund der Fertigstellung und
Weiterverarbeitung der schriftlichen Arbeit vor dem Abgabetermin daher auf der beiliegenden CD-ROM zur Verfügung gestellt und können dort eingesehen werden.
79
Grobkonzept
SketchCoLab
•••
3.2. Feinkonzept
Vornehmlicher Aspekt innerhalb des Feinkonzepts stellt die
Betrachtung der Funktionalität der Anwendung in Form des
Interface- und Interaktionsdesigns dar. Während beim Interfacedesign auf Basis einer formalen Gestaltung der Dialog zwischen Mensch und Maschine im Vordergrund steht,
betrachtet der Bereich Interaktionsdesign die Funktionsvorgänge im Detail. Interfacedesign kommuniziert demnach
„was“ und „wie“ etwas funktioniert, Interaktionsdesign dagegen vermittelt „auf welchem Weg“ die Funktion stattfin-
Tiefe Struktur
Breite Struktur
Abbildung 49: Hierarchien einer Informationsarchitektur
Darstellung nach ARNDT (2006, S. 143)
80
SketchCoLab
det. Die Funktionalität einer Anwendung ist demnach kein
reiner Selbstzweck, sondern unterstützt die Absicht eines
Produktes bzw. die Vermittlung der Inhalte (STAPELKAMP,
2010, S. 392 und S. 466 ff.).
3.2.1. Informationsarchitektur
Die Informationsarchitektur zeigt die Struktur der relevanten Informationen und Funktionen einer Anwendung. Wichtiger Aspekt dabei ist die Hierarchie, die sich durch Tiefe
•••
(Ebenen) und Breite (Sektionen) der Struktur ergibt. Eine
Struktur, die viele Sektionen auf einer Ebene einsetzt, benötigt demnach weniger Ebenen. Bei einer tiefen Hierarchie
dagegen wird die Anzahl der Sektionen auf einer Ebene reduziert und somit die Menge an Ebenen erhöht (siehe auch
Lineare Verknüpfung
Abbildung 49). Tiefe Strukturen erfordern unter Umständen
einen längeren Weg bis der Nutzer sein Ziel erreicht, sind
dafür jedoch übersichtlicher, da sie jeweils eine überschaubare Anzahl an Möglichkeiten anbieten. Breite Strukturen
verkürzen dagegen den Weg, können aber abhängig von
Netzwerkartige Verknüpfung
Hyperlink-Verknüpfung
Hierarchische Verknüpfung (mit Hyperlinks)
Einzelbild-Struktur
Abbildung 50: Navigationsstrukturen
Darstellung nach STAPELKAMP (2007, S. 187 ff.)
81
Feinkonzept
SketchCoLab
•••
Informationsarchitektur
Stellt die Hierarchie der Informations- und Funktionsstruktur einer
Anwendung oder Website dar,
die durch die Tiefe (Ebenen) und
Breite (Sektionen) der Struktur
entsteht.
der Anzahl der gleichzeitig auf einer Ebene dargestellten
Sektionen unübersichtlich sein. Tendenziell lässt sich sagen,
dass breite Strukturen dem Anwender eher entgegen kommen. Wobei die optimale Anzahl der Sektionen auf einer
Ebene vor allem von den Inhalten und deren qualitativen
Benennung abhängt (ARNDT, 2006, S. 140 ff.).
Aus der Informationsarchitektur ergibt sich die Navigationsstruktur einer Anwendung. Sie unterstützt die Darstellung der Inhalte und Möglichkeiten und dient zu Orientierungszwecken. Wissenschaftliche Untersuchungen haben
ergeben, dass Menschen sich maximal sieben Elemente z. B. Sektionen innerhalb einer Struktur merken können.
Es ist demnach sinnvoll die Anzahl von Navigationselementen auf einer Ebene möglichst gering zu halten, aber
auch unnötig komplexe Strukturen zu vermeiden.
Folgende Navigationsstrukturen werden unterschieden (siehe auch Abbildung 50):
• Lineare Verknüpfung: Die einfachste Form der Navigationsstruktur, bei der die miteinander verbundenen Inhalte sequentiell aufeinander aufbauen (z. B.
bei Anmelde- oder Bestellprozessen).
• Hyperlink-Verknüpfung: Die Hyperlink-Verknüpfung
stellte eine Erweiterung der linearen Verknüpfung
dar, bei der durch Hyperlinks dem Nutzer die
Möglichkeit gegeben wird, die Reihenfolge selbst zu
bestimmen.
• Hierarchische Verknüpfung: Die Inhalte werden bei
einer hierarchischen Verknüpfung horizontal (Breite
des Themas) und vertikal (Tiefe des Themas) gegliedert. Damit werden in der Breite allgemeine und in
82
SketchCoLab
der Tiefe detaillierte Informationen dargestellt.
• Netzwerkartige Verknüpfung: Die Netzstruktur
kommt ohne eine Verbindungsstruktur aus. Sie ähnelt
der hierarchischen Struktur, jedoch können voneinander entfernte Inhalte nicht direkt über Hyperlinks
aufgerufen werden, sondern nur über Umwege.
• Einzelbild-Struktur: Die Verknüpfungen in einer
Einzelbild-Struktur sind so aufgebaut, dass es nur benachbarte Inhalte gibt und keine unterschiedlichen
Hierarchie-Ebenen (z. B bei Bildergalerien).
(STAPELKAMP, 2007, S. 184 ff.).
Verschiedene Navigationsformen unterstützen die praktische Nutzung der Navigationsstruktur mit ihren Inhalten
und Funktionen. Welche Form am geeignetsten ist, hängt
im Wesentlichen von der Produktabsicht, dem zu vermittelnden Inhalt ab und dem eingesetzten Medium ab.
Mögliche Navigationsformen sind:
•
•
•
•
•
•
•
•
•
•
Direkte Manipulation
Hierarchische Navigationssysteme
Sitemap
Imagemap
Anker-Navigation
Suche
Alphabetische Index-Navigation
Guided Tour
Geleitete bzw. manipulierte Navigation
Eigenwillige Navigationsformen
•••
Aufgrund der Relevanz für diese Arbeit soll lediglich auf
die ersten beiden Formen kurz eingegangen werden. Die
direkte Manipulation stellt dabei die unmittelbarste Navigationsmöglichkeit dar, da dem Nutzer der Eindruck vermittelt wird, direkt in das Geschehen eingreifen zu können.
Ein Beispiel ist das Greifen und Verschieben von Objekten
(Drag & Drop). Wichtig bei direkten Manipulationen ist
das eine sofortige Wechselwirkung zwischen Nutzer-Interaktion und System stattfindet.
Hierarchische Navigationssysteme gliedern Inhalte bezüglich ihrer Bedeutung oder ihres Themas und können
durch verschiedene Menüarten (z. B. horizontales oder
vertikales Menü, Pulldown-Menü, generische Navigation,
etc.) unterstützt werden (STAPELKAMP, 2007, S. 190 ff.).
Bezogen auf den Prototyp
Bei der Konzeption von SketchCoLab wurde von einer breiten Struktur der Hierarchie ausgegangen, um den Weg zu
den jeweiligen Funktionen und Informationen möglichst
kurz zu gestalten (siehe auch Abbildung 49). Primär eingesetzte Navigationsformen stellen die direkte Manipulation,
die durch die Touchscreen-Technologie entsprechend unterstützt wird, sowie verschiedene Formen des hierarchischen
Navigationssystems dar.
3.2.2. Wireframes (Funktionslayout)
Wireframes oder auch Funktionslayout genannt, dienen
zur Darstellung der Funktionalität und sämtlicher relevanter
Funktionselemente einer Anwendung oder eines Produkts.
Sie beschreiben die einzelnen Funktionselemente in ihren
Eigenschaften sowie ihrer Positionierung und bilden somit
die Grundlage für den anschließenden Gestaltungsprozess
ohne bereits gestalterische Details darzustellen.
Konkrete Fragen die durch das Funktionslayout beantwortet werden sollten sind laut SAFFER beispielsweise:
• Welche Bedienelemente können wie verändert werden?
• Was passiert wenn der Nutzer mit diesen Elementen
interagiert?
• Wo sind diese Elemente innerhalb der Anwendung
platziert?
• Welche Abhängigkeiten und Zustände der Bedienelemente gibt es?
• Welche technischen oder physikalischen Grenzen
bzw. Einschränkungen gilt es zu beachten?
• Welche sensorischen Gegebenheiten sind zu beachten (z. B. die Sensitivität oder Genauigkeit der
Sensoren)?
Wireframes eignen sich für jede Art von interaktiver Anwendung, unabhängig wie komplex diese ist und bieten
darüber hinaus einige Vorteile. So lassen sich damit schnell
Ergebnisse erzielen, die darüber hinaus eine gute Diskussionsgrundlage für alle am Gestaltungsprozess beteiligten
Personen darstellen. Bei der Erstellung ist darauf zu achten,
verschiedene Anwendergruppen und deren Kompetenzgrad (Anfänger, Fortgeschrittene, Experten) zu berücksichtigen. Darüber hinaus beschreibt STAPELKAMP drei Funktionskategorien, die neben den Kompetenzgraden in die
Entwicklung von Wireframes einfließen sollten:
83
Feinkonzept
SketchCoLab
•••
Wireframe
Mit Wireframes wird die Funktionalität einer Anwendung, eines
Produkts oder einer Website
dargestellt, ohne dabei bereits
gestalterische Details festzulegen. Sie dienen häufig auch als
Diskussionsgrundlage zwischen
den beteiligten Personen (Nutzer, Gestalter, Entwickler).
• Primärfunktion: Funktionen, die den Hauptnutzen
des Produktes oder Anwendung ausmachen
• Sekundärfunktion: Funktionen, die den Hauptnutzen
des Produktes erweitern
• Tertiärfunktion: Funktionen, die nicht unbedingt
notwendig sind, da sie nicht relevant für den Hauptnutzen der Anwendung sind
teils durch direkt in den Grobentwürfen enthaltene Hinweise unterstützt und geben einen Überblick über relevante
und geplante Interaktionen.
Als Teil des Gestaltungslayouts einer Anwendung, die
in die Wireframes und Mockups fließt, wird zunächst kurz
auf Aspekte des Formats und Rasters des Prototyps eingegangen.
Für die praktische Umsetzung von Funktionslayouts für
Touchscreen-Systeme ist es darüber hinaus hilfreich, diese
„pixelgenau“ zu realisieren. Diese Vorgehensweise reduziert die Überladung des Bildschirms und hilft den Platzbedarf von Touchelementen im Vorfeld richtig einzuschätzen
(SAFFER, 2009, S. 102; STAPELKAMP, 2010, S. 162 f.).
Format
Als Grundlage zur Aufteilung und Strukturierung einer Fläche dient das Format einer interaktiven Anwendung. Das
Format wiederum ist meist abhängig vom verwendeten
Medium und bestimmt maßgeblich die charakterlichen Eigenschaften eines Interface- und Screendesigns. Aber auch
die eingesetzte Software (z. B. Browser) kann das Format
beeinflussen, da sie oft nicht den kompletten Platz eines
Mediums zur Verfügung stellt. Bei den meisten mobilen
Geräten ist die Besonderheit gegeben, dass sowohl die
Betrachtung im Quer-, als auch im Hochformat möglich ist.
Somit wird in der Queransicht am ehesten das natürliche
Blickfeld des Menschen unterstützt, während im Hochformat die Dynamik gefördert wird. Im vorgestellten Prototyp
wird allerdings ausschließlich auf das Querformat gesetzt,
da eine für beide Formate optimierte Gestaltung den Umfang dieser Arbeit sprengen würde (STAPELKAMP, 2010,
S. 256 ff.).
Das zur Verfügung stehende Testgerät arbeitet mit einer
Auflösung von 1280 x 800 Pixel. Die Realisation als WebApplikation erfordert den Einsatz eines Browsers, weshalb
die genannte Auflösung zur Darstellung der Anwendung
nicht voll zur Verfügung steht. Als einer der möglichen
einsetzbaren Browser wurde in dieser Arbeit der Android
Wireframes des interaktiven Prototyps
Anhand der nachfolgend dargestellten Wireframes wird
ein erster Überblick über das Konzept des interaktiven Prototyps dargestellt und beschrieben. Die vorgestellten Wireframes sind dabei zum grundlegenden Verständnis gedacht und repräsentieren nicht immer das finale Ergebnis,
wie es letztlich in die Mockups bzw. in den Prototyp selbst
eingeflossen ist. So wurden eine Reihe von Funktionen die
zum Teil in den Wireframes dargestellt sind, in der Endversion von SketchCoLab nicht berücksichtigt oder modifiziert. Die Wireframes zeigen daher neben dem eigentlichen Konzept ebenfalls einen Überblick über während der
Entwurfsphase angedachte und teilweise wieder verworfene Ansätze. Diese Ansätze demonstrieren den iterativen
Charakter während der Konzeptphase und bieten darüber
hinaus mögliche Ansätze für eine Weiterentwicklung des
Prototyps. Die dargestellten Wireframes werden größten-
84
SketchCoLab
•••
Dolphin Browser verwendet, der innerhalb seines Darstellungsbereichs im Vollbildmodus die gewünschte Auflösung
darstellt. Zusätzlich wurde bei der Umsetzung des Prototyps die Höhe der Anwendung auf 700 Pixel reduziert,
um in einem gewissen Rahmen auch niedrigere Auflösungen zu berücksichtigen. Es wird darauf hingewiesen, dass
diese Werte nur als exemplarische Daten zu sehen sind,
da der vorhandene Platz sowohl vom verwendeten Gerät,
als auch vom eingesetzten Browser abhängig ist. In den
Wireframes wurde vom komplett zur Verfügung stehenden
Platz ausgegangen, da prinzipiell die Ausführung der Anwendung im Vollbildmodus denkbar ist (z. B. auf dem iPad
oder generell in einem Browser mit Vollbildfunktion).
Fläche erfolgte der Einsatz eines Rasters. Das eingesetzte
Raster diente dabei als Richtlinie und wurde unter anderem
aufgrund der teilweise flexiblen Anpassung der Breite der
Webapplikation nicht durchgängig übertragen.
Raster verschaffen dem Designer beim Gestaltungsprozess einen Überblick und helfen ihm bei der Umsetzung eines durchgängigen und homogenen Interface- und Screendesigns. SketchCoLab basiert auf einem flexiblen 32 x 32
Pixel Raster, dass bis zu einem 8er Raster herunter gebrochen werden kann (siehe auch Abbildung 51), wobei dies
der Bildschirmauflösung von mobilen Geräten und Computern entgegen kommt, da diese immer durch acht teilbar ist
(STAPELKAMP, 2010, S. 262 ff.).
Raster
Gestaltungsraster sind ein
Ordnungssystem in der visuellen
Kommunikation, mit deren Hilfe
die Organisation und Aufteilung von grafischen Elementen
erleichtert wird.
Raster
Zur Unterstützung einer möglichst optimalen Aufteilung der
Abbildung 51: Basisraster als Gestaltungsrichtlinie
Eigene Darstellung
85
Feinkonzept
SketchCoLab
•••
Wireframe #1 - Grundaufbau
Abbildung 52: Wireframe #1 - Grundaufbau
Eigene Darstellung
86
SketchCoLab
•••
Wireframe #2 - Werkzeugoptionen
Abbildung 53: Wireframe #2 - Werkzeugoptionen
Eigene Darstellung
87
Feinkonzept
SketchCoLab
•••
Wireframe #3 - Projektauswahl
Abbildung 54: Wireframe #3 - Projektauswahl
Eigene Darstellung
88
SketchCoLab
•••
Wireframe #4 - Wahl der Zeichnung
Abbildung 55: Wireframe #4 - Wahl der Zeichnung
Eigene Darstellung
89
Feinkonzept
SketchCoLab
•••
Wireframe #5 - Werkzeuge: Freiform-Stift
Abbildung 56: Wireframe #5 - Werkzeuge: Freiform-Stift
Eigene Darstellung
90
SketchCoLab
•••
Wireframe #6 - Werkzeuge: Textwerkzeug
Abbildung 57: Wireframe #6 - Werkzeuge: Textwerkzeug
Eigene Darstellung
91
Feinkonzept
SketchCoLab
•••
Wireframe #7 - Werkzeuge: Radiergummi
Abbildung 58: Wireframe #7 - Werkzeuge: Radiergummi
Eigene Darstellung
92
SketchCoLab
•••
Wireframe #8 - Werkzeuge: Textmarker
Abbildung 59: Wireframe #8 - Werkzeuge: Textmarker
Eigene Darstellung
93
Feinkonzept
SketchCoLab
•••
Wireframe #9 - Workflow: Elemente skalieren
und rotieren
Abbildung 60: Wireframe #9 - Workflow: Elemente skalieren und rotieren
Eigene Darstellung
94
SketchCoLab
•••
Wireframe #10 - Workflow: Elemente (nachträglich) verschieben
Abbildung 61: Wireframe #10 - Elemente (nachträglich) verschieben
Eigene Darstellung
95
Feinkonzept
SketchCoLab
•••
Wireframe #11 - Workflow: Arbeitsfläche vergrößern und verschieben
Abbildung 62: Wireframe #11 - Workflow: Arbeitsfläche vergrößern und verschieben
Eigene Darstellung
96
SketchCoLab
•••
Wireframe #12 - Aktivitätspanel: Bewertungen
einsehen und neue Bewertung vergeben
Abbildung 63: Wireframe #12 - Aktivitätspanel: Bewertungen einsehen und neue Bewertung vergeben
Eigene Darstellung
97
Feinkonzept
SketchCoLab
•••
Wireframe #13 - Aktivitätspanel: Bestehende
„Tags“ einsehen und neue „Tags“ vergeben
Abbildung 64: Wireframe #13 - Aktivitätspanel: Bestehende „Tags“ einsehen und neue „Tags“ vergeben
Eigene Darstellung
98
SketchCoLab
•••
Wireframe #14 - Aktivitätspanel: Useraktivitäten einsehen
Abbildung 65: Wireframe #14 - Aktivitätspanel: Useraktivitäten einsehen
Eigene Darstellung
99
Feinkonzept
SketchCoLab
•••
Wireframe #15 - Ansichtspanel: Bestehende Annotationsversionen einsehen und bearbeiten
Abbildung 66: Wireframe #15 - Ansichtspanel: Bestehende Annotationsversionen einsehen und bearbeiten
Eigene Darstellung
100
SketchCoLab
•••
Wireframe #16 - Eine Zeichnung bewerten und
kommentieren
Abbildung 67: Wireframe #16 - Zeichnung bewerten und kommentieren
Eigene Darstellung
101
Feinkonzept
SketchCoLab
•••
Wireframe #17 - „Tags“ zu einer Zeichnung
vergeben
Abbildung 68: Wireframe #17 - „Tags“ zu einer Zeichnung vergeben
Eigene Darstellung
102
SketchCoLab
•••
3.2.3. Interaktionen
Grundlagen der direkten Interaktion
Die direkte Manipulation von Interfaces gilt als natürlichste
Form der Interaktion. Die Möglichkeit mit Objekten unmittelbar zu interagieren kommt der Vorgehensweise in der
realen Welt sehr nahe, obwohl die meisten Interfaces keine räumliche Interaktion unterstützen. Die Steuerung per
Maus zählt zwar ebenfalls zu den direkten Eingabemethoden, doch kommen Touch- bzw. Multitouchscreens dem
Anspruch einer möglichst direkten Manipulation durch den
Anwender noch ein wenig näher. Das dahinter stehende
Prinzip nennt sich „Verankerung“ und orientiert sich an
Gesten, die sich von natürlichen Bewegungsabläufen ableiten. Bei der Bedienung eines Touchscreens erfolgt eine
feste Verbindung zwischen dem Finger (oder mehreren Fingern) und dem manipulierten Objekt, die dafür sorgt, dass
das Objekt den Bewegungen des Fingers folgt, solange
diese Verbindung besteht. Das Prinzip der „Verankerung“
ist vor allem bei den sogenannten „Ziehgesten“ (z. B. Drag
& Drop, Scrollen) ersichtlich, bei dem Objekte von einer
Stelle des Interfaces an eine andere Stelle gezogen werden
Drag & Drop
Rotieren
Verkleinern
und somit dem Greifen von Objekten in der realen Welt
nachempfunden ist.
Eine weitere Form der Interaktion die auf dem Prinzip
der „Verankerung“ aufbaut, ist die „Pinch-Geste“. Durch
eine öffnende und schließende Spreizbewegung von Zeigefinger und Daumen können so Objekte vergrößert und
verkleinert werden. Ähnlich funktioniert das Rotieren, bei
dem Objekte mit Hilfe des Daumens und des Zeigefingers
um deren Mittelpunkt gedreht werden. Insgesamt handelt
es sich bei diesen Gesten, um objektorientierte Gesten die
immer an ein Objekt oder eine Objektklasse gebunden
sind (DORAU, 2011, S. 110 ff.). Abbildung 69 zeigt Beispiele von verankernden Gesten auf Touchscreens.
Text- und Zeicheneingabe
Im interaktiven Prototyp spielt die Eingabe von Text eine
wichtige Rolle, weshalb darauf auch kurz eingegangen
wird. Allgemein ist bei der Planung der Interaktionen auf
mobilen Geräten zu beachten, dass Nutzer unterschiedliche Fähigkeiten und Präferenzen bei der Eingabe von Text
einbringen. Demnach ist es grundsätzlich zu empfehlen,
dem Anwender wenn möglich und sinnvoll mehrere Opti-
Vergrößern
Abbildung 69: Beispiele verankernder Gesten auf Touchscreens
Eigene Darstellung
103
Feinkonzept
SketchCoLab
•••
onen bereitzustellen. Wichtig ist es, Eingabemethoden zur
Verfügung zu stellen, die dem Nutzer bereits bekannt sind.
Ebenfalls muss der Kontext der Nutzung betrachtet werden,
z. B. unter welchen physikalischen Umständen erfolgt die
Texteingabe und inwieweit haben diese Einfluss auf die
Nutzeraktionen. Die Berücksichtigung persönlicher Eigenschaften der jeweiligen Nutzergruppe stellt einen weiteren
wichtigen Aspekt dar. Junge Leute sind beispielsweise geübter bei der Texteingabe als ältere Personen. Unterstützende Funktionen, die eine effiziente Eingabe von Text (z. B.
Autovervollständigung, Wortvorschläge) ermöglichen, sollten darüber hinaus zur Verfügung gestellt werden.
Bei der entwickelten Anwendung bzw. beim verwendeten Testgerät sind grundsätzlich zwei Möglichkeiten der
Texteingabe mit ihren Variationen denkbar und werden unterstützt.
Tastatur
Die Verwendung einer Tastatur bietet sich immer dann an,
wenn dem Nutzer einfach, leicht und idealerweise ohne
Erklärung der Handhabung die Möglichkeit der textlichen
und numerischen Eingabe zur Verfügung gestellt werden
soll. Dabei kann es sich sowohl um eine physikalische
als auch eine virtuelle Tastatur handeln. Das Konzept der
Hardware-Tastaturen stellt durch seine allgegenwärtige
Präsenz eine erwartungskonforme Texteingabe dar, welches ebenfalls auf Bildschirme (Touchscreens) übertragen
wurde. Obwohl eine Reihe anderer Eingabetechnologien
existieren, sind Tastaturen die geläufigste Form der Texteingabe und stellen demnach eine Schlüsselkomponente interaktiver Geräte dar.
Virtuelle Tastaturen auf Touchscreens können aufgrund
104
SketchCoLab
des geringeren zur Verfügung stehenden Platzes nicht die
gesamte Breite der Funktionalität physischer Tastaturen abbilden. Sie sollten jedoch die grundlegenden Prinzipien bereitstellen, damit Anwender ohne kognitive Belastung in der
Lage sind Informationen über das Gerät einzugeben. Bei
virtuellen Tastaturen stehen eine Reihe von verschiedenen
Konzepten zur Verfügung, die es dem Nutzer erlauben, die
Texteingabe nach seinen persönlichen Bedürfnissen auszuwählen und deren Ziel es ist, die Texteingabe zu optimieren bzw. zu beschleunigen (HOOBER & BERKMAN, 2011,
S. 284 ff.).
Das verwendete Testgerät ASUS EeePad Transformer
TF101 bietet neben einer andockbaren Hardware-Tastatur,
die Texteingabe durch das vom Android-Betriebssystem
zur Verfügung gestellte virtuelle Keyboard an, welches je
nach Geschmack in Form von Apps hinsichtlich des Eingabekonzepts angepasst werden kann. Generell ist es bei
der Geräteklasse der Tablet Computer möglich diese mit
einer physischen Tastatur zu verbinden, wodurch auch ein
Stück Mobilität verloren geht. Allerdings erlaubt die Eingabe durch eine Hardware-Tastatur eine komfortable Texteingabe, die sich vor allem bei längeren Texten bezahlt macht
und demnach beim interaktiven Prototyp als empfohlene
Eingabeform vorgeschlagen wird.
Stifteingabe
Die Texteingabe per Stift (Stylus) stellt eine weitere Möglichkeit dar und bietet Nutzern, die weniger geübt im Umgang
mit der Tastatur sind, eine Alternative. Sie eignet sich als
einfache, natürliche und ohne viel Übung nutzbare Eingabeform. Ein Eingabestift kann dabei als Alternative zur
direkten Touch-Interaktion durch den Finger dienen. Zum
•••
Beispiel wenn es regnet, der Nutzer Handschuhe trägt
oder wenn ein gewisser Präzessionsgrad notwendig ist
bzw. nur eine Hand zur Verfügung steht. Darüber hinaus
ermöglicht der Einsatz eines Stylus den natürlichen Ablauf
beim Schreiben von Text, wie man ihn mit Papier und Stift
kennt. Schrifterkennungsalgorithmen können diesen Prozess unterstützen, sodass die vom Nutzer auf das Display
geschriebenen Worte und Zeichen direkt durch das System umgewandelt und erkannt werden (HOOBER & BERKMAN, 2011, S. 291 ff.).
Im interaktiven Prototyp stellt die Stifteingabe vor allem bezüglich der Annotation eine intuitive Möglichkeit
der Interaktion dar. Annotationen können neben Formen,
Zeichnungen, etc. auch Texte bzw. Wörter sein. Dabei ist
zu bemerken, dass die Stifteingabe von Text innerhalb der
Anwendung eine reduzierte Form der Texteingabe darstellt, da keine Schrifterkennung und Umwandlung des
Texts durch das System stattfindet. Bei der Verwendung von
SketchCoLab wird generell die Nutzung eines Stylus vor
allem in Bezug auf die Annotation durch Text und Zeichnungen in Form „digitaler Tinte“ empfohlen, der zusätzlich
1
Einfacher Tap
(normaler Klick)
2
Double-Tap
(Doppelklick)
3
Bewegen und
Verschieben
auch als Alternative zur direkten Interaktion durch den Finger genutzt werden kann.
Relevante Touch- / Multitouchinteraktionen
Die im Prototyp verwendeten Interaktionen bezogen auf
die Nutzung von SketchCoLab mit einem mobilen Endgerät
zeigt die Abbildung 70.
• 1: Tap (alternative Mausgeste: Klick)
Diese Form der Interaktionsmöglichkeit stellt den
Hauptbestandteil dar und betrifft primär Interaktionselemente wie Buttons und Menüs.
In SketchCoLab: Buttons, Werkzeuge, Menüs (Slider,
Accordion)
• 2: Double-Tap (alternative Mausgeste: Doppelklick)
In SketchCoLab: Löschen von Textelementen, die auf
der Leinwand platziert wurden.
• 3: Touchmove, Bewegen und Verschieben (alternative Mausgeste: Drag & Drop)
4
Scrollen nach links
und rechts (Swipe)
5
Scrollen (Swipe nach
oben und unten)
Abbildung 70: Touch-Interaktionen im Prototyp
Eigene Darstellung
105
Feinkonzept
SketchCoLab
•••
In SketchCoLab: Bewegen der erstellten Textboxen
auf der Leinwand, Zeichnen auf der Leinwand.
• 4: Swipe nach links und rechts (horizontales Scrollen) (alternative Mausgeste: Klicken der Pfeilelemente)
In SketchCoLab: Bilderslider bei Wahl der Zeichnung
und im Bewertungsfenster.
• 5: Swipe nach oben und unten (vertikales Scrollen)
In SketchCoLab: Einträge im Chat, bei Einzelbewertungen und Projektwahl, wenn die Anzahl der Daten
den verfügbaren Anzeigeplatz überschreitet.
106
SketchCoLab
•••
3.3. Gestaltungskonzept
Screendesign beschreibt primär die Form bzw. visuelle
Ästhetik eines Produkts oder einer Anwendung, unterstützt
bestenfalls aber auch die Darstellung der funktionalen
Aspekte. So ist die Grenze zwischen Screendesign und
Interfacedesign nicht immer eindeutig. Denn eine interaktive Anwendung, die zwar eine optimale Bedienbarkeit,
jedoch über keine ansprechende Gestaltung verfügt, ist genauso wenig zielführend, wie eine ansprechend gestaltete
Lösung, welche die Verdeutlichung der Funktionen vernachlässigt. Es ist daher wichtig, dass ein möglichst optimales
Zusammenspiel von Form (Screendesign) und Funktion
(Interfacedesign) erfolgt und die Absicht eines Produktes
durch das Screendesign unterstützt wird. Elemente des
Screendesigns sind:
• Layout: Gliederung des Interfaces in Aktions-, Informations- und Inhaltsbereiche
• Inhalte: Unterstützung der Gestaltung von Informationen, damit sie vom Anwender als Inhalte verarbeitet
und aufgenommen werden (meist in Kombination
mit Interaktivät)
• Orientierung: Bereitstellen von Orientierungshilfen
für den Nutzer (z. B. durch Menüs)
• Anreize, Motivation: Für den Anwender Reize schaffen, damit dieser sich mit dem Produkt beschäftigen
möchte und daran Freude hat
• Auswahl- und Interaktionsmöglichkeiten: Unterstützung der Auswahl- und Interaktionsmöglichkeiten
durch das Screendesign
(STAPELKAMP, 2007, S. 314 ff.)
Nachfolgend sollen einige Aspekte dieser Elemente in Bezug auf den in dieser Arbeit entwickelten Prototyp genauer
dargestellt werden.
3.3.1. Typografie
Darstellungsmedien, die über einen selbstleuchtenden Bildschirm verfügen, stellen eine große Herausforderung an
die typografische Gestaltung dar. Das Lesen von Text auf
dieser Art von Geräten kann für den Nutzer mitunter sehr
anstrengend sein. Gründe hierfür sind neben der geringen
Oberlänge
Versalhöhe
x-Höhe
Unterlänge
Punze
Serife
Abbildung 71: Grundbegriffe der Typografie
Eigene Darstellung
107
Gestaltungskonzept
SketchCoLab
•••
Auflösung (72 oder 96 Punkte pro Zoll) der Bildschirme,
auch die für das Auge ermüdenden Bildwiederholungsraten (z. B. bei Röhrenmonitoren).
Dazu kommt, dass Kontraste und Farben auf einem
selbstleuchtenden Medium intensiver dargestellt werden,
als dies zum Beispiel bei Printprodukten der Fall ist. Zu starke oder geringe Kontraste können demnach den Betrachter
bei der Aufnahme der dargestellten Informationen stören
bzw. diese erschweren. Daher müssen bei der typografischen Gestaltung einige Vorgaben beachtet werden, um
ein möglichst optimales Ergebnis zu erzielen.
Diese Vorgaben sind dabei in Abhängigkeit des verwendeten Darstellungsmediums zu sehen. Ein wichtiger Parameter stellt hierbei die Entfernung des Betrachters auf das
jeweils genutzte Display dar. Bei mobilen Geräten wird
dieser Abstand auf ca. 30 cm definiert.
Neben dem Betrachtungsabstand sind aber auch technische Eigenschaften des Geräts wie Farbtiefe oder Auflösung
zu beachten, genauso wie zielgruppen- und themenspezifische Aspekte. Generell sind aufgrund der geringeren Auflösung der Geräte, Serifenschriften in kleineren Punktgrößen weniger zur Darstellung auf selbstleuchtenden Medien
geeignet. Eigens für den Bildschirm entwickelte Screenfonts
bzw. Pixelschriften erlauben dagegen eine optimierte Textdarstellung.
Die Ansprüche an eine gute Typografie werden im Bereich der Mobilgeräte noch einmal aufgrund der geringeren Bildschirmgröße bzw. durch den stark begrenzten Platz
erhöht. Bei einem Betrachtungsabstand von 30 cm wird
als Richtwert eine Schriftgröße von 8 – 11 Punkt empfohlen. Die dynamische Anpassung der Schriftgröße bei unterschiedlich großen Displays der Mobilgeräte macht eine
108
SketchCoLab
allgemein gültige Regel allerdings kaum möglich (STAPELKAMP, 2007, S. 92 ff.).
Dennoch können laut HOOBER & BERKMAN einige
Richtlinien bei der Auswahl der geeigneten Schriftart für
mobile Geräte helfen, die hier auszugsweise genannt werden sollen (Abbildung 71 zeigt zur Unterstützung einige
typografische Fachbegriffe).
Folgende Eigenschaften muss eine geeignete Schrift für mobile Geräte besitzen:
• Die X-Höhe (Höhe der Kleinbuchstaben) sollte
zwischen 65% und 80% der Versalhöhe (Höhe der
Großbuchstaben) betragen
• Kräftige Punzen (ausgesparte Innenflächen bei Buchstaben); eckige Formen sind für kleine Punzen am
geeignetsten
• Unbetonte Formen; gerade, gleichbreite Linien
• Keine übermäßigen Unterlängen; nicht größer als
15 – 20% der Versalhöhe um einen zu großen Zeilenabstand zu vermeiden
• Keine Oberlängen oberhalb der Versalhöhe (wichtig
vor allem bei nichtenglischen Sprachen)
Eine gute Schrift für Mobilgeräte verfügt darüber hinaus
über weitere Eigenschaften:
• Platzsparend in der Darstellung
• Keine gestauchte Darstellung bzw. Optik der Schrift
• Optimiertes Kerning (Unterschneidung) der Buchstaben – Die Abstände der Buchstaben sollten ausgeglichen sein (nicht zu weit und nicht zu eng)
•••
• Gleiche oder ähnliche Breite für alle Schriftdicken
und Schriftschnitte
• Echte Kursiv-Schnitte verwenden (keine softwarege-
nerierte Schrägstellung der Buchstaben)
• Schrift sollte Teil einer Schriftfamilie sein; serifenbetonte und serifenlose Schriften bzw. Schriftschnitte
Abbildung 72: Im Prototyp eingesetzte Schriftart Roboto
Eigene Darstellung
109
Gestaltungskonzept
SketchCoLab
•••
können kombiniert werden (z. B. für Titel- und
Inhaltstext)
(HOOBER & BERKMAN, 2011, S. 502 ff.)
Unbunt-Farbe: Blau-Grau
Hintergrund, Interfacebestandteile
RGB
R: 30 G: 35 B: 45
CMYK
C: 80 M: 71 Y: 56 K:66
Bunt-Farbe: Gelb-Grün
Interaktionselemente, wichtige
Informationseinheiten
RGB
R: 227 G: 227 B: 0
CMYK
C: 15 M: 0 Y: 100 K: 0
Weiß und Schwarz
Textfarbe (Hell-Dunkel-Kontrast)
Typografie im interaktiven Prototyp
Durch die Umsetzung als Web-Applikation ist die Auswahl
an möglichen Schriftarten grundsätzlich als begrenzt zu
betrachten, da sie maßgeblich abhängig ist von den zur
Verfügung gestellten Schriften des jeweiligen Betriebssystems. Da das Ziel bei internetbasierten Applikationen bzw.
Websites ist, möglichst eine plattformunabhängig einheitliche Darstellung zu gewähren, reduzieren sich die Möglichkeiten noch einmal. Dies hat zur Folge, dass eine Schriftart
zu wählen ist, die möglichst auf verschiedenen Plattformen
standardmäßig zur Verfügung gestellt wird. Mit Hilfe sogenannter „Webfonts“ kann diese Restriktion allerdings
umgangen werden. „Webfonts“ erlauben die Einbindung
alternativer Schriftarten, ohne dass diese auf dem System
des Nutzers installiert sein müssen. Dabei wird die Schrift
direkt durch den eigenen oder einen externen Web-Server
zur Verfügung gestellt. Google bietet z. B. eine große Anzahl von „Webfonts“ zur Einbindung auf Websites an.
Ausgehend von den dargestellten Aspekten und Anforderungen an die Typografie auf mobilen Endgeräten wurde für den Einsatz innerhalb des Prototyps die Schriftart
„Roboto“ (Abbildung 72) gewählt, die auch als „Webfont“
zur Verfügung steht. Sie bietet mehrere Schriftschnitte, ist
speziell für die Verwendung auf mobilen Endgeräten optimiert worden und kommt als Standardschrift des neuen
Android-Betriebssystems (ab 4.0) zum Einsatz. Der Font
„Roboto“ ermöglicht eine hohe Informationsdichte und eig-
110
SketchCoLab
net sich zudem auch für die Darstellung auf hochauflösenden Displays, die auf mobilen Geräten immer mehr zum
Standard werden.
Desweiteren wurde die Schriftart auch hinsichtlich der
Lesbarkeit von längeren Texten optimiert, da diese oft bei
serifenlosen Schriften leidet. Großflächige Punzen und eine
ausreichende Höhe der Kleinbuchstaben sind weitere Eigenschaften, die die Schrift für den Einsatz im interaktiven
Prototyp prädestinieren.
Im Prototyp wird als kleinste Schriftgröße 9 Punkt (12
Pixel) und als maximale Größe 20 Punkt (26 Pixel) verwendet, was sich mit der von STAPELKAMP empfohlenen
Schriftgrößen bei mobilen Geräten deckt (mind. 8 bis 11
Punkt). Dabei wurde darauf geachtet, dass eine möglichst
optimale Lesbarkeit bei gleichzeitig bestmöglicher Nutzung
des zur Verfügung stehenden Anzeigeplatzes erreicht wird.
3.3.2. Farben
Für die Erarbeitung eines geeigneten Farbkonzepts gilt es
zunächst zu beachten, dass Farben bei Menschen Emotionen auslösen, die sich durch persönliche oder kulturelle
Eigenschaften jedoch unterscheiden können. Farbe stellt
daher ein äußerst wichtiges Gestaltungswerkzeug dar,
für das es aufgrund des subjektiven Farbempfindens von
Menschen allerdings schwierig ist allgemein gültige Regeln
aufzustellen. Farbe erfüllt eine Vielzahl von Funktionen.
Sie kann „schmücken“, „signalisieren“, „gliedern“, „kommunizieren“, etc. Je nach Umgebung, Darstellungsmedium
oder persönlichen Voraussetzungen können Farben eine
unterschiedliche Wirkung erzielen und somit verschiedene
•••
Gefühle, Eigenschaften oder Begriffe beim Betrachter hervorrufen. Nach EVA HELLER sind dabei sechs verschiedene
Farbwirkungen zu unterscheiden:
•
•
•
•
•
•
Psychologische Wirkung
Symbolische Wirkung
Kulturelle Wirkung
Politische Wirkung
Traditionelle Wirkung
Kreative Wirkung
Für eine möglichst optimale Gestaltung eines Produkts oder
einer Anwendung ist es wichtig, sich über verschiedene
Aufgaben der Farbgestaltung im Klaren zu sein. Beispielsweise stellt sich die Frage, welche Zielgruppe angesprochen werden soll oder inwieweit die technischen Gegebenheiten (Gestaltung für den Bildschirm oder für den Druck)
Einfluss nehmen. Darüber hinaus ist es für den Gestalter
wichtig, Aspekte zur Eindeutigkeit, Lesbarkeit, Orientierung, sowie zu Farbharmonien bzw. Farbkontrasten oder
zum Inhaltsbezug zu definieren (BÖHRINGER, BÜHLER &
SCHLAICH, 2005, S. 36 ff.; STAPELKAMP, 2007, S. 32).
Abbildung 73: Bunt-Unbunt-Kontrast in SketchCoLab
Eigene Darstellung
Farbkonzept des interaktiven Prototyps
Die Farbgestaltung des Interfaces in SketchCoLab basiert
auf der Kombination eines Bunt-Unbunt-Kontrasts mit einem
Qualitätskontrast, sowie eines Hell-Dunkel-Kontrasts. Dabei
werden kräftige bzw. satte Farben mit entfärbten Farbtönen
kombiniert (Bunt-Unbunt). Diese Form des Kontrasts eignet
sich dabei besonders für den Bereich des Screen- und Interfacedesigns. Der unbunte Bestandteil dieser Kontrastart
wird meist durch Grautöne realisiert. Im konkreten Fall von
SketchCoLab wird dieser durch ein Blau-Grau dargestellt,
welches durch einen kräftigen Grünton mit einem hohen
Gelbanteil zur Akzentuierung von wichtigen Interaktionselementen und Informationen unterstützt wird.
Beim Qualitätskontrast wird der Kontrast durch Tonwertabstufungen der entsprechenden Farbe erreicht. Mit Hilfe dieser Abstufungen wurden Informationseinheiten und
Funktionen in verschiedene Bereiche visuell gegliedert,
ohne das Auge des Betrachters mit zu vielen unterschiedlichen Farben zu überfordern. Ein weiterer im Interface des
Prototyp eingesetzter Farbkontrast ist der Hell-Dunkel-Kontrast als ergonomischer Faktor, der vornehmlich den Text
vom Hintergrund differenziert und somit die Lesbarkeit erhöht (STAPELKAMP, 2007, S. 66 ff.).
Zielgruppenspezifische Anforderungen an die Farbgestaltung sind aufgrund der letztlich breiten und im Rahmen
dieser Arbeit sehr allgemein definierten Zielgruppe nicht
eingeflossen.
Bunt-Unbunt-Kontrast
Hell-Dunkel-Kontrast
Qualitätskontrast
Beispiele aus SketchCoLab
Die nachfolgenden Abbildungen zeigen beispielhaft die
soeben beschriebenen Kontraste im Rahmen der Farbgestaltung des Prototyps. Den größten Bestandteil dabei
111
Gestaltungskonzept
SketchCoLab
•••
macht die Verwendung des Qualitäts-Kontrasts (Abbildung
74) aus, der primär innerhalb der Anwendungsoberfläche
eingesetzt wurde. Der Einsatz von Hell-Dunkel- und BuntUnbunt-Kontrasten (Abbildung 75 und Abbildung 73) hilft
dabei die wichtigen Elemente hervorzuheben, sowie die
Lesbarkeit zu unterstützen.
Der Zweck von Icons innerhalb eines Interfaces ist die Förderung der Kommunikation und die Darstellung der Auswahlmöglichkeiten. Vorteil von gut gestalteten Icons ist,
dass Nutzer in der Lage sind die dahinterliegende Funktion
schnell und auch ohne Sprachkenntnis oder Lesefähigkeit
zu erkennen. Darüber hinaus erlauben sie die abstrahierte
und visualisierte Darstellung des Informationsgehalts eines
Objekts, Themas oder Funktion auf kompaktem Raum.
Demnach ist der Anspruch an die Gestaltung von Icons
hoch, da sie auf eine konkrete bzw. verständliche Bedeutung und somit auf das Wesentliche reduziert sein müssen.
Die Visualisierung und Anordnung von Icons ist dabei als
ein Bestandteil innerhalb des Screendesigns anzusehen.
Dabei sollte zunächst geklärt werden, ob der Einsatz von
Icons innerhalb einer Anwendung überhaupt sinnvoll und
notwendig ist. Grundlegende Regeln bei der Gestaltung
von Icons sind neben der Darstellung einer eindeutigen
Aussage, auch die Erarbeitung eines gemeinsamen Stils
bei mehreren Icons und ggf. die Berücksichtigung barrierefreier Gestaltung. In der Praxis gelingt das aufgrund der
Komplexität der darzustellenden Funktionen, Themen oder
Objekte jedoch kaum, weshalb meist die Unterstützung
durch Text (Untertitel) erfolgt. Das macht den Einsatz von
Icons im Sinne ihres eigentlichen Zwecks zwar überflüssig,
Abbildung 74: Qualitätskontrast in SketchCoLab
Eigene Darstellung
Abbildung 75: Hell-Dunkelkontrast in SketchCoLab
Eigene Darstellung
3.3.3. Icons und Symbole
112
SketchCoLab
•••
stellt jedoch ein visuelles Stilmittel bei der Gestaltung von
Interfaces dar. Da Icons darüber hinaus eine Vielzahl von
Aufgaben erfüllen sollten wird klar, dass die Ansprüche an
die Gestaltung von Icons insgesamt sehr hoch sind (STAPELKAMP, 2007, S. 158 ff.). Es folgt ein Überblick von
Richtlinien und Vorschlägen zur Gestaltung von Icons:
• Zielsetzung
Ermittlung der Absicht eines Produktes
Analyse der Zielgruppe mit ihren Vorkenntnissen
und Erfahrungen
Freiform-Stift
Text-Werkzeug
Radierer
Strichstärke/
Farbe
Leinwand
leeren
Speichern
Arbeitsschritt
rückgängig
Arbeitsschritt
wiederholen
Bewertungsstern
Abbildung 76: Icons SketchCoLab in der Grundversion
Eigene Darstellung
• Kontext
Analyse des Kontexts, in dem die Icons eingesetzt
werden
Beziehung des Anwenders zum Produkt ermitteln
• Funktional
Ermittlung der funktionalen Bedeutung der zu gestaltenden Icons
• Konkret / Abstrakt
Klären, welche Form der Darstellung sich am besten
für das Produkt eignet
• Gruppierung
Gruppieren von thematisch und funktional zusammengehörenden Icons zur Verbesserung der Übersicht
• Gemeinsamkeiten
Zusammengehörige Icons müssen zur Unterstützung
eines einheitlichen Gestaltungsstils über Gemeinsam-
Freiform-Stift
Text-Werkzeug
Radierer
Strichstärke/
Farbe
Leinwand
leeren
Speichern
Arbeitsschritt
rückgängig
Arbeitsschritt
wiederholen
Abbildung 77: Icons SketchCoLab in der gestalteten Version
Eigene Darstellung
113
Gestaltungskonzept
SketchCoLab
•••
keiten verfügen
• Anzahl
Keine zu hohe Anzahl von Icons verwenden (Richtwert: max. sieben Stück innerhalb einer Struktur)
• Kultur / Internationalisierung
Beachtung von kulturellen Besonderheiten, die evtl.
eine unterschiedliche Interpretation der Icons hervorrufen kann
• Überprüfung
Usability-Tests zur Überprüfung des Verständnisses
der eingesetzten Icons
(STAPELKAMP 2007, S. 174 ff.)
Icons und Symbole innerhalb des Prototyps
Die in SketchCoLab eingesetzten Icons (siehe Abbildung
76 und Abbildung 77) wurden bewusst abstrakt gehalten,
da dies den grundlegenden Eigenschaften von Icons entspricht und die Übertragung von Zusammenhängen durch
abstrakte Symbole eher gefördert wird. Detaillierte Icons
haben dagegen oft das Problem der schlechten Erkennbarkeit bzw. dass sie vom eigentlichen Inhalt zu sehr ablenken
können (STAPELKAMP, 2007, S. 177 ff.). Bei der Gestaltung der Icons wurde darüber hinaus im Hinblick auf die
Symbolik auf bereits etablierte Metaphern zurückgegriffen.
Als Beispiel sei das gängige Symbol einer Diskette für die
Speichern-Funktionalität genannt, das sich im digitalen
Kontext durchgesetzt hat.
Die Farbgestaltung der Icons basiert auf einem Qualitätskontrast um die Symbole im Interface zu integrieren,
ohne den Nutzer unnötig durch deren Darstellung abzulenken. Aktivierte Icons in der Werkzeugpalette werden mit
114
SketchCoLab
Hilfe des Hell-Dunkel-Kontrasts bzw. Bunt-Unbunt-Kontrasts
dargestellt um den Anwender über den aktuellen Interaktionszustand zu informieren (siehe auch Abbildung 78).
Weitere relevante Symbole innerhalb von SketchCoLab
sind die Sterne zur Darstellung und Abgabe von Bewertungen. Dabei wurde das Stern-Symbol als Metapher gewählt,
da es bei den meisten Nutzern bereits zur Darstellung z. B.
von Produktbewertungen (Amazon) bekannt ist. Bei der
Farbgebung wurde ebenfalls auf ein häufig verbreitetes
Farbschema zurückgegriffen, dass die Bewertungshöhe
und zugleich den Interaktionszustand visualisiert (siehe Abbildung 79).
Bewertungssterne im aktiven (Gelb) und inaktiven (Grau) Zustand
Abbildung 79: Symbolik zur Darstellung von Bewertungen
Eigene Darstellung
Werkzeug
inaktiv
Werkzeug aktiv
Werkzeug
mit Optionen
inaktiv
Werkzeug mit
Optionen aktiv
Abbildung 78: Beispiele aktive und inaktive Werkzeugicons
Eigene Darstellung
•••
3.3.4. Mockups
Die bisher aufgezeigten Aspekte aus dem Fein- und Gestaltungskonzept fließen abschließend in die nachfolgenden
Mockups (Modell, Attrappe, Nachbildung) ein und vermitteln einen ersten Eindruck über das „Look & Feel“ des interaktiven Prototyps. Im Gegensatz zu den bereits vorgestellten Wireframes besitzen Mockups generell einen höheren
Detailgrad, der sich in der Visualisierung der Farbgebung,
Typografie und Interaktionselemente widerspiegelt, aber
nicht zwangsläufig die endgültige Gestaltung darstellen
muss. Die Vorteile von Mockups sind in der einfachen Erstellung und Modifikation zu sehen, sowie der Möglichkeit
bei potentiellen Nutzern ein verbessertes Verständnis für
das Produkt oder die Anwendung zu erreichen.
Die hier vorgestellten Mockups stellen das Gestaltungskonzept zu einem bestimmten Zeitpunkt dar und sind damit
nicht hunderprozentig deckungsgleich mit der endgültigen
Version. Die gestalterischen Unterschiede sind jedoch nur
marginal und betreffen darüber hinaus auch nicht das
grundlegende Interaktions- und Designkonzept.
Mockups
Mockups bauen auf Wireframes
bzw. deren Struktur auf. Ein
Mockup zeigt das „Look & Feel“
einer Anwendung oder einer
Website und stellt somit ein
erstes vorläufiges Design dar. Im
Gegensatz zu den Wireframes
besitzen Mockups einen hohen
Detailgrad was z. B. Farben,
Typografie, etc. angeht.
115
Gestaltungskonzept
SketchCoLab
•••
Mockup #1 - Splashscreen
Nach dem Aufruf der Web-Applikation wird zum Einstieg
in die Anwendung ein Informationsscreen geladen, der
kurz eingeblendet wird. Dieser Screen kann bei erhöhtem
Datenaufkommen auch als Informationsseite über den Ladestatus fungieren. Im Prototyp ist diese Funktion allerdings
nicht notwendig und deshalb in dieser Form auch nicht integriert.
Abbildung 80: Mockup #1 - Splashscreen
Eigene Darstellung
116
SketchCoLab
•••
Mockup #2 - Login
Anwender müssen sich zunächst mit gültigen Anmeldedaten
einloggen um SketchCoLab nutzen zu können. Da der Prototyp als Web-Applikation über das Internet weitestgehend
frei zugänglich ist, ist diese Sicherheitsmaßnahme notwendig. Eine weitere mögliche Funktion des Login-Bereichs ist
die Zuordnung des eingeloggten Nutzers zu bestimmten
definierten Projekten. Damit könnte die Anwendung den
Mitgliedern einer Projektgruppe lediglich die Daten zur
Verfügung stellen, für die sie eine Berechtigung besitzen.
Abbildung 81: Mockup #2 - Login-Fenster
Eigene Darstellung
117
Gestaltungskonzept
SketchCoLab
•••
Mockup #3 - Grundansicht der Web-Applikation
Nachdem der Login-Vorgang erfolgreich abgeschlossen
wurde, wird SketchCoLab in seiner Grundansicht geladen.
Dem Nutzer steht damit bereits ein Großteil der Funktionalität direkt zur Verfügung. Dabei werden auf der linken
Seite die für das Annotieren und Zeichnen, sowie für den
Workflow relevanten Funktionen dargestellt, während auf
der rechten Seite die Anzeige der Aktivitäten erfolgt. Die
1
3
» 1: Werkzeuge zur Annotation
» 2: Werkzeuge für den Workflow
4
» 3: Projekt und Zeichnung wählen
» 4: Leinwand zum Annotieren
und Zeichnen
» 5: Ansicht der verfügbaren
Annotationen zu einer
Zeichnung
» 6: Aktivitätspanel mit Anzeige
der Gesamt- und
Einzelbewertungen, sowie
Chat-Werkzeug
2
5
Abbildung 82: Mockup #3 - Oberfläche von SketchCoLab
Eigene Darstellung
118
SketchCoLab
Leinwand als zentraler Bestandteil der Anwendung erhält
konsequenterweise innerhalb von SketchCoLab im Verhältnis zu den anderen Informations- und Interaktionselementen
den größten Raum. Über die oberhalb und unterhalb der
Leinwand ein- und ausklappbaren Bereiche („Zeichnung
wählen“ und „Ansicht“) werden weitere Funktionen bei Bedarf und platzsparend zur Verfügung gestellt.
6
•••
Mockup #4 - Aktivitätspanel: Gesamtübersicht
Auf der rechten Seite der Anwendung erfolgt die Darstellung der Aktivitäten zu einer Zeichnung. Die drei verfügbaren Bereiche sind dabei „Gesamtbewertung“, „Einzelbewertungen“ und das Chat-Werkzeug. Die jeweiligen
Funktionen werden über ein ein- und ausklappbares „Akkordeon-Menü“ gesteuert, das zur Unterstützung der Übersichtlichkeit jeweils nur einen aktiven bzw. geöffneten Be-
reich erlaubt. Damit wird zusätzlich sichergestellt, dass für
die Anzeige der Informationen der größtmöglich zur Verfügung stehende Platz genutzt werden kann, was gerade
bei der Verwendung von SketchCoLab mit mobilen Geräten
einen wichtigen Aspekt darstellt.
1
» 1: Anzeige zur
Gesamtbewertung der
gewählten Zeichnung
» 2: Alle zu einer gewählten
Zeichnung vorhandenen
Bewertungen inkl.
2
» 3: Chat-Werkzeug mit Anzeige
der Textnachrichten der
einzelnen Nutzer
3
Abbildung 83: Mockup #4 - Aktivitätspanel
Eigene Darstellung
119
Gestaltungskonzept
SketchCoLab
•••
Mockup #5 - Aktivitätspanel: Gesamtbewertung
Zu jeder gewählten bzw. in die Leinwand geladenen Zeichnung wird im Aktivitätspanel die durchschnittliche Gesamtbewertung, sowie die entsprechende Anzahl aller bisher
abgegebenen Bewertungen der jeweiligen Zeichnung angezeigt. Sofern der Nutzer die Zeichnung noch nicht bewertet hat, zeigt SketchCoLab ebenfalls einen Button an,
der nach Aktivierung den Nutzer zum Bewertungsfenster
Abbildung 84: Mockup #5 - Aktivitätspanel Bereich Gesamtbewertung
Eigene Darstellung
120
SketchCoLab
führt (siehe Mockup #12 und Mockup #13).
•••
Mockup #6 - Aktivitätspanel: Einzelne Bewertungen
Alle bisher abgegebenen Bewertungen, sowie die dazugehörigen Bewertungskommentare werden dem Nutzer ebenfalls im Aktivitätspanel zur Verfügung gestellt. Überschreitet
die Anzahl der Bewertungen den verfügbaren Platz, so
kann der Anwender die Einträge durchscrollen. Die jeweils
zuletzt getätigte Bewertung wird dabei an erster Stelle
dargestellt. Die Darstellung der einzelnen Bewertung unterstützt die Awareness und dient als Kommunikations- und
Diskussionsgrundlage.
Abbildung 85: Mockup #6 - Aktivitätspanel Bereich Einzelbewertungen / Bewertungskommentare
Eigene Darstellung
121
Gestaltungskonzept
SketchCoLab
•••
Mockup #7 - Chat-Werkzeug
Das Chat-Werkzeug stellt das zentrale Kommunikationswerkzeug innerhalb von SketchCoLab dar. Während durch
Annotationen, Textboxen und Bewertungskommentare
zwar ebenfalls zumindest in geringer Ausprägung Kommunikation stattfindet bzw. stattfinden kann, bietet der Chat
eine sehr direkte Möglichkeit sich auszutauschen und dies
auf synchronem Weg. Im Prototyp ist die Chat-Funktion
Abbildung 86: Mockup #7 - Chat-Werkzeug
Eigene Darstellung
122
SketchCoLab
sehr rudimentär gehalten und ermöglicht die generelle
Kommunikation, ohne dass diese entsprechend kanalisiert
wird. In einer Weiterentwicklung von SketchCoLab wäre
es demnach sinnvoll die Funktionalität weiter auszubauen. Denkbar wären entsprechende Chat-Räume, die sich
auf ein Projekt, eine Teilnehmergruppe oder speziell auf
eine Zeichnung beziehen. Die Bedienung erfolgt durch die
Texteingabe im dafür vorgesehenen Eingabefeld.
•••
Mockup #8 - Textwerkzeug
Als ein weiteres Werkzeug zur Annotation stellt SketchCoLab
die Möglichkeit zur Verfügung, Zeichnungen mit Texthinweisen zu versehen. Der Nutzer kann nach dem Aktivieren des
Werkzeugs per Tastatur den gewünschten Text schreiben
und ihn anschließend auf der Zeichenfläche frei positionieren. Somit ist der Bezug zu bestimmten Details innerhalb
der Zeichnung sichergestellt und bleibt für andere Nutzer
beim Betrachten der jeweiligen Annotation nachvollziehbar. Bereits erstellte, jedoch nicht mehr benötigte Textboxen
können nachträglich (durch Double-Tap oder Doppelklick)
wieder entfernt werden. Die zu einer Annotation zugehörigen Textinformationen mit samt ihren Positionskoordinaten
(auf der Leinwand) werden in der Datenbank gespeichert
und stehen beim Laden der Annotationsversion wieder zur
Verfügung.
Abbildung 87: Mockup #8 - Textwerkzeug
Eigene Darstellung
123
Gestaltungskonzept
SketchCoLab
•••
Mockup #9 - Strichstärke und Strichfarbe
Um unterschiedliche Anforderungen während des Annotierens zu berücksichtigen, hat der Nutzer die Möglichkeit
zwischen jeweils drei verschiedenen Strichstärken und
Strichfarben zu wählen und diese miteinander zu kombinieren. So können beispielsweise wichtige Markierungen und
Informationen in der Farbe Rot dargestellt oder für filigrane
Annotationen die kleinste Strichstärke gewählt werden. Die
von SketchCoLab zur Verfügung gestellten Optionen stellen
dabei nur eine sehr reduzierte Auswahl dar. Denkbar sind
weitere Werkzeugoptionen wie eine größere Farbauswahl
oder verschiedene Pinselstricharten.
Abbildung 88: Mockup #9 - Werkzeugoptionen: Strichstärke und Strichfarbe
Eigene Darstellung
124
SketchCoLab
•••
Mockup #10 - Auswahl Projekt und Zeichnung
Die innerhalb von SketchCoLab zur Verfügung stehenden
Projekte bzw. die zu einem Projekt zugehörigen Zeichnungen können über das obere „Slider-Menü“ aufgerufen werden. Durch diese platzsparende Form der Interaktion kann
der Nutzer bei Bedarf auf diese Funktion zurückgreifen,
ohne dass diese permanent präsent ist und ggf. zur Unübersichtlichkeit oder Ablenkung beiträgt. Nach der Wahl
eines für den Nutzer zur Verfügung stehenden Projekts werden die darin enthaltenen Zeichnungen mit zusätzlichen
Informationen, wie der derzeitigen Durchschnittsbewertung
angezeigt und können ausgewählt werden. Sind eine größere Anzahl von Zeichnungen zu einem Projekt vorhanden,
können diese mit der „Swipe-Geste“ (nach links oder rechts
auf dem Touchscreen wischen) durchgeblättert werden.
Abbildung 89: Mockup #10 - Projektauswahl und Wahl der Zeichnung
Eigene Darstellung
125
Gestaltungskonzept
SketchCoLab
•••
Mockup #11 - Ansicht von Annotationen
Von Nutzern überarbeitete und gespeicherte Annotationsversionen zu einer bestimmten Zeichnung können über das
untere „Slider-Menü“ aufgerufen und eingesehen werden.
Dabei erhält der Anwender Informationen über den Urheber und das Erstellungsdatum der Annotation und hat darüber hinaus die Möglichkeit, eine beliebige zur Verfügung
stehende Annotationsversion zu überarbeiten und als neue
Abbildung 90: Mockup #11 - Ansicht von Annotationsversionen
Eigene Darstellung
126
SketchCoLab
Version abzuspeichern. Eine „Kopie“ der Originalzeichnung kann zudem jederzeit vom Nutzer aufgerufen, bearbeitet und als weitere Annotation gespeichert werden. Eine
zusätzliche Funktion ist das Vergrößern der Vorschaubilder
ohne die entsprechende Annotation auf die Leinwand laden zu müssen.
•••
Mockup #12 - Bewertung von Zeichnungen
Das Popup-Fenster zur Bewertung wird über den Bewertungsbutton im Aktivitätspanel (siehe Mockup #5) aufgerufen. Dabei erkennt SketchCoLab, ob ein Nutzer bereits eine
Zeichnung bewertet hat und bietet diese Funktion je nach
Status an. In einer zu Beginn der Gestaltungsphase entstandenen Variante der Bewertungsfunktion erhält der Nutzer
ausschließlich die Möglichkeit, die gerade gewählte Zeich-
nung mit Hilfe von Sternen zu bewerten bzw. diese Bewertung zu kommentieren. Per „Tap“ bzw. Klick kann die
Anzahl der Sterne und somit die Höhe der Bewertung gewählt werden. Gekoppelt mit dem „Rating“ der Zeichnung
ist die Abgabe eines Bewertungskommentars. Durch das
Bestätigen der Aktion über den „Bewerten-Button“ fließt die
Bewertung in die Datenbank ein und wird für alle Nutzer
sichtbar.
Abbildung 91: Mockup #12 - Bewertungs-Fenster (reduzierte Variante)
Eigene Darstellung
127
Gestaltungskonzept
SketchCoLab
•••
Mockup #13 - Bewertungsfenster (Erweitert)
Die erweiterte und in den Protoyp eingeflossene Version
des Bewertungsfensters stellt neben der Funktion der Bewertung und des Kommentierens ebenfalls die Möglichkeit
zur Verfügung, weitere noch nicht vom Nutzer bewertete
Zeichnungen einzusehen und diese ebenfalls innerhalb des
Popup-Fensters direkt zu bewerten. Dadurch soll der Nutzer während des Bewertungsprozesses motiviert werden,
Abbildung 92: Mockup #13 - Bewertungs-Fenster (erweiterte Variante)
Eigene Darstellung
128
SketchCoLab
sich mit weiteren dem Projekt zugehörigen Zeichnungen
zu beschäftigen. Bewertete Bilder werden nach dem Speichern aus der Anzeige innerhalb des Bewertungsfensters
entfernt, sodass dem Anwender eine ständig aktualisierte
Ansicht der noch nicht von ihm bewerteten Zeichnungen
zur Verfügung steht.
•••
Mockup #14 - Kommentare einsehen
Um den Anwendern neben dem Chat-Werkzeug eine weitere Form der Kommunikation an die Hand zu geben, war
wie bereits im Kapitel zum grundlegenden Prototyp-Konzept beschrieben, die Möglichkeit Bewertungen zu kommentieren vorgesehen. Dabei hätten Nutzer vorhandene
Kommentare zu einer Bewertung einsehen bzw. schreiben
können. Die Anzeige der Kommentare wäre dabei auf-
grund der Übersichtlichkeit in ein eigenes Popup-Fenster
verlagert worden, in dem Nutzer ggf. alle vorhandenen
Kommentare durchscrollen können. Gründe, auf diese
Funktionalität zu verzichten, wurden bereits im PrototypKonzept beschrieben.
Abbildung 93: Mockup #14 - Kommentar-Fenster
Eigene Darstellung
129
Gestaltungskonzept
SketchCoLab
•••
Mockup #15 - Kommentare abgeben
Kommentare zu verfassen ist innerhalb des Konzepts ebenfalls in Form eines Popup-Fensters vorgesehen gewesen.
Die Nutzer hätten nach Eingabe des gewünschten Texts
diesen gespeichert und somit für alle Nutzer sichtbar gemacht.
Abbildung 94: Mockup #15 - Popup-Fenster zur Kommentarabgabe
Eigene Darstellung
130
SketchCoLab
•••
3.4. Der Prototyp
mit einer Bildschirmauflösung von 1280 x 800 Pixel im
Querformat (Hochformat wird nicht unterstützt), passt sich
jedoch bezüglich der Breite dynamisch in einem gewissen Rahmen anderen Bildschirmauflösungen an. Es wird
empfohlen vor allem auf mobilen Endgeräten den Prototyp möglichst im Vollbildmodus des verwendeten Browsers
einzusetzen, um den maximalen zur Verfügung stehenden
Platz auszunutzen. Der Aspekt des „Responsive Designs“,
also der dynamischen Berücksichtigung der jeweiligen gerätespezifischen Eigenschaften wie Bildschirmauflösung,
Betrachtungswinkel (Hoch- oder Querformat), etc. wurde
im Rahmen der Umsetzung nicht realisiert, wäre jedoch als
Weiterführung und Optimierung des Projekts denkbar.
Durch den Einsatz von HTML und JavaScript ist die
Nutzung von SketchCoLab als Web-Applikation mit mobiler Geräteunterstützung plattformunabhängig und erfolgt
jeweils durch einen geeigneten Browser. Primäre Einsatzgeräte sind Desktop-Rechner, Notebooks, Netbooks und
speziell für den mobilen Bereich Tablet Computer. Für die
Nutzung auf Smartphones ist der Prototyp nicht ausgelegt,
Technische Rahmenbedingungen
Der in dieser Arbeit entstandene interaktive Prototyp ist als
funktionsfähige Version unter:
http://sketchcolab.thomas-soyter.de
abrufbar. Daneben sind alle relevanten Dateien der Anwendung auf der beiliegenden CD vorhanden, die jedoch
ohne einen geeigneten installierten Webserver mit Datenbankanbindung nicht direkt vom Datenträger lauffähig ist.
Der Prototyp wurde mit HTML5, JavaScript und CSS als
Formatierungssprache umgesetzt. Die Datenspeicherung
und der Datenzugriff der innerhalb der Anwendung von
den Nutzern erstellten dynamischen Daten erfolgt durch
den Einsatz von PHP und des Datenbanksystems MySQL.
Bei SketchCoLab handelt es sich um eine mobile Website, die als Web-App konzipiert wurde. Die Gestaltung des
Interfaces orientiert sich an der Auflösung des Testgeräts
Technische Fakten
Eingesetzte Technologien
Unterstützte Browser
• HTML5 (speziell Canvas-Objekt)
• Apple Safari
• JavaScript / AJAX
• Google Chrome
• PHP
• Mozilla Firefox
• MySQL
• Android Standardbrowser
Tabelle 11: Technische Daten zum entwickelten Prototyp
Eigene Darstellung
• Javascript Frameworks (jQuery und jQuery Mobile)
• Android Dolphin Browser
131
Der Prototyp
SketchCoLab
•••
da die stark reduzierte Anzeigefläche vor allem die Zeichnen-Funktionen zu sehr einschränken würde.
Auf ein umfangreiches „Cross-Browser-Testing“ (Optimierung der Darstellung für alle relevanten Browser) wurde
verzichtet, ist aber im Hinblick auf „Responsive Design“
und Barrierefreiheit, ein Aspekt der bei einer Realisation
über einen Prototyp hinaus, berücksichtigt werden sollte.
Folgende Browser (in ihrer jeweils neuesten Version)
wurden getestet und können zur Darstellung empfohlen
werden:
Desktop (Windows)
• Google Chrome
• Apple Safari
• Mozilla Firefox
Tablet Computer (Android)
• Android Standardbrowser
• Dolphin
Eingesetzte Frameworks
Zur Erleichterung der Entwicklung wurde auf JavaScriptFrameworks in Form von jQuery Mobile („touch-optimiertes“ Framework zur Abbildung von Interaktionen auf Tablet
Computern und Smarthphones) sowie jQuery als BasisFramework zurückgegriffen. Frameworks bieten einen Rahmen, mit deren Hilfe eine Anwendung erstellt werden kann
und die dem Programmierer wichtige Funktionen standardmäßig zur Verfügung stellt. Neben den eigentlichen Frameworks wurden bei der Umsetzung des Prototyps ebenfalls
Erweiterungen (Plugins) eingesetzt, die das jeweilige
Framework um zusätzlich benötigte Funktionen ergänzen.
132
SketchCoLab
Weblinks:
http://jquerymobile.com/
http://jquery.com/
Die Entscheidung auf HTML5 und Javascript als Technologie zu setzen hat zwei Gründe. Zunächst ist HTML5 eine
zukunftsträchtige und für Entwickler leicht zugängliche
Technik mit Potential, die in den nächsten Jahren in Kombination mit JavaScript weiter an Bedeutung gewinnen wird.
Die derzeitigen Möglichkeiten von HTML5 auszuloten stellt
daher einen interessanten Aspekt dar. Dabei ist vor allem
das in HTML5 eingeführte „Canvas-Objekt“ zu nennen, mit
dem es möglich ist auf einer definierten Leinwand (englisch:
Canvas) zu zeichnen bzw. grafische Objekte darzustellen ein Hauptbestandteil von SketchCoLab. Weiterer Faktor für
die Wahl sind die bereits angesprochenen vorhandenen
Frameworks wie jQuery und jQuery Mobile, welche die
Entwicklung mobiler Applikation erleichtern und unterstützen.
AJAX
Als Besonderheit ist die Realisation des Prototyps in der
Form zu erwähnen, dass die komplette Web-Applikation
ohne sichtbares Neuladen der Inhalte (keine Seitenwechsel) auskommt und somit dem Nutzer zusätzlich das Gefühl
vermittelt, eine Web-Anwendung und weniger eine Website zu bedienen. Technische Basis ist dabei der Einsatz von
AJAX (Asynchronous JavaScript and XML) in Verbindung
mit PHP um einen asynchronen Datenaustausch zwischen
Web-Client und Server zu ermöglichen und den Inhalt einer HTML-Seite zu verändern, während diese im Browser
dargestellt wird.
•••
Überblick
Tabelle 11 und Tabelle 12 zeigen abschließend einen Überblick über die technischen Spezifikationen, sowie die im
Prototyp abgebildeten Funktionen.
Hinweis: Wie bereits erwähnt, können Screenshots der
finalen Version auf der beiliegenden CD-ROM betrachtet
werden. Ebenfalls ist die Nutzung und Einsicht direkt online
(http://sketchcolab.thomas-soyter.de) möglich.
SketchCoLab Features
Annotation
Werkzeuge
Workflow
• Freiform-Stift
• Leinwand leeren
• Radierer
• Rückgängig machen von Arbeitsschritten
• Textwerkzeug (Textboxen)
• Wiederholen von Arbeitsschritten
• Wahl der Strichstärke (drei verschiedene Größen)
• Speichern
• Wahl der Strichfarbe (Freiform-Stift, drei verschiedene Farben)
• Möglichkeit, bestehende Annotationen zu überarbeiten
Bewertung
Werkzeuge
Workflow
• Rating durch Sterne
• Speichern
• Bewertungskommentare
• Freiform-Stift
• Textwerkzeug
Kollaboration, Kooperation und Kommunikation
• Chat-Werkzeug (synchron)
• Ständig aktualisierte Ansicht der abgegebenen Bewertungen
• Bewertungskommentare
• Informationen zur Awareness (wer hat wann was bewertet bzw. wer
hat wann welche Annotation erstellt)
• Ständig aktualisierte Ansicht der zur Verfügung stehenden
Annotationen
• Datenvorhaltung auf Webserver zur räumlich und zeitlich
unabhängigen Bereitstellung der Anwendung und Daten
Tabelle 12:: Überblick der Funktionen in SketchCoLab
Eigene Darstellung
133
Der Prototyp
SketchCoLab
•••
4 SCHLUSSBEMERKUNG
Ziel war es, im Rahmen dieser Abschlussarbeit einen interaktiven Prototyp zu entwickeln, der den iterativen Gestaltungsprozess bei der Überarbeitung und Bewertung von
grafischen Entwürfen unterstützt. Im Fokus der Entwicklung
und Konzeption stand die Realisation einer Anwendung,
die primär den Schwerpunkt auf mobile Geräte, speziell auf die Geräteklasse der Tablet Computer legt. Dabei
wurden zunächst verschiedene Möglichkeiten der Zusammenarbeit in Form von Kollaboration und Kooperation
untersucht sowie deren Unterschiede, Gemeinsamkeiten
und Vor- und Nachteile herausgearbeitet. Zusätzlich erfolgte die Betrachtung von Anforderungen, Chancen und
Schwierigkeiten, die bei der Verwendung computergestützter Anwendungen im Hinblick auf die Gruppenarbeit im
virtuellen Raum entstehen. Mit Hilfe eines Benchmarkings
verschiedener relevanter Applikationen und Ansätze wurden für den Prototyp denkbare Funktionen erarbeitet, die
teilweise eingeflossen sind. Zusätzlich wurde die Geräteklasse der Tablet Computer genauer betrachtet und deren
Möglichkeiten den Gestaltungsprozess zu fördern und zu
erleichtern, analysiert. Die Herausarbeitung der Unterschiede des Zeichnens im analogen, sowie im digitalen Kontext
waren weitere wichtige Aspekte.
Abschließend betrachtet zeigt sich, dass Kollaboration
und Kooperation als Formen der Zusammenarbeit jeweils
Vor- und Nachteile bieten und die Grenzen oft fließend
sind. Dies bestätigt auch die häufig wenig differenzierte
Betrachtungsweise der Begriffe im Alltag. Bei der Entwicklung von SketchCoLab wurden beide Möglichkeiten, gemeinsam Lösungen zu erarbeiten aufgegriffen, um somit
eine möglichst flexible Nutzung der Anwendung zu bieten.
Die Frage, ob Tablet Computer ein hilfreiches Instrument
im Gestaltungsprozess sind, kann nach intensiver Beschäftigung mit der Thematik positiv beantwortet werden. Gründe
dafür sind sowohl der Mobilitätsaspekt, als auch die immer
weiter fortschreitenden technischen Verbesserungen. Dazu
kommt, dass durch die direkte Form der Interaktion über
den Touchscreen das Nutzungserlebnis für den Anwender
noch ein Stück intuitiver wird. Die Übertragung bekannter
und etablierter analoger Arbeitstechniken in Form der stiftbasierten Eingabe ist dabei ein weiterer wichtiger Vorteil,
der gerade im gestalterischen Bereich besonders wiegt. Es
ist anzunehmen, dass die Bedeutung der Tablet Computer
in den nächsten Jahren weiter zunehmen wird und diese
Geräteform eine Vielzahl neuer bzw. bestehender Anwendungsgebiete erschließt.
Im Hinblick auf die technischen Herausforderungen hat
sich während der Entwicklung gezeigt, dass HTML5 in Verbindung mit Javascript eine adäquate Lösung zur Realisation einer Web-Applikation mit den erarbeiteten Anforderungen darstellt. Insbesondere das in HTML5 eingeführte
Canvas-Objekt ist dabei hervorzuheben, mit dem Entwickler und Anwender eine interessante Erweiterung des Webstandards an die Hand bekommen, die eine Vielzahl neuer
Anwendungsmöglichkeiten bietet. Gerade im Bereich der
Spieleprogrammierung, aber auch bezüglich Gestaltungstools kann daher noch einiges erwartet werden, wie bereits einige Beispiele im Internet demonstrieren.
135
Schlussbemerkung
SketchCoLab
•••
5 LITERATURVERZEICHNIS
AASL. (1996). From Cooperation to Collaboration. American Association of School Librarians (AASL). Retrieved January
10, 2012, from http://www.ala.org/aasl/sites/ala.org.aasl/files/content/conferencesandevents/confarchive/CoopToCollab.pdf
ARNDT, H. (2006). Integrierte Informationsarchitektur: Die Erfolgreiche Konzeption Professioneller Websites. Berlin [u.a.]:
Springer.
BITKOM. (2011). Tablet Computer erobern den Massenmarkt. BITKOM. Retrieved January 12, 2012, from http://www.
bitkom.org/files/documents/BITKOM_Presseinfo_Markt_fuer_Tablets_und_PCs_14_12_2011.pdf
BLICKENSTORFER, C. (2005). A Brief History of Tablet PCs. WebProNews - Breaking News in Tech, Search, Social, & Business. Retrieved January 22, 2012, from http://www.webpronews.com/a-brief-history-of-tablet-pcs-2005-12
BÖHRINGER, J., BÜHLER, P., & SCHLAICH, P. (2005). Kompendium der Mediengestaltung für Digital- und Printmedien (3.,
vollst. überarb. u. erw. Aufl.). Berlin [u.a.]: Springer.
BORGHOFF, U. M., & SCHLICHTER, J. H. (2000). Computer-Supported Cooperative Work. Berlin [u.a.]: Springer.
BRAMBERG, N. (Ed.). (2011). Tablet-PCs: Anhaltender Boom vorausgesagt. Beau Bassin: FastBook Publishing.
BUXTON, B. (2011). Multi-Touch Systems That I Have Known and Loved. Bill Buxton Home Page. Retrieved January 26,
2012, from http://billbuxton.com/multitouchOverview.html
BUXTON, W. (2007). Sketching User Experiences - Getting the Design Right and the Right Design. Amsterdam [u.a.]: Elsevier [u.a.].
CLIFTON, P., MAZALEK, A., SANFORD, J., RÉBOLA, C., LEE, S., & POWELL, N. (2011). SketchTop: Design Collaboration
on a Multi-Touch Tabletop. In Proceedings of the Fifth International Conference on Tangible, Embedded, and Embodied Interaction, TEI ’11 (pp. 333–336). New York: ACM Press.
137
Literaturverzeichnis
SketchCoLab
•••
CRAFT, B., & CAIRNS, P. (2009). Sketching sketching: Outlines of a Collaborative Design Method. In Proceedings of the
23rd British HCI Group Annual Conference on People and Computers: Celebrating People and Technology, BCS-HCI ’09
(pp. 65–72). Swinton: British Computer Society.
CREALYTICS. (2011). Statistik: Verkaufte Tablets weltweit (Q2 2010 - Q3 2011). Erfolgsbasiertes Suchmaschinenmarketing (SEM) - crealytics GmbH. Retrieved January 26, 2012, from http://www.crealytics.de/blog/2011/11/22/statistikverkaufte-tablets-weltweit-2010-201-ameyer/
DORAU, R. (2011). Emotionales Interaktionsdesign. Berlin [u.a.]: Springer.
DÖRNER, S. (2011). Geschichte des Tablets: Wie Xerox das iPad erfand - Handelsblatt. Handelsblatt.com - Nachrichten
aus Wirtschaft, Finanzen, Politik, Unternehmen und Märkten. Retrieved January 26, 2012, from http://www.handelsblatt.
com/technologie/it-tk/mobile-welt/geschichte-des-tablets-wie-xerox-das-ipad-erfand/3849944.html?slp=false&p=1&a=fals
e#image
DOURISH, P., & BELLOTTI, V. (1992). Awareness and Coordination in Shared Workspaces. In Proceedings of the 1992
ACM Conference on Computer-Supported Cooperative Work, CSCW ’92 (pp. 107–114). New York: ACM Press.
DUDEN. (1990). Duden 05. Das Fremdwörterbuch (5., neu bearb. und erw. Aufl.). Mannheim [u.a.]: Dudenverlag.
DUDEN. (2000). Duden 01. Die deutsche Rechtschreibung (22., völlig neu bearb. u. erw. Aufl.). Mannheim: Bibliographisches Institut & F.A. Brockhaus AG.
DUDEN. (2012). Duden | ko- | Bedeutung, Rechtschreibung, Herkunft. Duden online. Retrieved January 17, 2012, from
http://www.duden.de/rechtschreibung/ko_
ELLIS, C. A., GIBBS, S. J., & REIN, G. (1991). Groupware: Some Issues and Experiences. Communications of the ACM,
34(1), 39–58.
FROHNER, H. (2010). Social Tagging: Grundlagen, Anwendungen, Auswirkungen auf Wissensorganisation und soziale
Strukturen der User (1. Aufl.). Boizenburg: Verlag Werner Hülsbusch.
138
SketchCoLab
•••
GAVER, W., MORAN, T., MACLEAN, A., LÖVSTRAND, L., DOURISH, P., CARTER, K., & BUXTON, W. (1992). Realizing
a Video Environment: EuroPARC’s RAVE System. In Proceedings of the SIGCHI Conference on Human Factors in Computing
Systems, CHI ’92 (pp. 27–35). New York: ACM Press.
GEYER, F., JETTER, H.-C., PFEIL, U., & REITERER, H. (2010). Collaborative Sketching with Distributed Displays and Multimodal Interfaces. In ACM International Conference on Interactive Tabletops and Surfaces, ITS ’10 (pp. 259–260). New York:
ACM Press.
GREENBERG, S. (1991). Computer-Supported Cooperative Work and Groupware. San Diego: Academic Press Inc.
GREENBERG, S., GUTWIN, C., & COCKBURN, A. (1996). Awareness Through Fisheye Views in Relaxed-WYSIWIS Groupware. In Proceedings of the Conference on Graphics Interface ’96 (pp. 28–38). Toronto: Canadian Information Processing
Society.
GROSS, T., & KOCH, M. (2007). Computer-Supported Cooperative Work. München [u.a.]: Oldenbourg.
GRUDIN, J. (1994). CSCW: History and Focus. Computer, 27(5), 19-26.
GUTWIN, C., & GREENBERG, S. (1995). Support for Group Awareness in Real Time Desktop Conferences. In Proceedings
of the Second New Zealand Computer Science Research Students’ Conference, University of Waikato, Hamilton, New Zealand.
GUTWIN, C., & GREENBERG, S. (1996). Workspace Awareness for Groupware. Conference Companion on Human Factors in Computing Systems, CHI ’96 (pp. 208–209). New York: ACM Press.
GUTWIN, C., STARK, G., & GREENBERG, S. (1995). Support for Workspace Awareness in Educational Groupware. The
First International Conference on Computer Support for Collaborative Learning, CSCL ’95 (pp. 147–156). Hillsdale: L. Erlbaum Associates Inc.
HASENKAMP, U. (1994). CSCW - Computer Supported Cooperative Work - Informationssysteme für dezentralisierte Unternehmensstrukturen (1. Aufl.). Bonn [u.a.]: Addison-Wesley.
139
SketchCoLab
•••
HEBECKER, R., & EBBERT, C. (2010). Creation and Validation of Symbols with Purposeful Games and Online Survey. In
Proceedings of the 1st DESIRE Network Conference on Creativity and Innovation in Design, DESIRE ’10 (pp. 112–120).
Lancaster, UK.
HOOBER, S., & BERKMAN, E. (2011). Designing Mobile Interfaces (1. Aufl.). Sebastopol: O’Reilly Media.
HORNSTEIN, M., FISCHLER, A., PERTEK, M., & KOLLER, M. (2008). E-Collaboration - Mehrwerte durch moderne Kommunikationsmittel schaffen. Retrieved January 29, 2012, from http://www.namics.com/fileadmin/user_upload/pdf/Wissen/2008/Fachartikel/E-Collaboration.pdf
IMUK Institut für Medien und Konsumentenforschung. (2012). Aktuelle Ergebnisse aus der Typologie der Wünsche 2012.
Retrieved from January 26, 2012, http://www.imuk.de/branchenanalysen/ikt.html
JARRETT, R., & SU, P. (2009). Building Tablet PC Applications. Sebastopol: O’Reilly Media.
JOHANSEN, R. (1988). Groupware - Computer Support for Business Teams (2. Aufl.). New York [u.a.]: The Free Press [u.a.].
JOHANSEN, R. (1991). Teams for Tomorrow. Proceedings IEEE Hawai Intl. Conf. on System Sciences (pp. 520-534). Los
Alamitos: IEEE Computer Society Press.
KEPPLER, S. (2010). Eine kurze Geschichte des Tablet PC. 3sat.online. Retrieved January 26, 2012, from http://www.3sat.
de/page/?source=/neues/sendungen/magazin/149559/index.html
KVAN, T. (2000). Collaborative Design: What is it? Automation in Construction, 9(4), 409-415.
LANDAY, J. A., & MYERS, B. A. (2001). Sketching Interfaces: Toward More Human Interface Design. Computer, 34(3),
56–64.
LANGENSCHEIDT-LONGMAN. (2001). Longman Dictionary of Contemporary English (3. Ausgabe 1995, erweitert 2001.).
München: Longman Group Ltd.
MARQUARDT, M., & VOIGT, C. (2009). Wörterbuch Latein: Für Philosophie und Theologie (1. Aufl.). Darmstadt: Wissen-
140
SketchCoLab
•••
schaftliche Buchgesellschaft.
MCLEAN, P. (2011). The Inside Track on Apple’s Tablet: A History of Tablet Computing. AppleInsider | Apple news and rumors since 1997. Retrieved January 26, 2012, from http://www.appleinsider.com/articles/10/01/15/the_inside_track_
on_apples_tablet_a_history_of_tablet_computing.html&page=1
MÜLLER-PROVE, M. (2008). Modell und Anwendungsperspektive des Social Tagging. In B. Gaiser, T. Hampel, & S. Panke
(Eds.), Good Tags - Bad Tags: Social Tagging in der Wissensorganisation (pp. 15-22). Münster: Waxmann Verlag.
O.V. (2010). Gartner Says Worldwide Media Tablet Sales on Pace to Reach 19.5 Million Units in 2010. Technology Research | Gartner Inc. Retrieved January 26, 2012, from http://www.gartner.com/it/page.jsp?id=1452614
PLIMMER, B., & APPERLEY, M. (2002). Computer-Aided Sketching to Capture Preliminary Design. In Proceedings of the Third
Australasian Conference on User Interfaces - Volume 7, AUIC ’02 (pp. 9–12). Darlinghurst: Australian Computer Society Inc.
PLIMMER, B., CHANG, S. H.-H., DOSHI, M., LAYCOCK, L., & SENEVIRATNE, N. (2010). iAnnotate: Exploring Multi-User
Ink Annotation in Web Browsers. In Proceedings of the Eleventh Australasian Conference on User Interface - Volume 106,
AUIC ’10 (pp. 52–60). Darlinghurst: Australian Computer Society, Inc.
PLIMMER, B., GRUNDY, J., HOSKING, J., & PRIEST, R. (2006). Inking in the IDE: Experiences with Pen-based Design and
Annotation. In Proceedings of the Visual Languages and Human-Centric Computing (pp. 111–115). Washington: IEEE Computer Society.
PONS. (2012). Tablet: Englisch » Deutsch: PONS.eu. Wörterbuch, Deutsche Rechtschreibung und Textübersetzung von
PONS. Retrieved January 26, 2012, from http://de.pons.eu/dict/search/results/?q=tablet&l=deen&ie=%E2%98%A0
RIEDEWALD, S. (2003). Annotieren von grafischen Darstellungen auf dem Bildschirm (Dissertation). Freiburg: Albert-Ludwigs-Universität.
ROSCHELLE, J., & TEASLEY, S. (1995). The Construction of Shared Knowledge in Collaborative Problem Solving. In C. E.
O’Malley (Ed.), Computer Supported Collaborative Learning (pp. 69-97). Heidelberg: Springer.
ROSSON, M. B., & CARROLL, J. M. (2002). Usability Engineering: Scenario-Based Development of Human-Computer Inter-
141
SketchCoLab
•••
action. London: Academic Press Inc.
RUSSELL, B., TORRALBA, A., MURPHY, K., & FREEMAN, W. (2008). LabelMe: A Database and Web-Based Tool for Image
Annotation. International Journal of Computer Vision, 77(1), 157-173.
RUTENBECK, J., & RUTENBECK, J. B. (2006). Tech Terms: What Every Telecommunications and Digital Media Person
Should Know. Burlington: Focal Press.
SAFFER, D. (2009). Designing gestural interfaces (1. Aufl.). Beijing [u.a.]: O’Reilly.
SCHMIDT, F. (2010). Studie: Tablet-PCs verdrängen Netbooks. PCGH: Computer, IT-Technik und Spiele - PC Games Hardware Online. Retrieved January 26, 2012, from http://www.pcgameshardware.de/aid,754988/Studie-Tablet-PCs-verdraengen-Netbooks/Notebook-Netbook/News/
SCHRAGE, M. (1990). Shared minds. New York: Random House.
SCHULZE, C. (2010). Tablet PC vs. Tablet Computer wo ist der Unterschied? Mehr als nur ein iPad Blog - News, Tests und
Apps im Tablet Guide. Retrieved January 25, 2012, from http://www.tablet-guide.de/tablet/tablet-pc-oder-tablet-computer
SMITH, G. (2007). Tagging: People-Powered Metadata for the Social Web. Amsterdam: Addison-Wesley Longman.
STAPELKAMP, T. (2007). Screen- und Interfacedesign. Berlin [u.a.]: Springer.
STAPELKAMP, T. (2010). Interaction- und Interfacedesign. Berlin [u.a.]: Springer.
STOLLER-SCHAI, D. (2009). E-Collaboration: Die Gestaltung internetgestützter kollaborativer Handlungsfelder. Gestaltungsgrundlagen und praktische Beispiele für eigene Projekte. Südwestdeutscher Verlag für Hochschulschriften.
TEUFEL, S., SAUTER, C., MÜHLHERR, T., & BAUKNECHT, K. (1995). Computerunterstützung für die Gruppenarbeit. Bonn
[u.a.]: Addison-Wesley.
THISSEN, F. (2003). Kompendium Screen-Design - Effektiv informieren und kommunizieren mit Multimedia (3., überarb. und
142
SketchCoLab
•••
erw. Aufl.). Berlin [u.a.]: Springer.
TOMORROW FOCUS MEDIA (Ed.). (2011). Mobile Effects Mai 2011. Retrieved January 25, 2012, from http://www.
tomorrow-focus-media.de/uploads/tx_mjstudien/Mobile_Effects_29042011_01.pdf
TSCHANZ, A., SCHEIDEGGER, N., RÜEGSEGGER, P., & SIEBER, P. (2003). E-Collaboration: Internet-ABC für KMU. Retrieved January 25, 2012, from http://www.kmu.admin.ch/publikationen/00613/
TVERSKY, B. (1999). What does Drawing Reveal About Thinking? In J. S. Gero & B. Tversky (Eds.), Visual and Spatial Reasoning in Design (pp. 93-101). Presented at the Key Centre of Design Computing and Cognition, Sydney.
VIOLINO, B. (2007). Synchronous vs. Asynchronous Collaboration. AIIM - Your Information Management and Collaboration
Resource. Retrieved January 28, 2012, from http://www.aiim.org/Resources/Archive/Magazine/2007-Jan-Feb/32715
VON AHN, L., & DABBISH, L. (2004). Labeling images with a computer game. In Proceedings of the SIGCHI conference
on Human factors in computing systems, CHI ’04 (pp. 319–326). New York, NY, USA: ACM.
WEBER, W. (2007). Kompendium Informationsdesign (1. Aufl.). Berlin [u.a.]: Springer.
WEIBEL, N., SIGNER, B., NORRIE, M. C., HOFSTETTER, H., JETTER, H.-C., & REITERER, H. (2011). PaperSketch: A PaperDigital Collaborative Remote Sketching Tool. In Proceedings of the 16th international Conference on intelligent User Interfaces, IUI ’11 (pp. 155–164). New York: ACM Press.
WISSENMEDIA. (2012). Kon ... | wissen.de. Allgemeinbildung, Lexikon, Wörterbücher & amp; Reiseführer - wissen.de. Retrieved January 17, 2012, from http://www.wissen.de/wde/generator/wissen/ressorts/bildung/index,page=1167848.
html
143
SketchCoLab
•••
6 ANHANG
Die im Anhang befindlichen Abbildungen vermitteln einen groben Überblick über den Projektverlauf bzw. stellen wichtige
Meilensteine während der Konzeptions- und Gestaltungsphase dar. Neben grundlegenden Gedanken zur Eingrenzung und
Konkretisierung des Themas, sind dort ebenfalls den Gestaltungsprozess betreffende Scribbles zur Icon- und Interfacegestaltung zu finden.
145
Anhang
SketchCoLab
•••
K O L L A BO R AT I V E S Z E I C H N E N
BRAINS T ORM IN G M ÖG L IC H E A N S ÄT Z E U N D PROB L EM S T EL L U NG E N
Kollaboratives Zeichnen
zentral oder dezentral
(Kollaboratives) Bewerten
von Zeichnungen
Bachelorarbeit - Thomas Soyter IDB 7
Übearbeiten der
entsprechenden Zeichnungen
Testen der erarbeiteten
Lösung
1
Evaluation von bereits
vorhandenen Skizzen &
Zeichnungen
2
+
T
(kollaborative)
Überarbeitung
bestehender Skizzen &
Zeichnungen
1
Fragen und Ziele
2
3
Wie bringt man Evaluation und Überarbeitung
zusammen? Ist das ein iterativer Prozess?
Ist die Evaluation auf Arbeitsgruppen beschränkt
oder wird sie allgemein zugänglich behandelt
oder beides?
In wieweit darf eine Beeinflussung stattfinden? Bei
Evaluation an sich wohl eher nicht, aber bei der
Überarbeitung evtl. schon?
Welche Art der Evaluation? Wird die Zeichnung
an sich bewertet (wenn man Begriff weiss) oder
wird Übereinstimmung der Bildaussage gesucht?
Spielt bei der Evaluation der Kontext eine Rolle? Z.
B. wenn Arbeitsgruppe Symbole zu einem Thema
gezeichnet hat und diese dann bewertet?
Welche Art von Zeichnungen? Sind alle Arten
händischer Zeichnungen möglich oder sollte man
sich auf eine Art, z.B. Icons beschränken?
146
SketchCoLab
Anhang
•••
K O LL A BO R AT I V E S ZE I C H N E N
B R AI N S T O R M I N G M Ö G L I C H E A NSÄTZE U ND PROB L EMSTEL L U NGEN
Mögliche Themen bzw. Themenkombinationen
1
vorhandenen Skizzen
& Zeichnungen
1
2
vorhandenen Skizzen
& Zeichnungen
1
+
(Kollaborative) Überarbeitung bestehender
Skizzen & Zeichnungen
2
Kollaboratives Zeichnen mittels TabletPCs
1
+
vorhandenen Skizzen
& Zeichnungen
2
Kollaboratives Zeichnen mittels TabletPCs
+
3
vorhandenen Skizzen
& Zeichnungen
+
(Kollaborative) Überarbeitung bestehender
Skizzen & Zeichnungen
Fragen und Ziele
Welche Kombination macht am meisten Sinn bzw.
ist auch vom Workload zu schaffen?
Ist es besser sich auf einen Bereich in der Tiefe zu
konzentrieren, statt mehrere Themen weniger tief
zu betrachten?
Kann bei einer Kombination der Bereiche evtl.
eines tiefer als das oder die anderen betrachten?
147
Anhang
SketchCoLab
•••
K O L L A B O R AT I V E S Z E I C H N E N
BRAIN S T O R M I N G M Ö G L I C H E A N S ÄT Z E U N D P R O B L E M S T E L L U N G E N
Javascript / HTML5 /
CSS3 / PHP
Flex / Flashbuilder
Frameworks wie jQuery Mobile
Flash (AS3)
AIR
HTML5 / CSS3 /
JavaScript / PHP
plattformunabhängige Webapp
über WLAN und Internet
Hybridlösungen wie
PhoneGap oder Appcelerator
Möglichkeiten
der Umsetzung
native App
Technische Aspekte und
Fragen im Allgemeinen
und Speziellen
Datenaustausch und
Datentransfer
Java / C, C++
Datenbank auf Server im Internet
zur dezentralen Speicherung
Bluetooth
Datenbank auf zentralem Rechner
innerhalb eines Raumes
mobile Website
Handballen bei der Stifteingabe
evtl. problematisch
HTML / CSS /
JavaScript / PHP
kapazitiver
Bildschirm
Stifteingabe in Bezug auf
Zeichnen eher grob
keine Druckempfindlichkeit
Fragen und Ziele
Welche Form der Umsetzung macht am meisten
Sinn bzw. bietet die gewünschte Funktionalität?
Ist ein sinnvolles Zeichnen auf TabletPCs überhaupt
möglich? Oder nur das Scribbeln - reicht das?
Welche Form des Datenaustausches ist sinnvoll
bzw. am praktikabelsten?
Ist eine HTML5 / CSS3 - Lösung besser da Lernkurve weniger steil als AS3 oder AIR-Code?
Sind die technische Einschränkungen eines kapazitiven Bildschirms ein Problem bzw. umgehbar oder
soweit nicht entscheidend?
Ist der Einsatz eines Stiftes beim Zeichnen überhaupt sinnvoll (bei kapazitiven Screens)?
148
SketchCoLab
Anhang
•••
KO L L A B ORAT I VE S ZE I CHNEN
B RAI NSTO RMI NG MÖ GL I CHE A N S ÄT Z E UN D PROB LE M S T E LLUN G E N
Fragen und Ziele
Interfacedesign
gestalterische
Aspekte
Welche Möglichkeiten der Überarbeitung sind
sinnvoll bzw. förderlich?
Icondesign
Wie kann die Überarbeitung kollaborativ erfolgen? Muss sie dass oder sind mehrere Wege
möglich?
Interaktionsdesign
2
(kollaborative)
Überarbeitung
bestehender Skizzen &
Zeichnungen
Website, Webapp oder App?
technische
Aspekte
Nativ oder
plattformunabhängig (App)?
technische Umsetzung:
Flash, HTML5 / CSS3, etc.?
Ansätze für Überarbeitung von
grafischem Material?
konzeptionelle
Aspekte
Interaktionskonzept:
Multitouch, Mausbasiert, etc.?
Evaluation / Testen
der fertigen Anwendung?
+
Sollte ein Testing der entwickelten Lösung mit
einbezogen werden?
Wie kann beim Interaktionskonzept das Device
TabletPC möglichst optimal berücksichtigt werden?
Welche technischen Aspekten gilt es zu beachten
bzw. sind sinnvoll?
Gibt die reine Überarbeitung von Skizzen & Zeichnungen genügend her oder ist eine Verbindung mit
dem Evaluationsaspekt besser?
- Fokus auf TabletPC wg. des Zeichnens sinnvoll
- Überarbeitungsaspekt intereressant bzw. speziell
- Fokussierung nur auf die Überarbeitung etwas einengend
- thematisch für sich allein nicht so spannend
- Kollaborationsaspekt wieder mehr im Vordergrund
- echte Kollaboration mittels TabletPCs überhaupt möglich?
149
Anhang
SketchCoLab
•••
S K E T C HC OL A B
GRUNDLEGENDES ANWENDUNGSKONZEPT V. 1
Datenbasis in Form von bereits vorhandenen Zeichnungen (z.B. Scribbles von Icons, Wireframes von Prototypen, etc.)
-
Allgemein zugänglicher Bestand an Bildern
Allgemeine Nutzer und Gruppen mit jeweiligen Nutzern
Sets um Projekte bzw. Zeichnungen für bestimmte Gruppen zu organisieren
Login für Nutzer die in Gruppen organisiert sind
Zeichnen
- einfache Zeichnenwerkzeuge
iterativer Prozess
Überarbeiten
-
Annotationen / Überarbeitung
durch einfache Zeichnenwerkzeuge
evtl. Timeline / Verlauf um Prozess nachzuverfolgen
mehrere Ebenen (weniger destruktiv)
-
Bewerten
Taggen (allgemein und bestimmte Bereiche)
Annotieren als Bewertungsform
evtl. spielbasierte Bewertungsansätze
Rating?
-
Mehrere Nutzer
überarbeiten / bewerten
eine oder mehrere Zeichnungen
synchron oder asynchron
um gleiche / unterschiedliche Ziele zu verfolgen
Chat als synchrones Kommunikationswerkzeug
evtl. Audio / Video
einzelne und / oder gemeinsame Arbeitsfläche
Allgemein
- wie läuft die Kooperation und Kollaboration ab, damit
es möglichst optimal läuft?
- synchron oder asynchron bzw. gemischt?
- sind gemeinsame oder auch unterschiedliche Ziele und
Aufgaben zu erreichen (Kollaboration und Kooperation)
bzw. kann es auch gemischt sein?
- wann ist gegenseitige Beeinflussung sinnvoll / gewollt?
- Speichern der Ergebnisse (Originalbilder, überarbeitete und bewertete Bilder)
- Laden der Ergebnisse
Datenhandling der Ergebnisse
Technologien
HTML5 (Canvas)
jQuery Mobile für Interaktionen
CSS für Design
Websockets (oder Alternative) für Server-Client-Kommunikation (Multiuser)
PHP / MySQL / XML für Datensicherung und Benutzerfeedback
Interaktionen
-
Touchinteraktion (Single und Multitouch)
evtl. Gesten
Texteingabe per Tastatur (hardwareseitig, Touchtastatur?)
Stiftbasiert
Technische Basis
150
SketchCoLab
Anhang
•••
K O L L A B O R AT I V E S Z E I C H N E N
FRAGEN
Konzept allgemein
KOLLABORATIVES ZEICHNEN
FRAGEN
Konzept allgemein
Wie bringt man Evaluation und Überarbeitung
zusammen? Ist das ein iterativer Prozess?
Welche Art von Zeichnungen? Sind alle Arten
händischer Zeichnungen möglich oder sollte man
sich auf eine Art, z.B. Icons beschränken?
Welche Art der Evaluation? Wird die Zeichnung
an sich bewertet (wenn man Begriff weiss) oder
wird Übereinstimmung der Bildaussage gesucht?
Welche Ansätze der Evaluation sinnvoll?
(Spielerische sind verbreitet) - Ist eine Kombination
mehrerer versch. Ansätze sinnvoll / möglich?
Ist die Evaluation auf Arbeitsgruppen beschränkt
oder wird sie allgemein zugänglich behandelt
oder beides? (viele TN = viele Daten)
Kombination von Zeichnen, Überarbeiten und
Evaluation in einer Anwendung machbar?
(kompletter Workflow) oder besser nur Teilbereiche?
Spielt bei der Evaluation der Kontext eine Rolle? Z.
B. wenn Arbeitsgruppe Symbole zu einem Thema
gezeichnet hat und diese dann bewertet?
Muss bzw. sollte die Evaluation kollaborativ
stattfinden (wahrscheinlich ja)? Wie sieht es bei
der Überarbeitung aus?
In wieweit darf eine Beeinflussung stattfinden? Bei
Evaluation an sich wohl eher nicht, aber bei der
Überarbeitung evtl. schon?
Evaluation des Prototypen - Teil der BA oder
ausgelagert oder überhaupt?
151
Anhang
SketchCoLab
•••
Multitouch
Stifteingabe
Bilder
Interaktion
Dateien
Texteingabe
Sprache
Videos
HTML5
Technische Aspekte
Marker
XML
Radiergummi
JavaScript ( jQuery
Mobile)
Werkzeuge
Technologien
CSS
Pfeile
Textbox
PHP / MySQL
Strichstärke
Überarbeiten von
Zeichnungen
WebSockets
Freiform-Stift
Annotation
Farben
neue Zeichnung
Chat
Gesamte Zeichnung
Bereiche
Kommentare
Details der Zeichnung
Kommunikation
Videokonferenz
Audiokonferenz
Speichern
Timeline / Historie
Zoomen
User-Awareness
Veränderungen
Präsenz
Rückgängig und
Wiederherstellen
Awareness
Workflow
geschlossene
Bereiche
Workspace Awareness
Arbeitsfläche
SketchCoLab
Aktivitäten
Verschieben
Einzelne Elemente
gemeinsame
To-Do-Listen
Kollaboration und
Kooperation
Ebenen
mit Kommentaren
Doppelt verlinkte
Diskussion
mit Tags
Versions Management
Gesamte Zeichnung
Bereiche
Vergleichen
synchrone
Bearbeitung
Tagging
gemeinsamer
Arbeitsbereich
gegenseitige
Verlinkung
spielbasiertes
Tagging
asynchrone Bearbeitung
normales Tagging
individueller
Arbeitsbereich
emotionale Symbole
Annotation
Export als Bild
Server
Text
Sharing
Bewerten von
Zeichnungen
152
Gesamte Zeichnung
Kommentare
Email
Bereiche
Gesten
Interaktionsdesign
Symbole
SketchCoLab
Funktionskonzept
Inform.architektur
Interfacedesign
Anhang
Emotionen
Sterne
Rating
Umsetzung
Gesamte Zeichnung
GUI
Bereich
gegenseitige
Verlinkung
HTML5
Technische Aspekte
Marker
XML
Radiergummi
JavaScript ( jQuery
Mobile)
Werkzeuge
Technologien
CSS
•••
Pfeile
Textbox
PHP / MySQL
Strichstärke
Überarbeiten von
Zeichnungen
WebSockets
Freiform-Stift
Annotation
Farben
neue Zeichnung
Chat
Gesamte Zeichnung
Bereiche
Kommentare
Kommunikation
Videokonferenz
Audiokonferenz
Speichern
Timeline / Historie
Zoomen
User-Awareness
Veränderungen
Präsenz
Rückgängig und
Wiederherstellen
Awareness
Workflow
geschlossene
Bereiche
Workspace Awareness
Arbeitsfläche
SketchCoLab
Aktivitäten
Verschieben
Einzelne Elemente
gemeinsame
To-Do-Listen
Kollaboration und
Kooperation
Ebenen
mit Kommentaren
Doppelt verlinkte
Diskussion
mit Tags
Versions Management
Gesamte Zeichnung
Bereiche
Vergleichen
synchrone
Bearbeitung
Tagging
gemeinsamer
Arbeitsbereich
gegenseitige
Verlinkung
spielbasiertes
Tagging
asynchrone Bearbeitung
normales Tagging
individueller
Arbeitsbereich
emotionale Symbole
Annotation
Export als Bild
Server
Text
Sharing
Bewerten von
Zeichnungen
Gesamte Zeichnung
Kommentare
Email
Bereiche
gegenseitige
Verlinkung
Gesten
Interaktionsdesign
Symbole
Emotionen
Funktionskonzept
Interfacedesign
Inform.architektur
Sterne
Rating
Umsetzung
Gesamte Zeichnung
Bereich
GUI
Typgrafie
Gestaltung
Farben
153
Anhang
SketchCoLab
•••
154
SketchCoLab
Anhang
•••
155
Anhang
SketchCoLab
•••
156
SketchCoLab
Anhang
•••
157
Anhang
SketchCoLab
•••
158
SketchCoLab
Anhang
•••
159
Anhang
SketchCoLab
•••
160
SketchCoLab
Anhang
•••
161
Anhang
SketchCoLab
•••
162
SketchCoLab
Anhang
•••
163
Anhang
SketchCoLab