Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung...

Seminar / ProseminarPrototyping und Visualisierung

im Authoring und in der Softwareentwicklung

Sommersemester 2005Graphische Datenverarbeitung

Prof. Dr. KrömkerBetreuer: Silvan Reinhold, Ashraf Abu Baker

Seminar / ProseminarPrototyping und Visualisierung im Authoring und in der Softwareentwicklung2/46

Übersicht• Aufgabenstellung

• Visualisierung im Überblick

• Themen

• Allgemeine Tips

• Seminartermine

• 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!

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.

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

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 PowerPoint o.ä. in elektronischer Form für Beamer aufbereitet

• 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.ä.

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“

Das Visualisierungsproblem

8 0,000000001 0,392699083 0,785398164 1,178097246 1,570796328 1,963495409-6,283185307 -3,89977E-17 -3,80031E-17 -3,51103E-17 -3,05825E-17 -2,48267E-17 -1,83495E-17-5,890486225 -0,064966357 -0,063309414 -0,058490271 -0,050947482 -0,041358868 -0,030568489-5,497787144 -0,128616617 -0,125336296 -0,115795638 -0,100862862 -0,081879881 -0,060517717-5,105088062 -0,180972301 -0,176356667 -0,162932315 -0,141920886 -0,115210545 -0,085152531

-4,71238898 -0,212206591 -0,206794338 -0,191053056 -0,166415232 -0,135094911 -0,099849139-4,319689899 -0,213876356 -0,208421516 -0,192556372 -0,167724683 -0,136157917 -0,10063481-3,926990817 -0,180063263 -0,175470814 -0,162113894 -0,141208006 -0,114631834 -0,084724804-3,534291735 -0,108277262 -0,105515689 -0,097483786 -0,084912469 -0,068931446 -0,050947482-3,141592654 7,45788E-16 7,26767E-16 6,71445E-16 5,84857E-16 4,74783E-16 3,50914E-16-2,748893572 0,139213623 0,135663029 0,125336296 0,109173175 0,088626145 0,065503905

-2,35619449 0,300105439 0,292451357 0,270189823 0,235346677 0,191053056 0,141208006-1,963495408 0,470527982 0,458527335 0,423624019 0,368994303 0,299547417 0,221396582-1,570796327 0,636619772 0,620383013 0,573159168 0,499245695 0,405284734 0,299547417-1,178097245 0,784213304 0,764212224 0,706040032 0,614990505 0,499245694 0,368994303-0,785398163 0,900316316 0,877354071 0,810569469 0,706040032 0,573159168 0,423624019-0,392699082 0,974495358 0,949641203 0,877354071 0,764212224 0,620383013 0,4585273342,22045E-15 1 0,974495358 0,900316316 0,784213303 0,636619772 0,4705279820,392699082 0,974495358 0,949641203 0,877354071 0,764212224 0,620383013 0,4585273340,785398163 0,900316316 0,877354071 0,810569469 0,706040032 0,573159168 0,4236240191,178097245 0,784213304 0,764212224 0,706040032 0,614990505 0,499245694 0,3689943031,570796327 0,636619772 0,620383013 0,573159168 0,499245695 0,405284734 0,2995474171,963495408 0,470527982 0,458527335 0,423624019 0,368994303 0,299547417 0,221396582

2,35619449 0,300105439 0,292451357 0,270189823 0,235346677 0,191053056 0,141208006

Was ist dies?0,000000001 -6,283185307

-5,890486225

-5,497787144

-5,105088062

-4,71238898

-4,319689899

-3,926990817

-3,534291735

-3,141592654

-2,748893572

-2,35619449

-1,963495408

-1,570796327

-1,178097245

-0,785398163

-0,392699082

2,22045E-15

0,3926990820,785398163

1,178097245

1,570796327

oder dies?

0,000000001

0,392699083

0,785398164

1,178097246

1,570796328

1,963495409

2,356194491

2,748893573

3,141592655

3,534291736

3,926990818

4,3196899

4,712388981

5,105088063

5,497787145

5,890486226

6,283185308

6,675884397,068583472

7,461282553

7,853981635

Die 2D-sinc Funktion

660,000

1,9633,927

5,8907,854

-0,3-0,2-0,1

00,10,20,30,40,50,60,70,80,9

10,9-1

0,8-0,9

0,7-0,8

0,6-0,7

0,5-0,6

0,4-0,5

0,3-0,40,2-0,3

0,1-0,2

-0,1-0

-0,2--0,1

-0,3--0,2

Unscharfe Trennung(nach Card, Mackinlay, Shneiderman)

(Scientific) VisualizationThe 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 VisualizationThe 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

Beispiel: Scientific Visualization

Beispiel: Informationsvisualisierung

HierarchischeDaten

HyperbolicBrowser

http://www.lexisnexis.com/startree/interactiveview.asp

• 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

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, WebTOC etc.

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

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

4. Adaptive Spatial Hypertext

