Seminar Proseminar Prototyping und Visualisierung im Authoring

Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung Sommersemester 2005 Graphische Datenverarbeitung Prof. Dr. Krömker Betreuer: Silvan Reinhold, Ashraf Abu Baker

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Aufgabenstellung (1) Einarbeitung in das gestellte Thema • Sie erhalten als Ausgangspunkt ggf. Artikel/Papers an die Hand • Suchen Sie im Internet und in Bibliotheken alle relevanten Informationen über Ihr gewähltes Thema • Machen Sie eine umfangreiche State-of-the-Art-Analyse • Finden Sie Defizite, überlegen Sie sich Möglichkeiten zur Verbesserung und tun Sie einen Blick in die Zukunft! Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 4/46

Aufgabenstellung (2) Verständnis des Themas • ausgeteilte Artikel, Links oder Suchbegriffe reichen i. d. R. nicht aus und sollten nur als Startpunkt verstanden werden! • Beschaffung weiterer Informationen zum Füllen von Lücken notwendig – – – aus den angegebenen Quellen aus dem Internet Bibliothek Software evtl. selbst ausprobieren etc. Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 5/46

Aufgabenstellung (3) Anfertigung einer schriftlichen Ausarbeitung • Umfang: 15 -20 Seiten pro Person • Sprache: Deutsch • Es handelt sich um eine wissenschaftliche Arbeit (Ausdrucksweise!) • Form, Rechtschreibung und Grammatik sind wichtig • Pro Teilnehmer mindestens 10 Literaturreferenzen Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 6/46

Aufgabenstellung (4) Präsentation in Form eines Vortrags vor Publikum • Pro Person 20 Minuten – 15 Minuten Vortrag – 5 Minuten anschließende Diskussion und Fragen • Sprache: Deutsch • Mit Power. Point o. ä. in elektronischer Form für Beamer aufbereitet Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 7/46

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Was ist Visualisierung? • Vorgang der Sichtbarmachung von Materie, Energie, Information oder Prozessen • In der Informatik reduziert auf – Daten – Informationen – Modelle – u. ä. Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 9/46

Warum Visualisierung? • Erforschung großer Datenmengen (Millionen von Meßwerten) • Betrachtung strukturell komplexer Daten • Erkennung von Mustern und Zusammenhängen in Datenbeständen • Wir können mehr sehen, als wir uns mental vorstellen können • „In der Tat ist der Mensch ein Augentier“ Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 10/46

Das Visualisierungsproblem

Was ist dies?

oder dies?

Die 2 D-sinc Funktion

Unscharfe Trennung (nach Card, Mackinlay, Shneiderman) (Scientific) Visualization The use of computer-supported, interactive, visual representations of data to amplify cognition. Daten sind oft technischen, naturwissenschaftlichen Ursprungs (Messung, Simulation) oft existiert „natürliche“ , naheliegende räumliche Repräsentation Information Visualization The use of computer-supported, interactive, visual representations of abstract data to amplify cognition. „allgemeinere“ Daten: Geschäftsdaten, Finanzdaten, „Dokumente“. . . oder Datenbankinhalte = strukturierte abstrakte Daten ohne „natürliche“ , naheliegende räumliche Repräsentation Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 15/46

Beispiel: Scientific Visualization Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 16/46

Beispiel: Informationsvisualisierung Hierarchische Daten Hyperbolic Browser http: //www. lexisnexis. com/startree/interactiveview. asp Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 17/46

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Themenüberblick • • 1. Visualisierung von Softwaresystemen, Web-Strukturen und komplexen Daten - • • 2. UML - Unified Modeling Language Daniela (Seminar) • • 3. Moderne Software-IDEs und GUI-Builder Hana, Lei • • 4. Adaptive Spatial Hypertext Lukas G. • • 5. Usability und E-Learning Tim, Jing • • 6. Erstellung multimedialer Inhalte für das Web Linda, Vincent/Christian • • 7. Fault Localization via Visualization Timon • • 8. Software-Visualisierung Philipp • • 9. Visualisierung in der OO-Softwareentwicklung Han (Seminar) • • 10. Visualization of Time-Varying Data for Source Code Version Control - • • 11. Visualisierung und Animation von Algorithmen Max//Lukas K. , Andreas (Seminar), Svetlana Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 19/46

1. Visualisierung von Softwaresystemen, Web. Strukturen und komplexen Daten • Komplexe Anwendungssysteme, Klassenbibliotheken, Web-Strukturen sind schwer überschaubar • Visualisierung kann Strukturen oder Veränderungen aufzeigen und Zusammenhänge verdeutlichen • Verschiedene Ansätze: Software Landscapes, Cone Trees, Treemaps, Hyperbolic Trees, Spatial Views, Perspective Walls, Web. TOC etc. Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 20/46

2. UML - Unified Modeling Language • Software-Entwicklungsprozess: Kommunikationsproblem zwischen Fach- und Technologieexperten sowie zwischen Entwicklern untereinander • Vereinheitlichte und allgemeiner verständliche Notation zur Darstellung von OO-Systemen • Darstellung eines SW-Systems auf unterschiedlichen Abstraktionsstufen und aus verschiedenen Blickwinkeln • Theoretischer Überblick und praktischer Einsatz im konkreten Verwendungskontext Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 21/46