• Weiterentwicklung des WWW-Hypertextsystems

• 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

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

6. Erstellung multimedialer Inhalte für das Web

• Multimedia gewinnt an Bedeutung, WWW- und E-Learning-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, JavaScript, 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

10a.) Visualization using Flocking Boids PaperTime-Varying Data Visualization using Information Flocking BoidsAndrew Vande Moere

11. Visualisierung und Animation von Algorithmen

11a.) 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- View EditingMarc H. Brown.

11b.) 3D-Algorithm Animation Paper:

Algorithm Animation Using 3D Interactive Graphics

Marc H. Brown and John Hershberger

11c.) Visualiseirung in LearnalgorithmenPaper:Using Algorithm Visualization to Improve Students' Understanding of Parameter Passing Methods

Paper: http://csf11.acs.uwosh.edu/crew_project/MICSPaper.doc

Sonstige Quellen:http://mitpress.mit.edu/books/chapters/0262524112chap1.pdfhttp://callisto.tk.informatik.tu-darmstadt.de/Publications/2000/ITiCSE2000.pdf

• Themen

• Allgemeine Tips

• Seminartermine

Allgemeine TipsZiele 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

Allgemeine TipsFinden von Quellen und Informationen

Literaturrecherche im Internet, z.B.

– http://www.infovis.org

– Informatik-Zeitschriften wie ACMhttp://www.acm.org/dl

– Google findet (fast) alles

– Sprache: Englisch (z.B. „Visualisierung“ 212.000 Hits,„visualization“ 1.700.000 Hits)

Allgemeine TipsFinden 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, WS04/05)

Allgemeine TipsMö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/

Allgemeine TipsDie Ausarbeitung

• Gliederung (frühzeitig)

• Form

• Rechtschreibung und Grammatik

• Literaturreferenzen

• Vortrag nicht vergessen!

Allgemeine TipsDie 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).

Allgemeine TipsDie 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].

Allgemeine TipsDie 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. 2002a)

• Groß/Kleinschreibung englischer Titel: Jedes Sinnwort mit mehr als 3 Buchstaben wird groß geschrieben

Allgemeine TipsDer 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

Allgemeine TipsDer 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

• 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

Betreuer

Silvan Reinholdsreinhold@gdv.cs.uni-frankfurt.de

Ashraf Abu Bakerbaker@gdv.cs.uni-frankfurt.de

Danke für die AufmerksamkeitSilvan Reinhold (Raum 217)Ashraf Abu Baker (Raum 218)

Carl Bosch-HausVarrentrappstraße 40-42D-60486 Frankfurt am Mainhttp://www.gdv.cs.uni-frankfurt. de

Seminar / Proseminar Prototyping und Visualisierung im Authoring und in der Softwareentwicklung...

Documents

Prototyping Augmented Reality

Fachpraktikum Graphische Benutzungsoberflächen Sommersemester 2008

Graphische Datenverarbeitung - TU Dresden · PDF fileKomplexpraktikum. Graphische Datenverarbeitung „Project 8view“ Sommersemester 2009 . Realisierung einer Visualisierungs - und

Graphische Therapiedokumentation: Anwendung und Erfahrungen - Graphische Therapiedokumentation: Anwendung und Erfahrungen - Das Arbeitsmodell des Psychotherapeuten

Anforderungsanalyse - Grundlagen und Prototyping

Prolog und Einführung - gdv.informatik.uni-frankfurt.de · Prof. Dr.-Ing. Detlef Krömker Goethe-Universität, Frankfurt Graphische Datenverarbeitung Graphische Datenverarbeitung

Creative Commons Lizenzverwaltung in Open Learning Content Authoring & Management Plattform

Multi Agent Authoring Tool for Programming Autonomous Mobilerobocup.mi.fu-berlin.de/docs/anna_diplom_vortrag.pdf · MAAT - Multi Agent Authoring Tool, Diplomarbeit von Anna Egorova

Fabian Beier Graphische Gestaltung

Prototyping. Gliederung Prototyping allgemein Prototyping allgemein Experimentelles Prototyping Experimentelles Prototyping Exploratives Prototyping Exploratives

Prototyping-Methoden beim Redesign einer Website

USECON_Experience Design & Prototyping

Graphische Datenverarbeitung III

Theorie: Experience- & Video-prototyping · Prototyping als essenzielles Element im Porduktentwicklungszyklus… •Methode der Erkenntnissgewinnung bzgl. Machbarkeit bzw. Tragfähigkeit

Rapid prototyping

Prototyping for mobile

Graphische Datenverarbeitung · 1 Hier wird Wissen Wirklichkeit Graphische Datenverarbeitung Beleuchtungsrechnung Prof. Dr. Detlef Krömker Professur für Graphische Datenverarbeitung

Tutoriat - UI Prototyping | Strukturprototypen

Paper Prototyping in der Produktentwicklung

A method for the intelligent authoring