3. Moderne Software-IDEs und GUI-Builder • Verwendung von GUIs und Visualisierung in der SW-Entwicklung • Syntax Highlighting, Code Completion, CASE-Tools, GUI-Builder etc. • Auch Web-IDEs müssen mehr und mehr technische Aspekte berücksichtigen • Evaluierung aktueller IDEs und Tools, Abstrahierung und Verallgemeinerung, Vergleich Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 22/46

4. Adaptive Spatial Hypertext • Weiterentwicklung des WWWHypertextsystems • Adaptive Hypertext: Modifikation von Inhalt und Struktur gemäß Benutzerprofil • Spatial Hypertext: Darstellung möglicher Beziehungen und impliziter Links • Einsatz bei der Vermittlung visueller Zusammenhänge • Anwendungsmöglichkeiten, Nutzen, Abgrenzung und Bewertung Prototyping und Visualisierung

5. Usability und E-Learning • Usability ist an der Schnittstelle zwischen Anwendung und Endnutzer zentral • Wichtig in der Softwareentwicklung • Besondere Relevanz für E-Learning-Entwickler: Benutzer ist Anwender und gleichzeitig Lernender • Überblick über den Themenbereich, Begriffsklärung • Hervorhebung von Herausforderungen im Allgemeinen sowie im Speziellen Kontext E-Learning Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 24/46

6. Erstellung multimedialer Inhalte für das Web • Multimedia gewinnt an Bedeutung, WWW- und ELearning-Inhalte nicht mehr nur statisch • Trennung von Inhalt und Präsentation • Verwendung von Templates, Metainformationen, Stylesheet-Transformationen, audiovisuellen Präsentationen, semantischen und maschinenlesbaren Informationen • Klassifikation und Überblick über existierende Standards wie XML, XSLT, CSS, SVG, RDF – SMIL, XAML – Flash, Java. Script, PHP, ASP. NET – etc.

7. Fault Localization via Visualization • Programmtests sind integraler Bestandteil der Softwareentwicklung • Test-Suites wie JUnit oder NUnit unterstützen den Entwickler beim Debugging • Konkrete Visualisierungsmethoden können die Fehlersuche durch Mapping von graphischer Darstellung zu Test-Case-Ergebnissen erleichtern

8. Software-Visualisierung • Taxonomien dienen der Strukturierung eines Themengebietes • Sie stellen eine gemeinsame Sprache oder Terminologie zur Verfügung • Spezielles Problemfeld hier: Systeme im Bereich der Visualisierung von Computersoftware • Aufbauend auf einer von Price, Baecker und Small entwickelten Taxonomie

9. Visualisierung in der OO-Softwareentwicklung • Visualisierungsmethoden in der Entwicklung und im Reengineering objektorientierter Softwareanwendungen • Berücksichtigung von Granularität der Visualisierung sowie von Evolutionsaspekten und von Metriken • Überblick, Anwendungsgebiete, Klassifizierung • Recherche basierend auf einer Dissertation zum Thema

10. Visualization of time-varying data for source code version control 10 a. ) Visualization using Flocking Boids Paper Time-Varying Data Visualization using Information Flocking Boids Andrew Vande Moere Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 29/46

11. Visualisierung und Animation von Algorithmen 11 a. ) Animation von Datenstrukturen, Graphalgorithmen, parallele Algorithmen, Sortieralgorithmen , Baumalgorithmen Paper: http: //www. cs. hope. edu/~alganim/ccaa/toronto. html Marc H. Brown and Marc Najork Zeus: A System for Algorithm Animation and Multi. Marc H. Brown. 11 b. ) 3 D-Algorithm Animation Paper: Algorithm Animation Using 3 D Interactive Graphics Marc H. Brown and John Hershberger View Editing

11 c. ) Visualiseirung in Learnalgorithmen Paper: Using Algorithm Visualization to Improve Students' Understanding of Parameter Passing Methods Paper: http: //csf 11. acs. uwosh. edu/crew_project/MICSPaper. doc Sonstige Quellen: http: //mitpress. mit. edu/books/chapters/0262524112 chap 1. pdf http: //callisto. tk. informatik. tu-darmstadt. de/Publications/2000/ITi. CSE 2000. pdf Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 31/46

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Allgemeine Tips Ziele des Seminars Erlernen akademischen Arbeitens, u. a. • Auseinandersetzung mit aktuellen Forschungsarbeiten • Verständliche Aufbereitung eines Themas • Weitervermittlung des Themas an die anderen Seminarteilnehmer rhetorisches Training • Korrekte Referenzierung Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 33/46

Allgemeine Tips Finden von Quellen und Informationen Literaturrecherche im Internet, z. B. – http: //www. infovis. org – Informatik-Zeitschriften wie ACM http: //www. acm. org/dl – Google findet (fast) alles – Sprache: Englisch (z. B. „Visualisierung“ 212. 000 Hits, „visualization“ 1. 700. 000 Hits) Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 34/46

Allgemeine Tips Finden von Quellen und Informationen Buchrecherche, z. B. • Schumann/Müller: Visualisierung Grundlagen und Methoden • Colin Ware: Information Visualization: Perception for Design (Academic Press 2000 / Morgan Kaufmann Publishers) • Robert Spence: Information Visualization (ACM Press 2001 / Addison Wesley) • Vorlesung „Visualisierung“ (Dr. Wolfgang Müller, WS 04/05) Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 35/46

Allgemeine Tips Mögliche Richtlinien Weitere Hilfestellungen (extern): http: //tech-www. informatik. uni-hamburg. de/lehre/richtlinien/proseminar. html http: //leguan. emp. paed. uni-muenchen. de/strategien/seminararbeiten/ Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 36/46

Allgemeine Tips Die Ausarbeitung • Gliederung (frühzeitig) • Form • Rechtschreibung und Grammatik • Literaturreferenzen • Vortrag nicht vergessen! Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 37/46

Allgemeine Tips Die Ausarbeitung – Zitate • Richtiges Verhältnis von Zitaten/Haupttext finden • Wörtliche Zitate „in Anführungszeichen“ • Bei sinngemäßen Zitaten auch stets die Quelle angeben! • Beispiel: In einen Satz kann man „ein wörtliches Zitat“ (Müller et al. 2003, S. 32) einfügen. Mann kann aber auch den Originaltext sinngemäß wiedergeben (Müller et al. 2003, S. 33). Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 38/46

Allgemeine Tips Die Ausarbeitung – Referenzen • Online Papers: T. J. Jankun-Kelly , Kwan-Liu Ma, (2003): Focus+Context Visualization and Interaction for Graphs with Visual Nodes. 2003 IEEE Symposium on Information Visualization • Bücher: Müller, H. (2003): Bioinformatik. Spektrum Akad. Verlag, Heidelberg. • Aufsätze in Büchern: Müller, H. (2003): Visualisierung von Daten. In: Meier, P. (Hrsg. ): Neue Methoden in der Bioinformatik. Wiley/VCH, Weinheim. 154 -176. • Webseiten*: Müller, H. (o. J. ): Informationsvisualisierung. http: //www. mueller. de/infovis. htm [04. 05. 2003]. Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 39/46

Allgemeine Tips Die Ausarbeitung – Literaturangaben • Literaturstellen alphabetisch sortieren nach Autor(en), dann nach Jahr • Bei mehreren Publikationen der selben Autoren innerhalb eines Jahres wird „a“, „b“, „c“ usw. an die Jahreszahl gestellt (z. B. 2002 a) • Groß/Kleinschreibung englischer Titel: Jedes Sinnwort mit mehr als 3 Buchstaben wird groß geschrieben Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 40/46

Allgemeine Tips Der Vortrag • Die anderen Teilnehmer sollen vom Vortrag profitieren • Den Wissenshorizont der Zuhörer beachten • Langsam und deutlich sprechen • Zeitrahmen einhalten (am besten Marken setzen) • Vortrag vorher einige Male üben (gibt Sicherheit) • Rechtzeitig vorbereiten, Generalprobe sinnvoll Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 41/46

Allgemeine Tips Der Vortrag – Folien • Folien nicht überladen • Text sollte auch von weit hinten sichtbar sein • Abbildungen einsetzen • Kontrast maximieren • auf Effekte verzichten (lenkt vom Inhalt ab) • man sollte jederzeit sehen können, wo man gerade im Vortrag ist (Titel, Gliederungspunkt, Foliennr. etc. ) • nur die Informationen auf die Folien packen, die auch benötigt werden Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 42/46

Übersicht • Aufgabenstellung • Visualisierung im Überblick • Themen • Allgemeine Tips • Seminartermine

Seminartermine 21. 04. 2005 – 1400 -1600 Themenvergabe 12. 05. 2005 – 1400 Gliederung und mindestens 5 Referenzen, per E-Mail an den Betreuer 26. 05. 2005 – 1400 Pflichtabgabe einer Zwischenversion, als Ausdruck und per E-Mail an den Betreuer 09. 06. 2005 – 1400 Abgabe der finalen Version, als Ausdruck und per E-Mail an den Betreuer 16. 06. 2005 – 1400 bis 1630 Präsentationstag 1 23. 06. 2005 – 1400 bis 1630 Präsentationstag 2 Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 44/46

Betreuer Silvan Reinhold sreinhold@gdv. cs. uni-frankfurt. de Ashraf Abu Baker baker@gdv. cs. uni-frankfurt. de Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 45/46

Danke für die Aufmerksamkeit Silvan Reinhold (Raum 217) Ashraf Abu Baker (Raum 218) Carl Bosch-Haus Varrentrappstraße 40 -42 D-60486 Frankfurt am Main http: //www. gdv. cs. uni-frankfurt. de Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung 46/46