Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der...

107
Diplomarbeit Visuelle Simulation eines Radiosity Algorithmus und ihre Anwendung in Lernprozessen eingereicht bei Prof. Dr.-Ing. Detlef Krömker, Professur für Graphische Datenverarbeitung von Jörg Karpf Eingereicht am 3. August 2009

Transcript of Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der...

Page 1: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Diplomarbeit

Visuelle Simulation eines RadiosityAlgorithmus und ihre Anwendung in

Lernprozessen

eingereicht bei

Prof. Dr.-Ing. Detlef Krömker,Professur für Graphische Datenverarbeitung

von

Jörg Karpf

Eingereicht am 3. August 2009

Page 2: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Eidesstattliche Erklärung

Ich erkläre hiermit an Eides statt, dass ich die vorliegende Arbeit selbstständig und ohneBenutzung anderer als der angegebenen Hilfsmittel angefertigt habe. Die aus fremdenQuellen direkt oder indirekt übernommenen Gedanken sind als solche kenntlich gemacht.Diese Arbeit wurde bisher keiner anderen Prüfungskommission in gleicher oder ähnlicherForm vorgelegt und auch nicht veröffentlicht.

Frankfurt am Main, den 23.7.2009

(Jörg Karpf)

II

Page 3: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Danksagung

Zu allererst danke ich meinen Eltern, die mich immer unterstützt, gefördert und mirden Rücken freigehalten haben. Ohne sie wäre das Studium unmöglich gewesen. Ichdanke meiner Freundin Vanessa, die unendliche Geduld mit mir hatte und immer zumir stand. Weiterhin danke ich Dipl. Inf. Sebastian Schäfer, der mich während dieserDiplomarbeit betreut hat und während meines ganzen Studiums immer als Mentor undFreund ein offenes Ohr für meine Probleme hatte. Mein Dank gilt ebenso Dipl. Inf.Daniel Schiffner, der mich ebenfalls während dieser Arbeit sehr engagiert betreut hat.Nicht zuletzt bedanke ich mich bei Prof. Dr.-Ing. Detlef Krömker, der diese Arbeit erstermöglicht hat sowie bei allen Korrekturlesern.

III

Page 4: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Zusammenfassung

Radiosity ist ein globales Beleuchtungsverfahren zur Berechnung diffuser Interobjektre-flektionen in einer computergenerierten 3D-Szene. Erstmals vorgestellt wurde das Ver-fahren 1984, dennoch ist es selbst mit heutigen Rechenleistungen aufgrund des hohenSpeicher- und Laufzeitbedarfs nicht möglich, Radiosity in Echtzeit zu berechnen.E-Learning gewinnt an Universitäten, Schulen, aber auch an Ausbildungsstätten immermehr an Bedeutung. Maßgeblich für den Lernerfolg ist, wie die Informationen präsentiertwerden. Das Erlernen und Verstehen des Radiosity-Verfahrens stellt durch seine komplexeStruktur und Arbeitsweise im dreidimensionalen Raum besonders hohe Anforderungenan den Lernenden, sodaß eine geeignete Visualisierung des Verfahrens wichtig ist.Das Ziel dieser Diplomarbeit ist es, ein Radiosity-Verfahren zu implementieren und es alsvisuelle Simulation zur Verwendung in Lernprozessen nutzbar zu machen. Es wird mitJava und Java 3D eine Lernanwendung implementiert, die eine 3D-Visualisierung desProgressive Refinement Radiosity in der Gathering-Variante mittels Hemi-Cube enthält.Die Lernanwendung wird durch einen mit dem Autorensystem LernBar [LerBa] erstell-ten, begleitenden E-Learning-Kurs ergänzt. Der Kurs ermöglicht in Verbindung mit derLernanwendung angeleitetes Lernen, und ist mit Fragen angereichert, durch die der Ler-nende seinen Lernfortschritt überprüfen kann.Die Zielgruppe der Lernanwendung und des Kurses sind Informatikstudenten, die überGrundlagenwissen im Bereich der Computergrafik verfügen. Die Lernanwendung ermög-licht es dem Lernenden, die Berechnung des Verfahrens schrittweise, animiert und inter-aktiv nachzuvollziehen. Zusammen mit dem Kurs, soll die Lernanwendung dem Benutzerermöglichen, das Radiosity-Verfahren zu erlernen und die zu dessen Berechnung nötigenEinzelschritte zu verstehen.

IV

Page 5: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Abstract

Radiosity is a global illumination method for calculating diffuse interobject reflectionsof a 3D computer generated scene. The algorithm was first presented in 1983, but stilltoday, computer power isn´t able to run it in real-time (for a complex scene).In the recent years e-learning got more and more important for academic teaching. Themost relevant point for successful learning is the special way information is presented.Radiosity is due to its complex structure and three-dimensional functionality very hardto learn and understand, so that a suitable visualization of the procedure is very import-ant.The goal of this diploma thesis is to implement a radiosity procedure and make it usableas a visual simulation, which can be used for learning purpose. An e-learning applicati-on, which consists of a 3D visualization of a gathering progressive refinement radiositymethod, will be implemented with Java and Java 3D. Additionally an e-learning course,which is created by the authoring system LernBar, is provided. This course is enrichedwith questions, by which the learning progress can be examined by the pupil himself.Together with the e-learning application, it can be used for instructed learning. The ap-plications and courses target group are computer science students with basic knowledgein computer graphics and related topics. The e-learning application shows the learnerthe radiosity method gradually, animated and interactively. The e-learning application,together with the e-learning course, should enable the user to learn and understand theradiosity methode and the necessary single steps for its computation.

V

Page 6: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Inhaltsverzeichnis

1 Einleitung 11.1 Motivation und Ziel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.2 Aufbau der Arbeit . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2

2 Grundlagen 42.1 Java 3D . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42.2 Flat-Shading . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52.3 Gouraud-Shading . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52.4 Beleuchtungsrechnung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2.4.1 Diffuse Beleuchtung . . . . . . . . . . . . . . . . . . . . . . . . . . 72.4.2 Spiegelnde Beleuchtung . . . . . . . . . . . . . . . . . . . . . . . . 72.4.3 Ambiente Beleuchtung . . . . . . . . . . . . . . . . . . . . . . . . . 8

2.5 Globale Beleuchtungsrechnung . . . . . . . . . . . . . . . . . . . . . . . . 92.5.1 Radiosity . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92.5.2 Nusselt-Analogon . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142.5.3 Hemi-Cube-Verfahren . . . . . . . . . . . . . . . . . . . . . . . . . 142.5.4 Progressive Refinement . . . . . . . . . . . . . . . . . . . . . . . . 16

2.6 E-Learning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

3 State of the Art 213.1 CourseLab . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223.2 LernBar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243.3 Adobe Director . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 263.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten . . . . . 283.5 Simulation und Visualisierung von Radiosity . . . . . . . . . . . . . . . . . 323.6 Zusammenfassung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

4 Konzept 384.1 Anforderungsanalyse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 384.2 Ablauf der Lernanwendung und des Kurses . . . . . . . . . . . . . . . . . 404.3 Navigation in 3D . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

VI

Page 7: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Inhaltsverzeichnis

4.4 Entwurf des Graphical User Interfaces (GUI) . . . . . . . . . . . . . . . . 424.5 Vorrendern der Szene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 444.6 Darstellung der mit Radiosity gerenderten Szene . . . . . . . . . . . . . . 45

5 Umsetzung 475.1 Aufbau der Lernanwendung . . . . . . . . . . . . . . . . . . . . . . . . . . 475.2 Erstellung des Graphical User Interfaces (GUI) . . . . . . . . . . . . . . . 495.3 Erstellung der 3D-Szenen . . . . . . . . . . . . . . . . . . . . . . . . . . . 535.4 Aufbau und Funktionsweise des Radiosity-Renderers . . . . . . . . . . . . 555.5 Darstellung der 3D-Szene . . . . . . . . . . . . . . . . . . . . . . . . . . . 595.6 Umsetzung der Lernziele . . . . . . . . . . . . . . . . . . . . . . . . . . . . 635.7 Erstellung des LernBar-Kurses . . . . . . . . . . . . . . . . . . . . . . . . 67

6 Bewertung und Ausblick 706.1 Bewertung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 706.2 Die Zukunft von 3D-Simulationen und 3D-Visualisierungen im Bereich des

E-Learnings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72

Literaturverzeichnis 75

A Anhang 81A.1 LernBar-Kurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81

VII

Page 8: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Abbildungsverzeichnis

2.1 Eine mit Flat-Shading dargestellte Szene . . . . . . . . . . . . . . . . . . . 52.2 Zwei mit Gouraud schattierte Kugeln . . . . . . . . . . . . . . . . . . . . . 62.3 Beleuchtungsvektoren . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72.4 Eine mit Phong-Shading beleuchtete Kugel (übernommen von [PHOSP]

und modifiziert) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82.5 Geometrie zur Berechnung eines Formfaktors (übernommen von [Hem85]) 122.6 Drei mit Radiosity beleuchtete Kugeln (übernommen von [RADSP]) . . . 122.7 Glass Szene gerendert mit POV-Ray (übernommen von [RADPR]) . . . . 132.8 Projektion auf einen Hemi-Cube (übernommen von [HemPR]) . . . . . . . 162.9 Progressive Refinement-Radiosity Iterationsschritte: Reflektionen des Lich-

tes in Abhängigkeit des Iterationsschrittes . . . . . . . . . . . . . . . . . . 18

3.1 Entwicklungsumgebung von CourseLab (übernommen von [CLABB]) . . . 233.2 Ein mit der LernBar entwickelter Kurs (übernommen von [LeBar]) . . . . 253.3 Entwicklungsumgebung von Adobe Director (Screenshot lokal ausgeführte

Anwendung) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273.4 Visualisierung von Bubbelsort in JHAVÉ (Screenshot lokal ausgeführte

Anwendung) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293.5 Visualisierung von Progressive-Refinement-Radiosity (Screenshot von

[WSIP1]) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 323.6 Interaktive Visualisierung von Progressive-Refinement-Radiosity

(Screenshot von [WSIP2]) . . . . . . . . . . . . . . . . . . . . . . . . . . . 333.7 Interaktive Visualisierung einer Radiosity-Variante (übernommen von

[RAGDR]) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 353.8 Das Radiosity-Visualisierungs-Tool radvis (übernommen von [RAVIS]) . . 35

4.1 Zwei Entwürfe des GUI der Lernanwendung . . . . . . . . . . . . . . . . . 42

5.1 Klassen der Lernanwendung mit ihren wichtigsten Attributen und Methoden 485.2 Graphical User Interface der Lernanwendung . . . . . . . . . . . . . . . . 50

VIII

Page 9: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Abbildungsverzeichnis

5.3 GUI-Elemente. Links: voll expandierter Navigation-Tree; Rechts: Pseudo-Code-Fenster mit Syntaxhighlighting . . . . . . . . . . . . . . . . . . . . . 51

5.4 Oben: Ansicht-Menü bei ausreichendem Abstand zur 3D-Ansicht; Unten:Überlagerung des Ansicht-Menüs durch die 3D-Ansicht. . . . . . . . . . . 52

5.5 Vorgegebene Kamera-Ansichten 1-5 von links nach rechts. . . . . . . . . . 535.6 Flat-Shading-Darstellung Szene 1 (oben) und Szene 2 (unten) in den De-

tailgraden (von links): Niedrig, Medium, Hoch. . . . . . . . . . . . . . . . 545.7 Gouraud-Shading-Darstellung Szene 1 (oben) und Szene 2 (unten) nach

den Iterationsschritten (von links): 1-5; Detailgrad: Hoch . . . . . . . . . . 595.8 Mit Radiosity gerenderte Szene. Links: Original; Mitte: Ambient-Term;

Rechts: Kontrasterhöhung . . . . . . . . . . . . . . . . . . . . . . . . . . . 605.9 Auswirkung des Rundungsfehlers auf das Gouraud-Shading in Szene 1;

Detailgrad: Hoch; links ohne Beschränkung der Anzahl der Nachkommas-tellen; rechts Beschränkung auf sieben Nachkommastellen . . . . . . . . . 62

5.10 Anordnung und Unterteilung der Lernanwendungsschritte, veranschau-licht durch den voll expandierten Navigation-Tree . . . . . . . . . . . . . . 64

5.11 Darstellung der Projektion auf die Unterseite des Hemi-Cubes . . . . . . . 665.12 Anweisung des LernBar-Kurses in Bildform . . . . . . . . . . . . . . . . . 685.13 Eine Seite des Kurses . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69

Abbildungen ohne Quellenangabe oder mit (Screenshot) gekennzeichnete, sind vom Autorselbst erstellt.

IX

Page 10: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

1 Einleitung

1.1 Motivation und Ziel

„Ein Bild sagt mehr als tausend Worte.“

Konfuzius

Seit der Entwicklung des modernen Computers durch Konrad Zuse findet eine zunehmen-de Digitalisierung unseres Alltags statt. Der Computer erhält in allen Bereichen unseresLebens immer mehr Einzug. Selbst im Bereich des Lehrens und Lernens wächst die Be-deutung des Computers, in Form des E-Learnings, permanent.Mit der Entwicklung von Autorensystemen wurde es erstmals einer breiten Masse an Au-toren auch ohne Programmierkenntnisse ermöglicht, E-Learning-Kurse zu erstellen. Vieleuniversitären Vorlesungen werden schon seit längerem mit Foliensätzen angereichert, dieam Computer entworfenen wurden. Aus diesen Foliensätzen lassen sich mit gängigen Au-torensystemen leicht E-Learning-Kurse zur Ergänzung der Präsenzlehre erstellen.Die meisten existierenden E-Learning-Kurse präsentieren ihre Inhalte ausschließlich in2D. Jedoch existieren, besonders im Bereich der Computergrafik, Algorithmen und Ver-fahren die im Dreidimensionalen arbeiten. Eines dieser Verfahren ist das globale Beleuch-tungsverfahren Radiosity. Es erhöht durch die Berechnung von diffuser Interobjektreflek-tionen den Realitätsgrad einer 3D-Szene. Zum Einsatz kommt das Radiosity-Verfahrenin Computerspielen, Animationen, (Animations-)Filmen und in der Beleuchtungsplanungvon Gebäuden.Die Arbeitsweise des Radiosity-Verfahrens ist sehr komplex. Die Details und Auswirkun-gen von Radiosity sind in Form von 2D-Darstellungen nur schwer zu erlernen. Durch dasDarstellen komplexer Sachverhalte in 3D-Visualisierungen oder 3D-Animationen sind dieZusammenhänge und Vorgehensweisen oft besser wahrnehmbar und leichter zu verste-hen. Besonders bei komplexen Algorithmen, die im Dreidimensionalen arbeiten, wie demRadiosity-Verfahren, bietet sich zur Darstellung und Erläuterung eine 3D-Visualisierung

1

Page 11: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

1.2 Aufbau der Arbeit

an. Viele existierende Erklärungen, wie z.B. [Rad84] und [Hem85], sind durch ihre ehertheoretische und mathematische Darstellung wenig anschaulich. Daher ist die Idee nahe-liegend das Radiosity-Verfahren als visuelle 3D-Simulation zu implementieren, und sie inLernprozessen nutzbar zu machen. Genau darum geht es in dieser Diplomarbeit.Ziel dieser Diplomarbeit ist die Implementierung einer visuellen Simulation eines Radiosi-ty Algorithmus und ihre Anwendung in Lernprozessen, d.h., es soll eine 3D-Lernanwendungkonzipiert und implementiert werden, die als Lerninhalt ein Radiosity-Verfahren be-schreibt und erklärt. Angeleitetes Lernen soll durch die Erstellung eines E-Learning-Kurses in einem Autorensystem umgesetzt werden. Der Kurs soll mit Fragen angereichertwerden, die es dem Lernenden ermöglichen seinen Lernfortschritt zu überprüfen.

1.2 Aufbau der Arbeit

Im nachfolgendem Kapitel 2 beschäftigen wir uns zunächst mit den Grundlagen. Die Java3D-Klassenbibliothek, mit der die Lernanwendung implementiert wurde, wird vorgestellt.Es wird kurz auf Flat- und Gouraud-Shading eingegangen. Die lokale und globale Be-leuchtungsrechnung und verschiedene Verfahren zur Berechnung von Radiosity werdenvorgestellt. Der letzte Abschnitt des Kapitels beschäftigt sich mit E-Learning, insbeson-dere mit der Kategorisierung von Lernanwendungen nach ihren technischen Merkmalenund ihrem Interaktionsgrad.In der State of the Art-Analyse in Kapitel 3 werden verschiedene Autorensysteme vorge-stellt und deren Vor- und Nachteile erläutert. Weiterhin werden existierende Visualisie-rungen von Computergrafik-Algorithmen sowie Simulationen und Visualisierungen desRadiosity-Verfahrens vorgestellt und ihr didaktischer Wert diskutiert.Anschließend wird in Kapitel 4 eine Anforderungsanlyse vorgenommen. Es wird u.a. dasKonzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf der Lernanwendung und des Kurses wird festgelegtund in Lektionen eingeteilt. Es werden Entwürfe zum Design des GUIs1, die sich anDesignrichtlinien orientieren, vorgestellt und verglichen. Ein Konzept zur Vermeidungvon Problemen, die mit der Navigation in einer 3D-Szene einhergehen, wird erläutert.Außerdem wird der Aufbau und die Erstellung der in der Lernanwendung verwendeten3D-Szenen beschrieben und ein Konzept zum Vorrendern und Speichern der mit Radio-sity gerenderten Szenen vorgestellt.In Kapitel 5 wird die Umsetzung der in Kapitel 4 vorgestellten Konzepte zum Aufbau derLernanwendung und des Kurses sowie zum Design des GUIs der Lernanwendung gezeigt.

1GUI ist die Abkürzung von Graphical User Interface, also für grafische Benutzeroberfläche.

2

Page 12: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

1.2 Aufbau der Arbeit

Es wird detailiert beschrieben, wie die Lernziele umgesetzt werden. Außerdem wird dieImplementierung eines eigenen Radiosity-Renderers mit Java und Java 3D vorgestellt.Die dabei entstandene Probleme und deren Lösungen bzw. Umgehungen werden erläu-tert.Den Abschluß bildet Kapitel 6, in dem eine Bewertung der implementierten Lernanwen-dung und des erstellten Kurses stattfindet. Im letzten Abschnitt wird ein Ausblick aufdie Zukunft von 3D-Simulationen und 3D-Visualisierungen im Bereich des E-Learningsgegeben.

3

Page 13: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2 Grundlagen

„Es ist nichts furchtbarer anzuschauen als grenzenlose Tätigkeit ohne Fundament.“

Johann Wolfgang von Goethe, Maximen und Reflexionen

Um unseren folgenden „Tätigkeiten“ ein Fundament zu schaffen, beschäftigen wir unszunächst mit den Grundlagen.

2.1 Java 3D

Java 3D ist eine vollständig objektorientierte Klassenbibliothek für Java, die es erlaubt,3D-Grafiken zu entwickeln. Dazu wird ein Szenegraph erstellt, der es ermöglicht, Szenen-bestandteile als Objekte zu betrachten und zu verwenden. Genau wie in Java sind diedarin entwickelten Anwendungen plattformunabhägig. Die Klassenbibliothek setzt aufOpenGL2 sowie Direct3D3 auf und kapselt deren Funktionalität. Ein Nachteil daran ist,daß nur die Funktionalität zur Verfügung steht, die in der aktuellen Java 3D-Versiongekapselt wird. Ein direkter Zugriff auf OpenGL bzw. Direct3D ist nicht vorgesehen. DieVersion 1.0 wurde 1998 von Sun Microsystems entwickelt. Seit 2004 wurde die Entwick-lung von Java 3D zu Gunsten von JavaFX4, das jedoch noch keine 3D-Unterstützungbereitstellt, eingestellt. Der Quellcode von Java 3D ist seit dem Open-Source und wirdvon der Java 3D-Community weiter entwickelt, wobei sich diese Weiterentwicklung bishergrößtenteils auf Bugfixes beschränkt. Die aktuelle Version 1.5.2 wurde 2008 herausgege-ben.

2OpenGL (Open Graphics Library) ist eine Programmierschnittstelle für die Programmierung vonportablen 2D- und 3D-Grafikanwendungen. Weitere Informationen siehe: http://www.opengl.org/.

3Direct3D ist eine von Microsoft entwickelte Programmierschnittstelle für die Programmierung von 2D-und 3D-Grafikanwendungen unter Microsoft Windows.

4JavaFx ermöglicht die Entwicklung von sog. Rich Internet Applications, d.h. von Online-Anwendungen,in die multimediale Daten eingebunden werden können. Weitere Informationen siehe: http://www.sun.com/software/javafx/.

4

Page 14: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.2 Flat-Shading

2.2 Flat-Shading

Das Flat-Shading ist die einfachste Form des Shadings. Jede einzelne Fläche eines Po-lygons hat eine einheitliche Farbe. Es werden keine Farbverläufe zwischen Polygoneck-punkten berechnet. Dies führt zu einem facettierten Erscheinugsbild der Szene, wie inAbbildung 2.1 zu sehen ist.

Abbildung 2.1: Eine mit Flat-Shading dargestellte Szene

2.3 Gouraud-Shading

Das Gouraud-Shading wurde nach Henri Gouraud benannt und erstmals 1971 vorgestellt[Gou71]. Es basiert auf Vertex-Shading, d.h., die Farben der Eckpunkte eines Polygonswerden zum Schattieren über die Fläche interpoliert. Für jeden Eckpunkt wird der ent-sprechende Farbwert berechnet und anschließend die Farbwerte liniar über die Kanten desPolygons interpoliert. Im letzten Schritt werden die einzelnen Pixelfarbwerte innerhalbdes Polygons durch zeilenweise Interpolation (Scanlinie) der entsprechenden Farbwerte anden beiden Kanten der Zeile ermittelt. Das Verfahren verwendet ausschließlich diffuse Be-leuchtung zur Berechnung der Farbwerte. Ein großer Nachteil des Gouraud-Shadings istdas sog. Machbanding. Es entsteht durch die Interpolation an den Kanten der einzelnenGeometrieflächen. Die Farbintensitätsänderungen an den Scanlinien erfolgen sprunghaft,d.h., die erste Ableitung ist nicht konstant. Das menschliche Auge ist in der Lage Kon-turen zu verstärken, dies führt zur Erkennung dieser Unregelmäßigkeiten. Die folgendeAbbildung 2.2 zeigt diesen Effekt.

5

Page 15: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.4 Beleuchtungsrechnung

Abbildung 2.2: Zwei mit Gouraud schattierte Kugeln

2.4 Beleuchtungsrechnung

In der Beleuchtungsrechnung wird zwischen drei Lichtarten unterschieden: ambientes,diffuses und spiegelndes Licht. Zur Berechnung der Farbe eines Objektes in einer Szenewird folgende Gleichung (Quelle:[GDV09]) verwendet:

itot = iamb + idiff + ispec

Die Lichtfarbe eines Objektes itot setzt sich aus der Summe von dem ambienten Lichtiamb, dem diffusen Licht idiff und dem spiegelnden Licht ispec zusammen. Für dieseDiplomarbeit wurde Java 3D verwendet, das auf OpenGL basiert. Üblicherweise bestehtjeder dieser Terme in OpenGL aus einem dreidimensionalen Vektor, dessen Komponentenden roten, grünen und blauen Farbanteil des Lichtes beinhalten. Somit enthält jederdieser Vektoren einen Farbwert aus dem RGB-Farbraum. Im weiteren Verlauf dieserDiplomarbeit wird davon ausgegangen, daß die verwendeten Licht-/ Farbvektoren Farbenaus dem RGB-Farbraum repräsentieren. Zur Berechnung der einzelnen Terme werden diein Abbildung 2.3 dargestellten Vektoren benötigt.

6

Page 16: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.4.1 Diffuse Beleuchtung

Abbildung 2.3: Beleuchtungsvektoren

2.4.1 Diffuse Beleuchtung

Bei der diffusen Beleuchtung wird die Lichteinwirkung auf eine ideal diffus reflektierendeFläche (Lambertfläche) betrachtet. Die Beleuchtungsintensität ist dabei vom Winkel αzwischen der Normale der Fläche (N) und dem Lichteinfallsvektor (L) abhängig. Diediffuse Beleuchtung der Lambertfläche läßt sich mit dem lambertschen Kosinusgesetzberechnen:

idiff = Lichtfarbediff ∗Materialfarbediff ∗ cos(α)

Eine Eigenschaft der Lambertfläche ist, daß die Intensität des von der Fläche reflektiertenLichtes, vergleichbar mit einer glühenden Kugel, in alle Richtungen konstant ist.

2.4.2 Spiegelnde Beleuchtung

Bei der spiegelnden Beleuchtung wird von einer Lichtquelle Licht abgestrahlt, das auf derOberfläche eines Objektes ein Glanzlicht erzeugt. Eine Methode spiegelnde Beleuchtungzu berechnen, ist die Methode nach Phong [PHO75]. Im Gegensatz zu den vorhergehendenBeleuchtungsarten ist die Phong-Methode nicht physikalisch zu erklären. Sie basiert aufrein empirischen Beobachtungen und wird wie folgt berechnet:

ispec = Lichtfarbespec ∗Materialfarbespec ∗ cos(θ)shininess

7

Page 17: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.4.3 Ambiente Beleuchtung

Zur Berechnung wird die spiegelnde Lichtfarbe mit der spiegelnden Materialfarbe mul-tipliziert und dies wird wiederum mit dem Kosinus von Theta, dem Winkel zwischendem Kameravektor (C) und dem Vektor des reflektierten Lichtes (R) multipliziert. DerParameter shininess bestimmt wie groß das Glanzlicht wird. Je größer dieser ist, destoglatter ist die Oberfläche und desto kleiner wird das Glanzlicht.

Abbildung 2.4: Eine mit Phong-Shading beleuchtete Kugel (übernommen von [PHOSP]und modifiziert)

2.4.3 Ambiente Beleuchtung

Im Gegensatz zur diffusen und spiegelnden Beleuchtung wird ambientes Licht nicht voneiner „realen“ Lichtquelle abgegeben, sondern ist als die Grundhelligkeit bzw. die Hin-tergrundbeleuchtung einer Szene anzusehen. Die ambiente Beleuchtung wird wie folgtberechnet:

iamb = Lichtfarbeamb ∗Materialfarbeamb

Für ambientes Licht wird die ambiente Lichtfarbe der Lichtquelle mit der ambientenMaterialfarbe der zu beleuchtenden Fläche multipliziert. Der ambiente Term der Be-leuchtungsrechnung dient als Approximation der indirekten Beleuchtung. Bevor globaleBeleuchtungsverfahren, wie das Radiosity-Verfahren, bekannt waren, war die ambienteBeleuchtung die einzige Möglichkeit, globale Beleuchtung zu berücksichtigen, wenn auchnur in sehr primitiver Art und Weise.

8

Page 18: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5 Globale Beleuchtungsrechnung

2.5 Globale Beleuchtungsrechnung

In den vorhergehenden Abschnitten ging es überwiegend um lokale Beleuchtungsverfah-ren, die lediglich eine Interaktion des Lichtes zwischen Lichtquelle und Objekten in einerSzene berechnen. Im Gegensatz dazu berücksichtigt die globale Beleuchtungsrechnungauch die Interaktion des Lichtes zwischen Objekten (Interobjektreflektion) und trägtdem Energieerhaltungssatz für geschlossene Systeme Rechnung. Das bedeutet, daß allesLicht, das von einer Quelle abgestrahlt wird, auch auf einer Fläche in der Szene wie-der ankommt, also die Differenz von der ausgehenden Lichtmenge und der eingehendenLichtmenge null ist. Weiterhin kommen bei der Berechnung die Gesetze der geometri-schen Optik zum Einsatz, sodaß wesentlich realistischere Szenen erzeugt werden als mitlokalen Beleuchtungsverfahren. Ein weiterer Vorteil gegenüber lokalen Verfahren ist, daßdurch die Verdeckungsberechnung, die bei globalen Beleuchtungsverfahren durchgeführtwird, Schattenwurf erzeugt wird. Die erwähnten Vorteile haben jedoch auch einen Preis.Dieser ist die für globale Beleuchtungsverfahren übliche hohe Laufzeit bzw. der hoheSpeicherplatzbedarf.Globale Beleuchtungsverfahren lassen sich in zwei große Gruppen einteilen. Die ersteGruppe sind Verfahren zur Berechnung von spiegelnden Reflektionen, zu denen das Ray-tracing zählt. Die zweite Gruppe enthält Verfahren zur Berechnung diffuser Reflektionen,zu denen Radiosity zählt.In den folgenden Abschnitten gehen wir detailiert auf das Radiosity-Verfahren ein. Fürweitere Informationen zu Raytracing siehe [Whi80].

2.5.1 Radiosity

Das Radiosity-Verfahren ist ein globales Beleuchtungsverfahren der Computergrafik, dasdie reale Lichtausbreitung von ideal diffuser Interobjektreflektion berechnet. Es erzeugt„Color bleeding“5 von einer Fläche zu einer anderen, Halbschatten und „weiche“ Schat-tenverläufe. Radiosity wurde erstmals 1984 von Cindy M. Goral, Kenneth E. Torrance,Donald P. Greenberg und Bennett Battaile vorgestellt [Rad84].Die Idee dabei ist, daß in geschlossenen Systemen keine Energie verloren geht (Ener-gieerhaltungssatz). Also muß in einem modelierten Raum die abgestrahlte Lichtenergie(Radiosity) auch wieder vollständig auf den Oberflächen des Raums ankommen. JedeOberfläche reflektiert einen Teil des ankommenden Lichtes und kann so selbst als Licht-quelle zweiter Ordnung angesehen werden. Lichtquellen erster Ordung werden als Flä-

5Color bleeding bezeichnet das „Verfärben“ von Flächen durch das von Interobjektreflektionen entste-hende bunte Licht.

9

Page 19: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.1 Radiosity

chenlichtquelle betrachtet, also als eine Fläche, die Licht abstrahlt.Für das Verfahren sind einige Voraussetzungen nötig. Zum einen wird davon ausgegangen,daß alle Oberflächen der Szene ideal diffus reflektieren, also Lambert-Strahler (Lambert-flächen) sind. Zum anderen darf die Szene keine transparenten Flächen enthalten.In einer natürlichen Umgebung sind spiegelnde Flächen eher die Ausnahme, der größteTeil sind diffus reflektierende Oberflächen. Auch Schattenverläufe entstehen meist durchdiffuse Interobjektreflektion.

Zur Berechnung der Lichtausbreitung verwendet das Radiosity-Verfahren eine Mengevon linearen Gleichungen, die darauf beruhen, wieviel Licht eine Lambertfläche verläßtund bei einer anderen wieder ankommt. Maßgeblich dafür ist die sog. Radiosity-Gleichung[Rad84]:

Bi = Ei + ri

n∑j=1

BjFij , ∀i = 1, . . . , n

Wobei:

• Bi ist das von einer Lambertfläche i in die Szene abgestrahlte Licht (Radiosity)

• Ei ist die Lichtemission der Lambertfläche i

• ri ist der Reflektionsgrad der Lambertfläche i

• Fi,j ist der sog. Formfaktor von Lambertfläche i und j

Vereinfacht ausgedrückt bedeutet die Gleichung: Radiosity für i entspricht der Emissionvon i, zuzüglich der Summe des an i ankommenden Lichtes, moduliert mit dem Reflek-tionsgrad von i. Diese Gleichung wird für jede Fläche i der Szene berechnet.Der größte Aufwand des Verfahrens liegt in der Berechnung der Formfaktoren Fi,j . Siebeschreiben den Energie- / Lichtaustausch zwischen zwei Flächen der Szene in Abhängig-keit von deren Ausrichtung, Entfernung und Verdeckung. Zunächst müssen beide Flächenin Sichtkontakt stehen, zumindest partiell, sonst würde das Licht gar nicht ankommenund stattdessen auf ein dazwischenliegendes Objekt fallen, das dann Schatten werfenwürde und somit wäre die Energie von i nach j null. Je weiter weg eine Fläche i vonj ist, desto weniger Einfluss hat sie auf deren Beleuchtung. Die Ausrichtung ist ganzentscheidend. Zwei mit der Rückseite zueinander stehende Flächen beleuchten sich nichtgegenseitig. Die Frage ist nun: Bei welcher Ausrichtung beleuchten sich zwei Flächen

10

Page 20: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.1 Radiosity

gegenseitig? Stellt man sich eine Fläche i vor, so wird diese von allem beleuchtet, wasim Bereich eines 180◦-Sichtfeldes in Richtung ihrer Normalen liegt. Stellt man sich dieFläche als eine Ebene im 3D-Raum vor, so wird die Fläche von allem beleuchtet, was inSichtkontakt vor dieser Ebene liegt.Weiterhin gelten folgende Eigenschaften für Formfaktoren:

• Reziprozität: Ai ∗ Fi,j = Aj ∗ Fj,i

• Energieerhaltung:∑Fi,j ≤ 1

• Keine Fläche i strahlt Licht auf sich selbst ab: Fi,i = 0, ∀i

Die Formfaktoren lassen sich als eine quadratische Matrix beschreiben, die in der Haupt-diagonale nur Nullen enthält. Die Radiosity-Gleichung läßt sich dann als ein Gleichungs-system, das aus einer Menge linearer Gleichungen besteht, darstellen. Im klassichenRadiosity-Verfahren werden die Formfaktoren mit folgender Formel berechnet [Hem85]:

FAi,Aj =1Ai

∫Ai

∫Aj

cos Φi cos Φj

πr2∗HID ∗ δAj ∗ δAi (2.1)

Wobei:

• Ai und Aj sind Flächen in der Szene

• FAi,Aj ist der Formfaktor der Flächen Ai und Aj

• r ist der Vektor vom Mittelpunkt der Fläche Ai zum Mittelpunkt der Fläche Aj

• Φi ist der Winkel zwischen der Normale von Ai und r

• Φj ist der Winkel zwischen der Normale von Aj und r

• HID ist eine Funktion. Wenn Fläche Aj von Fläche Ai aus sichtbar ist, ist HID =1, sonst 0.

In Abbildung 2.5 wird dies zur Verdeutlichung dargestellt.

11

Page 21: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.1 Radiosity

Abbildung 2.5: Geometrie zur Berechnung eines Formfaktors (übernommen von [Hem85])

Es ist schwer diese Formel analytisch für jede beliebige Szene zu berechnen. Mit einigenEinschränkungen, wie z.B., daß die Szene keine verdeckten Flächen enthalten darf, ist eszwar mit viel Aufwand möglich diese Formel zu lösen, für komplexe Szenen ist dies jedochnahezu unmöglich. In den nachfolgenden Kapiteln 2.5.2 und 2.5.3 werden praxistaugli-chere Methoden zur Lösung des Radiosity-Gleichungssystems und der Formfaktormatrixvorgestellt, die effizienter sind und keine so gravierenden Einschränkungen der Szene be-dingen.Um eine Szene möglichst exakt berechnen zu können, muß sie in viele kleine Flächen un-terteilt werden. Je feiner eine Szene unterteilt wird, desto weicher erscheinen die Schatten-und Farbverläufe, jedoch steigt mit der Unterteilung auch die Anzahl der Einträge in derFormfaktormatrix und somit die Laufzeit bzw. der Speicherbedarf.

Abbildung 2.6: Drei mit Radiosity beleuchtete Kugeln (übernommen von [RADSP])

12

Page 22: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.1 Radiosity

In Abbildung 2.6 sind drei Kugeln zu sehen, die mit Radiosity beleuchtet wurden. Ty-pisch für Radiosity sind die „weichen“ Schatten und das color bleeding, das sich in dieserAbbildung durch die farbigen Reflektionen der Kugeln auf dem weißen Untergrund be-merkbar macht.Radiosity kann recht einfach mit Raytracing kombiniert werden, indem es z.B. als Post-renderer eingesetzt wird, also erst eine Beleuchtungsberechnung für den spiegelndenLichtanteil der Szene durchgeführt wird, und anschließend auf diese Szene Radiosityangewendet wird. Die Kombination der beiden Beleuchtungsarten ist heute in gängigenRenderern üblich.Ein Beispiel dafür ist POV-Ray6, ein kostenloser Open-Source-Renderer, der ursprüng-lich zur Berechnung von Raytracing geschaffen wurde, mittlerweile aber auch Radiosity,Photon-Mapping und einige weitere Fähigkeiten beherrscht, um photorealistische Bilderzu erzeugen. Die nachfolgende Abbildung 2.7 wurde mit POV-Ray, u.a. unter Verwen-dung von Radiosity, Raytracing und Phonton-Mapping7, gerendert.

Abbildung 2.7: Glass Szene gerendert mit POV-Ray (übernommen von [RADPR])

Ein Vorteil der diffusen Reflektion ist es, daß die Leuchtdichte unabhängig von demBeobachtungswinkel zur Fläche ist. Das bedeutet, daß, wenn eine Fläche in der Szenevon einem beliebigen anderen Punkt in der Szene betrachtet wird, diese immer gleich hellund gleich gefärbt erscheint. Ist eine Szene für jede Fläche vollständig berechnet, so kann

6POV-Ray steht für: The Persistence of Vision Raytracer. Weitere Informationen siehe: http://www.povray.org/.

7Phonton-Mapping ist ein globales Beleuchtungsverfahren zur Berechnung von Kaustiken, diffuser In-terobjektreflektionen und Subsurface-Scattering (Volumenstreuung). Es kann als eine Erweiterungdes Raytracings aufgefaßt werden.

13

Page 23: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.2 Nusselt-Analogon

die Kameraansicht verändert, oder die Szene durchlaufen werden, ohne Radiosity neuberechnen zu müssen. Dies ermöglicht das Vorrendern einer Szene und diese anschließend„live“ ohne Neuberechnungen zu verwenden, solange sich die Szene selbst nicht ändert,also Objekte und Lichquellen nicht verändert oder transliert werden und keine neuenObjekte hinzugefügt werden.

2.5.2 Nusselt-Analogon

Ein numerisches Verfahren zur Approximation der Formfaktoren wurde von Nusselt ent-wickelt [TRH78]. Um das Verfahren anwenden zu können, wird vorausgesetzt, daß dieDistanz zwischen zwei Flächen i und j groß ist und sie sich nicht partiell gegenseitig ver-decken. Unter diesen Bedingungen kann das äußere Integral der Gleichung (2.1) mit einerMultiplikation mit 1 approximiert werden, sodaß die Lösung des inneren Integrals eineapproximierte Lösung des Formfaktors darstellt. Falls die Bedingungen nicht zutreffen,können die Flächen i und j solange feiner unterteilt werden, bis sie zutreffen.Zur Lösung des inneren Integrals wird die Fläche j auf eine Einheitshalbkugel, die denMittelpunkt der Fläche i umhüllt, projiziert. Die Einheitshalbkugel entspricht dabei der„Sicht“ des Mittelpunktes der Fläche i. Die Projektion auf die Einheitshalbkugel berück-sichtigt die Terme 1

r und cos Φj der Gleichung (2.1). Anschließend wird Fläche j vonder Einheitshalbkugel auf die Kreisfläche projiziert, die den Mittelpunkt von Fläche iumgibt. Diese zweite Projektion berücksichtigt die Terme 1

r und cos Φi der Gleichung(2.1). Die Kreisfläche des Einheitskreises entspricht π. Für weitere Informationen siehe[Hem85] [TRH78].Damit ein Formfaktor Fi,j berechnet werden kann, muß der Anteil der Fläche j an derGesamtbeleuchtung der Fläche i ermittelt werden. Dafür muß die Einheitshalbkugel ingleich große Flächen unterteilt werden und anschließend muß berechnet werden, auf wieviele Flächen der Einheitshalbkugel die Fläche j projiziert wird. Es ist schwierig eineKugel bzw. Halbkugel in gleich große Flächen zu unterteilen. Ein weiteres Problem istdie Erzeugung von linearen Koordinaten zur Beschreibung der Position einer Fläche aufeiner Kugel. Im folgenden Kapitel wird ein Verfahren vorgestellt, das diese Problemeumgeht.

2.5.3 Hemi-Cube-Verfahren

Das Hemi-Cube-Verfahren wird zur Berechnung der Formfaktormatrix der Radiosity-Gleichung verwendet. Es basiert auf den Grundprinzipien des von Nusselt entwickeltenVerfahrens, vermeidet jedoch dessen geometrische Probleme, indem anstatt einer Ein-

14

Page 24: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.3 Hemi-Cube-Verfahren

heitshalbkugel ein Einheitshalbwürfel verwendet wird. Auf eine einfache, effiziente Artnähert es numerisch die Formfaktoren an und löst gleichzeitig das Verdeckungsproblemvon Flächen. Erstmals vorgestellt wurde dieses Verfahren von Michael F. Cohen undDonald P. Greenberg im Jahr 1985 [Hem85]. Durch dieses Verfahren wurde Radiosityerstmals auch für komplexe Szenen praktisch einsetzbar.Ein Hemi-Cube ist ein fünfseitiger Einheitshalbwürfel, der über dem Mittelpunkt derFläche i, deren Beleuchtung berechnet werden soll, erzeugt wird. Seine Seiten sind inRaster, die sog. Hemicube-Pixel, unterteilt. Jeder Rasterfläche ist ein Delta-Formfaktorzugeordnet, der beschreibt, wie stark ein Hemi-Cube-Pixel zur Gesamtbeleuchtung derFläche i beiträgt. Der Delta-Formfaktor berücksichtigt dabei zwei Aspekte. Sei r derVektor von dem Mittelpunkt der Fläche i zu dem Mittelpunkt des Hemi-Cube-Pixels,dann wird einerseits die Länge von r und andererseits der Kosinus vom Winkel, zwi-schen r und Oberflächennormalenvektor (Lambertsches Kosinusgesetz), berücksichtigt.Die Delta-Formfaktoren sind rein geometrische Größen, die deshalb nicht für jede Flächeneu berechnet werden müssen, solange der Hemi-Cube seine Geometrie und Anzahl anHemi-Cube-Pixel beibehält. Deshalb können die einmal berechneten Delta-Formfaktorenin einer Lookup-Table gespeichert werden, aus der sie bei jeder neuen Hemi-Cube-Berechnungausgelesen werden. Der Ablauf zur Berechnung der Formfaktormatrix mittels des Hemi-Cube-Verfahrens ist wie folgt:

1. Erzeuge einen Hemi-Cube um den Mittelpunkt der Fläche i

2. Projiziere die Szene auf die fünf Seiten des Hemi-Cubes

3. Berechne ∀j Fi,j = Summe der Delta-Formfaktoren einer Fläche j, die auf denHemi-Cube projiziert wurde

4. Trage alle berechneten Fi,j in die Formfaktormatrix ein

5. Solange i < Anzahl der Lambert-Flächen, setze i = i + 1 und wiederhole 1 - 5

6. Lösung des Radiosity-Gleichungssystems (z.B. mit der Gauss-Seidel-Methode)

In einem einzelnen Berechnungsschritt, also pro Hemi-Cube, werden die FormfaktorenFi,j für ein einzelnes i, jedoch für alle dazugehörigen j, gleichzeitig berechnet, d.h., inder Formfaktormatrix wird eine Zeile pro Berechnungsschritt gelöst. Warum berechnetder Hemi-Cube eine ganze Zeile der Matrix? Eine Matrixzeile beinhaltet das gesamteLicht, das von allen Flächen j einer Szene an der Fläche i ankommt, also das gesamteLicht, das die Szene an die Fläche i abstrahlt. Der Hemi-Cube stellt durch seine Anor-dung sicher, daß nur Licht aus dem Sichtfeld der Fläche zur Berechnung verwendet wird,

15

Page 25: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.4 Progressive Refinement

denn nur Objekte die sich in einem 180◦-Winkel vor dem Hemi-Cube befinden, wer-den auf diesen projiziert. Damit ist das Problem der Ausrichtung gelöst. Das Problemder entfernungsabhängigen Intensität des Lichtes wird automatisch dadurch gelöst, daßObjekte die weiter weg sind, weniger Pixel auf dem Hemi-Cube einnehmen, und somitweniger zur Beleuchtung beitragen. Das Sichtbarkeitsproblem läßt sich ebenfalls leichtlösen, denn für das Projizieren auf den Hemi-Cube kann der Z-Buffer8 verwendet werden,sodaß nur nicht verdeckte Objekte als Pixel dargestellt werden. Also repräsentieren diePixel des Hemi-Cubes das gesamte auf Fläche i einfallende Licht. Abbildung 2.8 zeigtzur Verdeutlichung die Projektion einer Fläche auf den Hemi-Cube.

Abbildung 2.8: Projektion auf einen Hemi-Cube (übernommen von [HemPR])

Je feiner der Hemi-Cube unterteilt wird, also die Anzahl der Raster pro Fläche erhöhtwerden, desto genauer wird der Formfaktor berechnet, jedoch steigt dadurch auch dieLaufzeit. Ist die Unterteilung zu gering, so wird die Berechnung ungenau und es kannAliasing auftreten.

2.5.4 Progressive Refinement

Progressive Refinement bedeutet soviel wie schrittweises Verbessern bzw. Verfeinern.Bezogen auf Radiosity ist Progressive Refinement ein iteratives, inkrementelles Verfah-ren, das Radiosity approximiert. Das klassische Radiosity-Verfahren löst das komplet-

8Der Z-Buffer dient zur Elimination von überdeckten Polygonen, dafür werden Tiefeninformationen derSzene berechnet und diese im Z-Buffer gespeichert.

16

Page 26: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.5.4 Progressive Refinement

te Radiosity-Gleichungssytem und stellt anschließend erst die Ergebnisse grafisch dar.Im Gegensatz zum klassischen Radiosity-Lösungsansatz werden mit diesem Verfahrenschnell darstellbare Zwischenergebnisse geliefert. Mit jedem Iterationsschritt werden dieErgebnisse genauer. Es existieren einige verschiedene Varianten des Verfahrens, die sichin zwei Gruppen einteilen lassen, einerseits in die Gruppe der Gathering-Verfahren undandererseits in die Gruppe der Shooting-Verfahren [sigPR]. Das Gathering verfolgt dieursprüngliche Grundidee von Radiosity. Jede Fläche i sammelt von allen anderen Flächenj das auf i einfallende Licht ein. Progressive Refinement als Shooting-Variante wurde erst-mals 1988 von Michael F. Cohen, Shenchang Eric Chen, John R. Wallace und DonaldP. Greenberg vorgestellt [PrR88]. Die Idee dabei ist, daß in jedem Berechnungsschritteine Fläche i seine Energie an alle anderen Flächen j entsprechend der Formfaktoren Fi,j

abgibt. In beiden Verfahren beginnt die Berechnung mit einer dunklen, unbeleuchtetenSzene, die dann schrittweise beleuchtet wird. Der Vorteil des Shootings ist, daß sich inden anfänglichen Iterationen die Radiosity-Werte, im Gegensatz zum Gathering, starkändern und somit durch die schnellere Konvergenz früher ein darstellbares Zwischener-gebnis in geeigneter Helligkeit zur Verfügung steht. Eine weitere Variante des Shootingsist das Sorted-Shooting. Dabei werden die Flächen aufsteigend nach ihrer abzugebendenEnergiemenge sortiert und in dieser Reihenfolge mit dem Shooting-Verfahren abgearbei-tet. Dies führt nochmals dazu, daß das Verfahren schneller konvergiert und die Helligkeitder Szene schneller zunimmt.Durch das Festlegen der Anzahl der Iterationsschritte kann Radiosity mit Progressive Re-finement beliebig genau approximiert werden. Betrachten wir nun, was in den einzelnenIterationsschritten passiert. Im ersten Iterationsschritt wird das von den Lichtquellen aufdie einzelnen Lambertflächen abgestrahlte Licht berechnet. Zu diesem Zeitpunkt werdennoch keine Interobjektreflektionen berücksichtigt, jedoch schon im nächsten Iterations-schritt ist dies der Fall. Mit jedem Iterationsschritt erhöht sich die Anzahl der Flächen, andenen das zur Berechnung verwendete Licht reflektiert wurde, bevor es zur Beleuchtungder entsprechenden Fläche beiträgt. In Abbildung 2.9 ist dies schematisch dargestellt:

17

Page 27: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.6 E-Learning

Iterationsschritt 1: Lichtquelle // 1. Fläche

Iterationsschritt 2: Lichtquelle // 1. Fläche // 2. Fläche

Iterationsschritt n: Lichtquelle // 1. Fläche // . . . // n. Fläche

Abbildung 2.9: Progressive Refinement-Radiosity Iterationsschritte: Reflektionen desLichtes in Abhängigkeit des Iterationsschrittes

2.6 E-Learning

Der Begriff E-Learning stammt aus dem Englischen und steht für electronic Learning.Einer der Pioniere auf dem Gebiet des E-Learnings in Deutschland ist Michael Kerres,Professor für Mediendidaktik. Nach seiner Definiton umfaßt E-Learning alle Formen desLernens, in denen elektronische oder digitale Medien zum Einsatz kommen. Essentiellfür E-Learning sind Lernanwendungen. Diese lassen sich nach [KKL02] nach ihren tech-nischen Merkmalen in folgende Kategorien unterteilen:

1 Präsentations- und Visualisierungssoftware: Sie dienen der Veranschaulichung kom-plexer Sachverhalte.

2 Drill-and-Practice-Programme: Zu dieser Kategorie gehören z.B. Vokabeltraineroder Maschinenschreibkurse, in denen es darum geht, durch ständige Wiederholungvorgegebener Aufgaben, Fähigkeiten des entsprechenden Bereiches zu erlernen undzu intensivieren.

3 Tutorielle Systeme (Generative Systeme): Während der Präsentation des Lernstof-fes wird in regelmäßigen Abständen, durch Abfragen des bereits präsentierten Lern-stoffes, ein Feedback erzeugt, von dem der weitere Verlauf der Anwendung abhängt.Tutorielle Systeme lassen sich nochmals in drei Typen unterteilen, die sich in ihremangebotenen Interaktionsgrad unterscheiden:

– Tutorials: Meist als Programmeinführung genutzt. Sie bieten wenig bis garkeine Interaktionsmöglichkeiten.

– Lineare Lernprogramme: Der Ablauf des Lernprogrammes ist fest vorgegeben.Die einzige Interaktionsmöglichkeit ist das Abfragen des Erlernten.

18

Page 28: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.6 E-Learning

– multifunktionale Lernprogramme: Die Kapitelreihenfolge ist nicht fest vorge-geben. Der Lernende kann selbst entscheiden in welcher Reihenfolge er dieAnwendung abarbeitet und ob er abgefragt werden möchte.

4 intelligente Tutorielle Systeme: Sie basieren auf künstliche Intelligenzen. Die Lernan-wendung paßt sich adaptiv dem Niveau des Lernenden an.

5 Hypermedia-Programme: Hypermedia bezeichnet die Kombination von Hypertextmit multimedialen Inhalten. In diese Kategorie fallen alle Arten des selbstgesteu-erten Lernens, bei denen der Lernende völlig uneingeschränkt durch den Lernstoffnavigiert. Dies ist vergleichbar mit dem Surfen durch das Internet, denn dieses stelltdas zzt. größte existierende Hypermedium dar.

6 Lernspiele: Sie vermitteln Wissen auf spielerische Art.

7 Simulationsprogramme: Der Anwender wird mit einer konkreten, zu lösenden Situa-tion konfrontiert. Bereits erworbenes Wissen soll zur Lösung des Problems richtigangewendet werden. Die realitätsgetreue Abbildung hat hier eine große Bedeutung.

8 Mikrowelten und Modellbildung: Diese Kategorie ist der vorhergehenden sehr ähn-lich. Der Hauptunterschied besteht darin, daß der Lernende die Welt selbst mit-gestalten kann und durch Experimentieren sowie Exploration der Welt Wissen er-langt.

Alle genannten Kategorien sind Idealtypen, wie sie in der Realität nur selten vorkommen.Typischerweise sind Lernanwendungen Mischformen dieser Kategorien.Wie schon in Punkt [3] tutorielle Systeme angedeutet wurde, lassen sich Lernanwendun-gen auch nach ihrem Interaktionsgrad unterscheiden. In [IMA05] wird in sechs Stufender Interaktivität einer Multimedia-Anwendung unterschieden:

I Objekte betrachten und rezipieren: In dieser Stufe hat der Anwender ausschließlichdie Möglichkeit den Ablauf des Mediums wie bei einem Videoplayer zu kontrollieren,also z.B eine Animation zu starten und sich diese zu betrachten.

II Multiple Darstellungen betrachten und rezipieren: Der Anwender hat die Möglich-keit einzelne Abläufe zu wiederholen und die Darstellungsform der Daten zu vari-ieren (z.B. von einer Tabellenansicht in eine Diagrammansicht umschalten), jedochist keine Änderung des Ablaufs der Anwendung durch den Anwender möglich.

19

Page 29: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

2.6 E-Learning

III Die Repräsentationsform variieren: In dieser Stufe können repräsentierte Objektez.B. skaliert oder rotiert werden. Ein Beispiel dafür ist eine 3D-Szene, in der dieKamera frei bewegt werden kann. Ein Verändern der Inhalte ist nicht möglich.

IV Den Inhalt der Komponente beeinflussen: Variation durch Parameter- und Daten-variation: Der Anwender hat die Möglichkeit, das Verhalten und die Darstellungender Anwendung, z.B. durch das Ändern von Parameter, zu beeinflussen. Ein Bei-spiel dafür ist die Visualisierung eines Sortieralgorithmus, in der die Werte der zusortierenden Elemente verändert werden können.

V Das Objekt bzw. den Inhalt der Präsentation konstruieren und Prozesse generieren:Die Anwendung wird in dieser Stufe zu einem Werkzeug, mit dem der Anwendereigene Objekte oder Welten erzeugen kann, um deren Sachverhalte zu hinterfragen.

VI Konstruktive und manipulierende Handlungen mit situationsabhängigen Rückmel-dungen: Der Anwender hat in dieser Stufe die gleichen Möglichkeiten wie in dervorherigen, jedoch steht die Anwendung als Tutor mit individuellen intelligentenRückmeldungen, Vorschlägen und Tipps dem Anwender zur Seite. Diese Stufe stellteine große Anforderung an die künstliche Intelligenz der Anwendung.

Die vorgestellten Stufen der Interaktivität einer Lernanwendung können schnell den Ein-druck vermitteln, eine höhere Stufe sei immer besser zum Lernen geignet als eine niedri-gere. Dies ist jedoch nicht immer der Fall. Unterteilt man die Lernenden in zwei Grup-pen, auf der einen Seite die „starken“ Lerner, denen Lernen grundsätzlich leicht fälltund auf der anderen Seite die Gruppe der „schwachen“ Lerner, so sind für beide Grup-pen unterschiedliche Interaktionsgrade von Vorteil. Ein „starker“ Lerner wird sich übereinen möglichst hohen Interaktionsgrad freuen und hat die Möglichkeit sich daraus vieleErkenntnisse zu ziehen, jedoch ist ein „schwacher“ Lerner mit der Vielfalt der Möglich-keiten und dem selbständigen Strukturieren des Ablaufes schnell überfordert („Lost inHyperspace-Phänomen“) [HHB04]. Dies kann die Motivation des „schwachen“ Lerners be-einträchtigen. Umgekehrt kann ein geringer Interaktionsgrad dem „schwachen“ Lerner dieMöglichkeit geben sich auf das wesentliche des Lernstoffes zu konzentrieren, wohingegensich ein „starker“ Lerner schnell gelangweilt und unterfordert fühlen kann, was wieder-um dessen Motivation beeinträchtigen würde. Es ist erstrebenswert für beide Gruppengleichermaßen gute Bedingungen zu bieten, indem der Interaktionsgrad und der Detail-reichtum der angebotenen Informationen in der Lernanwendung durch den Lernendenselbst festgelegt werden kann, also erweiterte Optionen, Parameter und Einstellungs-möglichkeiten optional „freigeschaltet“ werden können.

20

Page 30: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3 State of the Art

„Wissen ist ein zeitlicher Bildungsendstand mangels neuer Erkenntnisse.“

Werner Mitsch

Der Einsatz von E-Learning nimmt an Universitäten und Schulen in den letzten Jahrenstetig zu. Essentiell dafür sind Systeme, die es dem Lehrenden ermöglichen, mit möglichstgeringem Aufwand Lernkurse zu erstellen. Ein solches System ist das sog. Autorensys-tem. Ein Autorensystem ist ein Entwicklungswerkzeug zur Erstellung von interaktiverLernsoftware oder interaktiven Präsentationen. Texte, Grafiken, Sound und Animatio-nen können zu einem Hypermedium verküpft werden. Es gibt viele verschiedene Typenvon Autorensystemen. Microsoft Frontpage9 ist in diesem Sinne auch ein Autorensystem,mit dem Webseiten erstellt werden können, jedoch beschränkt sich diese Diplomarbeitausschließlich auf Autorensysteme, deren Hauptaufgabe die Erstellung von Lernanwen-dungen ist. Mit diesen Systemen sollen Lehrende in der Lage sein, Lernkurse selbstständigzu erstellen. Einige dieser Autorensysteme bieten die Möglichkeit zur Erstellung von Test-und Übungssequenzen, um das vom Lernenden erworbene Wissen zu kontrollieren undzu intensivieren. Eine weitere wichtige Unterteilung der Autorensysteme ist deren Anfor-derung an den Autor. Einige Systeme verwenden zum Zusammensetzen des Kurses undzur Kursnavigation Programmier- oder Skriptsprachen, andere ermöglichen das Einfügenvon Elementen in Form von Symbolen, sodaß keine Programmierkenntnisse erforderlichsind und die Einarbeitungszeit des Autors in das System wesentlich kürzer ist. GeradeLetztere sind für das E-Learning von großer Bedeutung, denn so können auch Lernanwen-dungen und Kurse von Autoren geschrieben werden, die keine Programmiervorkenntnissehaben, wodurch die Erstellung von Lernanwendungen einem größeren Kreis von Nutzernzugänglich ist. Nachteilig ist jedoch, daß je einfacher die Erstellung der Kurse in einem

9Frontpage ist eine Entwicklungsumgebung, die Bestandteil des Microsoft-Office-Paketes ist. Sie dientder Erstellung von Webseiten. Die Entwicklung wurde 2006 eingestellt. Weitere Informationen siehe:http://office.microsoft.com/de-de/frontpage/FX100743231031.aspx.

21

Page 31: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.1 CourseLab

Autorensystem ist, desto eingeschränkter ist der Funktionsumfang, der zur Verfügungsteht, und die Komplexität der zu erstellenden Kurse. Im Umkehrschluß bedingt einegrößere Freiheit in der Erstellung der Kurse jedoch auch wieder eine dementsprechendlängere Einarbeitungszeit.Es existieren sowohl eine Menge von verschiedenen kommerziellen als auch kostenlosenAutorensystemen. In den folgenden Abschnitten 3.1, 3.2 und 3.3 werden exemplarischdrei verschiedene Autorensysteme vorgestellt.

3.1 CourseLab

CourseLab ist ein kostenloses E-Learning-Autorensystem, das die Erstellung von interak-tiven Lernkursen ganz ohne Programmierkenntnisse ermöglicht. Dazu stellt CourseLabeine WYSIWYG10-Entwicklungsumgebung bereit, die als Ausgabe Dynamic HTML11 er-zeugt. Durch dieses Format sind grundsätzlich zum Ausführen des Kurses keine Webbrowser-Plugins12, wie Java oder Adobe Flash13, nötig. Jedoch bietet CourseLab die Möglichkeit,per Drag-and-Drop Multimediainhalte in diversen Formaten, wie Adobe Flash, Java-Applets oder diverse Videoformate, einzubinden. Die Entwicklungsumgebung enthälteinen Rich-Text-Editor, mit dem erstellte Texte formatiert werden können. CourseLabunterstützt den Autor bei der Erstellung von Testaufgaben mit einem großen Reper-toire an möglichen Test- und Fragetypen. Diese reichen von Single-Choice, Multiple-Choice, Eingabe der Antwort in Textform, Matching-Pairs14 bis hin zur Erstellung voneigenen Fragetypen. Ein in CourseLab erstellter Kurs hat die Möglichkeit PDFs15 undMicrosoft-Office-Dokumente in einem separaten, externen Fenster zu öffnen. Auf derWebseite [COLAB] steht die aktuelle CourseLab-Version 2.4 zum Download bereit. Wei-terhin werden dort eine Menge vorgefertigter Module, die als Vorlage zur Erstellung vonKursen dienen können, zur Verfügung gestellt.Die nachfolgende Abbildung 3.1 zeigt die Erstellung eines Kurses in CourseLab. Das Lay-

10WYSIWYG (What You See Is What You Get) beschreibt Editoren, die ein Dokument bei der Bear-beitung genau so anzeigen, wie es später bei der Ausgabe aussehen wird.

11Dynamic HTML bietet gegenüber reinem HTML die Möglichkeit, Webseiteninhalte durch clientseitigeSkriptsprachen dynamisch zu verändern.

12Ein Plugin ist ein Ergänzungsmodul für einen Webbrowser, das dessen Funktionalität erweitert.13Adobe Flash ist eine proprietäre Software zur Entwicklung multimedialer Webinhalte. Weitere Infor-

mationen siehe: http://www.adobe.com/support/documentation/de/flash/.14Die Funktionsweise von Matching-Pairs ist ähnlich der von Memory, jedoch sehen die zusammen-

passenden Elemente nicht exakt gleich aus, sondern passen in Abhängigkeit des Themas logischzusammen.

15PDF steht für Portable Document Format und ist ein plattformunabhängiges Dateiformat, das vonAdobe entwickelt wurde. Für weitere Informationen siehe: http://www.adobe.com/de/products/acrobat/adobepdf.html.

22

Page 32: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.1 CourseLab

out der CourseLab-Entwicklungsumgebung erinnert stark an die Entwicklungsumgebungvon Microsoft PowerPoint. Daraus, daß CourseLab auf der eigenen Webseite [COLAB]mit „Familiar PowerPoint-like authoring environment“ für sich wirbt, läßt sich schließen,daß diese Ähnlichkeit kein Zufall ist.

Abbildung 3.1: Entwicklungsumgebung von CourseLab (übernommen von [CLABB])

Obwohl CourseLab kostenlos erhältlich ist, stehen unter [COLAB] drei kostenpflichtigeFunktionserweiterungen, u.a. eine Importfunktion für PowerPoint-Präsentationen, bereit.Diese kosten jeweils 99 US-Dollar, sodaß für einen vollen Funktionsumfang 297 US-Dollarinvestiert werden müssen. In CourseLab erstellte E-Learning-Kurse können in jeder Lern-plattform16 genutzt werden, die einen der drei Standards AICC17, SCORM18 1.2 oderSCORM 2004 unterstützt.Ein Nachteil von CourseLab ist, daß die Entwicklungsumgebung keinen Formeleditor bie-tet. Formeln können lediglich durch Erstellen in externen Medien und deren Einbindungin den Kurs verwendet werden. Weiterhin ist der CourseLab-Editor nur mit Microsoft16Eine Lernplattform ist eine Software zur Bereitstellung und Verwaltung von Lernkursen. Manche

Lernplattformen enthalten Statistiken zu Lernerfolgen oder ermöglichen die Kommunikation zwischenden Lernenden.

17AICC (Aviation Industry CBT Committee) ist ein Zusammenschluß von Herstellern und Experten fürComputer Based Training (CBT) und E-Learning. Das AICC bietet eine Zertifizierung von Lern-plattformen nach ihrem eigens entwicklten, weit verbreiteten E-Learning-Standard an. Für weitereInformationen siehe: www.aicc.org.

18SCORM (Shareable Content Object Reference Model) ist ein Referenzmodel der Advanced Distribu-ted Learning Initiative (ADL), das mehrere E-Learning Standards, mit der Zielsetzung der Wieder-verwendbarkeit von E-Learning-Inhalten in unterschiedlichen Lernplattformen, vereint. Für weitereInformationen siehe: http://www.adlnet.gov/Pages/Default.aspx.

23

Page 33: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.2 LernBar

Windows kompatibel. Die Verwendung von CourseLab unter Linux und MacOS ist nichtvorgesehen. Ein weiterer Nachteil ist, daß das CourseLab-API19, von dem Öffnen vonDokumenten in externen Anwendungen abgesehen, keine Interaktions- und Kommunika-tionsmöglichkeiten mit externen Anwendungen anbietet. Bei der Betrachtung von onlinezur Verfügung gestellten Kursen fällt ein äußerst unangenehmer Effekt auf. Die Seitender Online-Kurse werden schrittweise nach Bedarf aus dem Internet geladen, sodaß nachjeder Interaktion auf das Laden einer Seite gewarten werden muß. Das Resultat des La-dens ist ein unangenehmes Flackern und die Sichtbarkeit des langsamen, zeilenweisenBildaufbaus der Seiten.Ein Vorteil von CourseLab ist, daß Kurse sowohl offline, als auch online genutzt wer-den können. Kurse können durch einfaches Kopieren des entsprechenden Ordners aufandere Rechner mit Microsoft Windows portiert werden. Das Ausführen der Kurse istin jedem gängigen Webbrowser möglich. Zusätzliche Webbrowser-Plugins sind nur nötig,wenn entsprechende Inhalte im Kurs verwendet werden. Das Kursmodul prüft vor demStart des Moduls, ob im Webbrowser alle benötigten Erweiterungen zur Verfügung ste-hen und warnt gegebenenfalls. Weitere Pluspunkte von CourseLab sind die zahlreichenHilfen auf der Webseite [COLAB] sowie ein gut frequentiertes Forum, in dem Autorensich gegenseitig Tips und Hilfestellungen geben können. Es stehen Tutorials, Erklärungenund zahlreiche Beispiele zur Entwicklung von Kursen zur Verfügung.

3.2 LernBar

Die LernBar ist ein E-Learning Autorensystem, das an der Goethe-Universität Frankfurtin Kooperation mit studiumdigitale20 entwickelt wurde. Das Autorensystem besteht ausden drei Anwendungen LernBar Player, LernBar Studio und LernBar Portal.Der LernBar Player ermöglicht das Anzeigen eines Kurses in einemWebbrowser und stellteine Navigationsleiste, die gängigen Designrichtlinien folgt, bereit. In jedem entworfenemKurs steht diese Leiste zur Verfügung und ermöglicht so eine einheitliche, nutzerzentrierteNavigation. Der Player basiert auf Adobe Flash, sodaß zum Darstellen der Kurse imBrowser das Adobe-Flash-Plugin benötigt wird.Das LernBar Studio ist das eigentliche Werkzeug zur Erstellung der Kurse. Es ermöglichteine WYSIWYG-Produktion der Kurse. Die erzeugten interaktiven Lerninhalte entstehenunter Berücksichtigung von gestalterischen Qualitätskriterien. Kursinhalte basieren auf

19API ist die Abkürzung für application programming interface20studiumdigitale ist eine Institution der Goethe-Universität Frankfurt, deren Aufgabe in der Verbesse-

rung der Lehre durch Unterstützung von E-Learning-Projekten besteht. Weitere Informationen siehehttp://www.studiumdigitale.uni-frankfurt.de/index.html.

24

Page 34: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.2 LernBar

HTML und können mit Adobe Flash, Java-Applets sowie Audio- und Videoinhaltenangereichert werden. Für die Kurse existieren mehr als 40 Designvorlagen sog. Templates.Es besteht die Möglichkeit das Gelernte mit Tests zu überprüfen. Für diese Tests stehenzahlreiche Fragemöglichkeiten, wie Quiz, Self-Assesment, Single-Choice, Multiple-Choicesowie Sortier- und Lückentextaufgaben, zur Verfügung. Zu jeder Frage kann ein Feedbackgegeben werden. Die Kurse können als Pdfs ausgedruckt werden und sowohl offline alsauch online genutzt werden. Sie sind SCORM-kompatibel und lassen sich somit in gängigeLernplattformen einbinden. In Abbildung 3.2 ist ein Kurs, der mit der LernBar erstelltwurde, zu sehen.

Abbildung 3.2: Ein mit der LernBar entwickelter Kurs (übernommen von [LeBar])

Das Lernbar Portal [LerBa] ist eine Webanwendung, die es ermöglicht Kurse online zuveröffentlichen und zu verwalten. Kurse können öffentlich, also für jeden auch ohne Regis-trierung zugänglich gemacht werden oder nur für registrierte Benutzer. Zur Freischaltungvon Kursen kann der Autor an die registrierten Benutzer entweder ein Ticket verschi-cken, was diese zur Freisschaltung berechtigt oder ein Passwort, mit dem der Benutzersich Zugang zu dem Kurs verschaffen kann.Die LernBar steht aktuell in Release 2.0, für nicht kommerziellen Einsatz, kostenlos zurVerfügung. Einer der Vorteile der LernBar ist, daß vielfältige Lehr- und Lernszenarienunterstützt werden. Die Oberfläche des LernBar Studios ist sehr übersichtlich und intui-tiv gestaltet. Kurse können vom Studio direkt in das Portal hochgeladen werden. Fürden Lernenden besteht die Möglichkeit Zwischenstände der Kurse abzuspeichern unddiese später fortzusetzen. Die zu anderen Autorensystemen vergleichsweise einfache undflexible Erstellung von Kursen sowie die Möglichkeit diese sowohl online als auch offline

25

Page 35: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.3 Adobe Director

zu nutzen, ermöglicht es einem breiten Spektrum an Autoren aus den verschiedenstenBereichen, E-Learning-Kurse nach ihren Bedürfnissen zu erstellen.

3.3 Adobe Director

Aktuelle Autorensysteme wie die in Abschnitt 3.1 und 3.2 vorgestellten, ermöglichen zwardie Einbindung von 3D-Animationen und Filmen, z.B. in Form von Adobe Flash, um denLerninhalt zu veranschaulichen, bieten jedoch keinerlei Unterstützung in der Entwicklungsolcher 3D-Inhalte. Eine wichtige Anforderung für den Einsatz von 3D-Inhalten in Auto-rensystemen ist es, daß die 3D-Inhalte online genutzt werden können. Obwohl es schonlange möglich ist mit z.B. Java 3D, das schon seit über 10 Jahren zur Verfügung steht,VRML21, Adobe Flash oder Microsoft Silverlight22 online verfügbare 3D-Animationen zuschreiben, kam es bisher zu keinem Durchbruch von 3D-Inhalten im Web. Generell exis-tieren zzt. noch keine Autorensysteme, die es Autoren ohne jegliche Programmiererfah-rung ermöglichen, beliebige 3D-Szenen mit beliebigem Interaktionsgrad zu erstellen. Je-doch gehen einige Entwickler mit ihren Bemühungen immer mehr in diese Richtung. Dasproprietäre Autorensystem Adobe Director [ADURL] unterstützt nach eigenen Angaben„native 3D-Rendering“ und ermöglicht den Import von vorgefertigten 3D-Modellen in dengängigsten Formaten. Adobe Director ist ein Autorensystem für Microsoft Windows undMac OS, das die Erstellung von komplexen, interaktiven Multimedia-Anwendungen un-terstützt. Es kommt hauptsächlich zur Erstellung von kommerziellen Online-Spielen undMultimedia-Anwendungen zum Einsatz, bietet jedoch auch die Möglichkeit Simulationenund E-Learning-Kurse zu erstellen. Die produzierten Anwendungen können entweder off-line oder als Online-Stream genutzt werden. Vorausetzung zur Nutzung ist die Installationdes kostenlosen Webbrowser-Plugins Shockwave. Es werden über 40 Multimedia-Formateaus den Bereichen Text, Grafik, Video und Audio unterstützt. Für die gängigsten 3D-Formate existieren Import- und Exportfunktionen. Nachfolgende Abbildung 3.3 zeigt dieAdobe Director-Entwicklungsumgebung.

21VRML (Virtual Reality Modeling Language) ist eine Beschreibungssprache und ein Standard zurDarstellung von 3D-Inhalten im Internet.

22Das proprietäre Microsoft Silverlight ist ein Webbrowser-Plugin und ermöglicht die Entwicklung vonmultimedialen Internet-Anwendungen sowie deren Darstellung. Weitere Informationen siehe: http://silverlight.net/.

26

Page 36: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.3 Adobe Director

Abbildung 3.3: Entwicklungsumgebung von Adobe Director (Screenshot lokal ausgeführ-te Anwendung)

Zur Erstellung der Inhalte verfügt Adobe Director über die Programmiersprache Lin-go, die eigens für das Autorensystem entwickelt wurde, und JavaScript, um Nutzern diebereits Programmiererfahrung haben den Einstieg zu erleichtern. Lingo ist keine objekt-orientierte Sprache, besitzt jedoch objektorientierte Ansätze. Weiterhin ermöglichen sog.code snippets, das sind kleine vorgefertigte Code-Bausteine, die Erstellung von einfacheninteraktiven Inhalten, ohne selbst programmieren zu müssen.Um Echtzeit-3D-Inhalte zu integrieren, besitzt Adobe Director eine eigene 3D-Engine,Shockwave 3D. Shockwave 3D bietet einen großen Funktionsumfang, u.a. die Erstellungvon schlüsselbildbasierten Animationen (Keyframing) oder skelettbasierten Animationen.Für Windows werden als Hardware-Renderer OpenGL und Direct3D unterstützt, Mac-Nutzern steht OpenGL zur Verfügung. Zur Erstellung von realistischen physikalischenEffekten verwendet Shockwave 3D die Physik-Engine NVIDIA PhysX23.Als Fazit läßt sich sagen, daß Adobe Director ein sehr mächtiges Autorensystem ist,das über einen gewaltigen Funktionsumfang verfügt. Gerade deshalb dürfte die Einarbei-tungszeit dementsprechend lang ausfallen. Zur Unterstützung in die Einarbeitung existie-ren im Internet unzählige Foren und Tutorials, die die zahlreichen Funktionen vorstellenund erläutern. Ein großer Nachteil ist jedoch, daß Adobe Director kommerziell ist unddie aktuelle Version 11.5 stolze 999 US-Dollor kostet.

23Um die Physik-Engine NVIDIA PhysX verwenden zu können, wird eine PhysX-fähige GeForce Grafik-karte von NVIDIA benötigt. Weitere Informationen siehe: http://www.nvidia.de/object/nvidia_physx_de.html.

27

Page 37: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten

3.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten

In der Fachwelt ist eine rege Diskussion über den Nutzen von Visualisierungen vonComputergrafik-Algorithmen im Bereich des E-Learnings entstanden [AVS07]. EinigeStudien zeigen, daß Visualisierungen das Lernen deutlich verbesseren [EAS99], [EEA94],[HLV00], andere jedoch sehen durch die Benutzung von Visualisierungen zu Lernzwecken,keine signifikante Verbesserung des Lernerfolges [ABP04], [TEA96], [VLA00]. Das Pro-blem an einer Bewertung des Nutzens von Visualisierungen ist, daß die dafür benötigtenUntersuchungen und Experimente empirisch sind. Im Mittelpunkt dieser Untersuchun-gen steht der Mensch und seine Lernfähigkeit. Es ist kaum möglich alle Faktoren, die dasLernen des Menschen beeinflussen, in einer solchen empirischen Untersuchung zu berück-sichtigen, sodaß es so gut wie zu jeder Untersuchung in diesem Bereich gegensätzlicheMeinungen gibt. Worin sich die Fachwelt jedoch einig ist, ist die Tatsache, daß Visua-lisierungen den Lernerfolg verbessern, wenn sie die Motivation des Lernenden steigern,weil der Lernende dadurch härter arbeitet. Somit haben motivationsfördernde Visuali-sierungen einen signifikanten Nutzen [AVC07].In [AVS07] wurde versucht so viele Visualisierungen aus dem Bereich der Computergra-fik wie möglich zu finden, zu kategorisieren und zu analysieren. Es wurden mehr als 350existierende Computergrafik-Visualisierungen ausgewertet. Das Ergebnis ist ernüchternd.Die meisten haben nur einen sehr geringen didaktischen Nutzen. Sie geben dem Lernen-den kein besseres Verständnis davon, wie der visualisierte Algorithmus funktioniert.Ein wichtiger Aspekt, um die Motivation des Lernenden zu erhöhen, ist, daß er wäh-rend der Benutzung einer Visualisierung aktiv involviert sein sollte [DDL05]. Dadurchergibt sich, daß reine Animationen, die von den sechs Stufen der Interaktivität einerMultimedia-Anwendung Stufe I darstellen (siehe Kapitel 2.6), didaktisch weniger geeig-net sind als Visualisierungen mit einem höheren Interaktionsgrad, also Stufen II bis VI.Dies ist ein weiterer Punkt, warum viele der in [AVS07] gefundenen Visualisierungen di-daktisch nahezu wertlos sind, denn ca. 50 Prozent der gefundenen Visualisierungen sindreine Animationen ohne entscheidende Interaktivität.Grundsätzlich ist zu bemängeln, daß viele Visualisierungen nur schöne Grafiken bieten,jedoch keine große didaktische Hilfe sind [UAA01]. Das Erstellen der Grafiken ist bereitsoft mit großem Aufwand verbunden. Aufgrund dessen wird in [PEV07] eine Bibliothekvon Java-Klassen mit dem Namen „JHAVÉ“, was eine Abkürzung für „Java-Hosted Al-gorithm Visualization Environment“ ist, vorgestellt. JHAVÉ soll es einem Autor ermög-lichen, pädagogisch effektive Algorithmen-Visualisierungen zu erstellen [PEV07]. Unter[JHAVÉ] steht JHAVÉ zum Download bereit. Weiterhin stehen einige Visualisierungen

28

Page 38: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten

von Algorithmen zur Verfügung, die direkt online per Java Web Start24 geladen und ver-wendet werden können. Jedoch ist unter den verfügbaren Algorithmen kein einziger ausdem Themenbereich der Computergrafik. Während des Ablaufs einer Simulation werdenZwischenfragen gestellt, um den Lernfortschritt zu ermitteln (siehe Abbildung 3.4). Dieweitere Ausführung hängt jedoch nicht von dem Beantworten der Fragen ab, sondern eswird die Möglichkeit gegeben, die selbe Frage nochmal zu beantworten.

Abbildung 3.4: Visualisierung von Bubbelsort in JHAVÉ (Screenshot lokal ausgeführteAnwendung)

JHAVÉ ermöglicht ein schrittweises Vor- und Zurücknavigieren sowie die direkte Auswahleines bestimmten Schrittes. In der rechten Hälfte des Fensters werden Informationstex-te zum Algorithmus oder wahlweise der Algorithmus selbst als Pseudo-Quellcode mitSyntaxhighlighting dargestellt. Auffällig ist, daß die Grafiken in Pseudo-3D bzw. 2,5Ddargestellt werden. Ein großer Nachteil ist, daß keine volle 3D-Unterstützung vorhandenist.In [ITM96] werden eine in C geschriebene Klassen-Bibliothek und einige unter deren Ver-wendung geschriebene Module, die zu Lernzwecken dienen sollen, vorgestellt. Im Gegen-satz zu [PEV07] sind diese Module ausschließlich Visualisierungen von Computergrafik-Algorithmen. Vertreten sind z.B. einfache Transformationen, Viewportberechnung, derBresenham-Algorithmus und die Komposition von einfachen geometrischen Objekten zueinem komplexeren Objekt. Jedoch ist auch hier der große Nachteil, daß die Darstellungder Visualisierung ausschließlich in 2D erfolgt.Ein weiteres Algorithmen-Animations-Tool ist ANIMAL [ANI00]. Es bietet, im Gegen-

24Java Web Start ist eine Technologie von Sun Microsystems, die es ermöglicht online verfügbare Java-Anwendungen herunterzuladen und diese direkt lokal auszuführen. Weitere Informationen siehe:http://java.sun.com/javase/technologies/desktop/javawebstart/index.jsp.

29

Page 39: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten

satz zu den bisher vorgestellten Visualisierungs-Tools, u.a. die Möglichkeit einfache Ani-mationen durch einen visuellen Editor ganz ohne Programmierung zu erstellen. Die damiterstellten Algorithmen-Visualisierungen wurden an der Universität Siegen zu Lernzwe-cken verwendet. Allerdings bietet auch dieses Tool wieder nur eine 2D-Darstellung derInhalte. ANIMAL und das Animal Animation Repository stehen unter [ANWEB] zurVerfügung. Jedoch ist unter den verfügbaren Algorithmen, genau wie bei JHAVÉ, keineinziger aus dem Themenbereich der Computergrafik.Eine „echte“ 3D-Darstellung der Lerninhalte wird von dem System, das in [WCG98] vor-gestellt wird, ermöglicht. Es baut auf dem Java 2D-API auf, das durch eigene Klassen, dieOpenGL verwenden, in die dritte Dimension erweitert wurde. Java 3D war zum Zeitpunktder Entwicklung dieses System noch nicht auf dem Markt, jedoch stand das Release kurzbevor. Das System verwendet genau wie Java 3D einen Szenegraphen zum Erstellen derSzene. Die Autoren gehen davon aus, daß ihre eigenen Klassen durch Java 3D ersetztwerden könnten. Dadurch, daß Java 3D noch nicht verwendet wird, stellt das Systemjedoch keine nützliche Basis für das Entwickeln von aktuellen 3D-Visualisierungen dar.Ein grundlegendes Problem ist die Schwierigkeit des Auffindens von geeigneten Visuali-sierungen im Web. Eine Ursache dafür ist, daß keine großen Visualisierungsarchive, dieviele Visualisierungen bereithalten, existieren. Dadurch gestaltet sich das Auffinden einerVisualisierung zu einem bestimmten Thema schwierig [AVS07]. Einige kleinere Visuali-sierungssammlungen, die einige Computergrafik-Algorithmen enthalten, werden nachfol-gend vorgestellt.Mit dem Namen „Computer Graphik spielend lernen“ stehen unter [WSIGR] 70 inter-aktive Visualisierungen von Computergrafik-Algorithmen als Java-Applets, die im Web-browser ausgeführt werden können, bereit. Einige Inhalte werden in 3D repräsentiert.Zu den Applets stehen sog. Kursbücher zur Verfügung, die vermutlich einen zum je-weiligen Thema passenden Erklärungstext und weiterführende Informationen enthalten,jedoch sind diese durch einen Passwortschutz versehen und so nur Zugangsberechtigtenzugänglich. Erklärungstexte zu den einzelnen Visualisierungen existieren nicht. Der nichtzugangsberechtigte Benutzer wird mit dem was er sieht und an Parametern einstellenkann völlig allein gelassen. Dadurch verlieren diese Visualisierungen didaktisch deutlichan Wert. Diese Sammlung ist an der Universität Tübingen für Lernzwecke zum Einsatzgekommen. Die Visualisierungen wurden mit dem in [WCG98] vorgestellten System ent-wickelt.EineWebseite, die sich „The Complete Collection of Algorithm Animations“ nennt [TCCAA],stellt einige Links zu diversen Algorithmen-Animationen bereit. Darunter befindet sichjedoch kein einziger Computergrafik-Algorithmus sowie kein einziger Algorithmus, dessen

30

Page 40: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.4 Visualisierung von Computergrafik-Algorithmen und 3D-Inhalten

Inhalt in 3D dargestellt wird. Letztmals aktualisiert wurde die Seite 2001. Dementspre-chend führen viele der angegebenen Links zu nicht mehr existierenden Seiten.Im Zusammenhang mit der in [AVS07] erwähnten Arbeit, wurde von den Autoren „AlgoViz-Wiki“ [DSAVW] erstellt. Diese Webseite ist eine Art Katalog, in dem sich Links zuVisualisierungen von Datenstrukturen und Algorithmen befinden. Insgesamt sind 435Visualisierungen verzeichnet. Zu jeder einzelnen Visualisierung existiert eine Beschrei-bung, die u.a. angibt, um welche Art von Visualisierung es sich handelt, wann der letzteZugriff darauf erfolgte, zu welchem Themenbereich sie gehört und ob sie nach Meinugder Autoren zu empfehlen ist. Erstaunlicherweise ist unter den 435 gelisteten Visualisie-rungen nur eine einzige aus dem Themenbereich der Computergrafik. Der dazugehörigeLink verweist auf ein weiteres Archiv von Algorithmen-Visualisierungen [JAAPC]. DieRepräsentation der in diesem Archiv enthaltenen Visualisierungen von Computergrafik-Algorithmen ist überwiegend in 2D. Lediglich drei Visualisierungen zeigen den Inhalt in3D. Zwei davon stellen Transformationen im Dreidimensionalen dar, und die Dritte zeigtdie Funktionsweise von Projektionen. Zu diesen drei Visualisierungen existieren keine er-klärenden Texte. Die Interaktionsmöglichtkeiten beschränken sich ausschließlich auf dieAuswahl der darzustellenden Animation. Dies entspricht lediglich Stufe I der sechs Stufender Interaktivität einer Multimedia-Anwendung (siehe Kapitel 2.6).Die Verwendung einer 3D-Darstellung hat gegenüber einer 2D-Darstellung in Visualisie-rungen sowohl Vorteile als auch Nachteile. Eine 3D-Darstellung gibt dem Benutzer einenweiteren Freiheitsgrad. Dieser kann es dem Benutzer einfacher machen das Gezeigte zuverstehen [VOS93]. Ein großes Problem ist jedoch die Navigation in 3D-Inhalten. Eskann zu Orientierungsschwierigkeiten des Benutzers kommen und zur Verdeckung bzw.zum Verlust von essentiellen Informationen durch die Projektion der 3D-Szene auf den2D-Bildschirm [VCG96]. Deshalb ist es wichtig dem Benutzer, so oft wie möglich, eineadäquate Rückmeldung und eine gute Übersicht zu geben [IBR03].Sicherlich sind 3D-Darstellungen nicht immer und für jedes Thema besser geeignet als2D-Darstellungen. In einem Experiment, in dem es darum geht, daß Versuchspersonensich Buchstaben und Länderflaggen einprägen sollen, spielt es für den Erfolg keine Rolle,ob das Interface drei- oder zweidimensional ist, wie in [RIM04],[RIM01] und [EEM02]gezeigt wird. Ob eine 3D-Darstellung letzten Endes für ein bestimmtes Problem bessergeeignet ist als 2D, hängt vom Problem selbst und der Umsetzung der Visualisierungab. Eine didaktisch effektiv erstellte 3D-Visualisierung ist sicherlich eine Bereicherungfür Algorithmen, die selbst im Dreidimensionalen arbeiten. Dies gilt insbesondere fürkomplexe Computergrafik-Algorithmen, wie Raytracing oder Radiosity.

31

Page 41: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.5 Simulation und Visualisierung von Radiosity

3.5 Simulation und Visualisierung von Radiosity

Wie in Kapitel 3.4 schon erwähnt, gestaltet sich das Auffinden einer Visualisierungoder einer Simulation zu einem bestimmten Thema schwierig [AVS07]. Besonders 3D-Visualisierungen und 3D-Simulationen von Computergrafik-Algorithmen sind entwedersehr rar oder so im Internet hinterlegt, daß sie mit konventionellen Suchmethoden nichtaufzufinden sind. Im vorhergehenden Kapitel 3.4 wurde ein Archiv [WSIGR], das Visuali-sierungen und Simulationen von Computergrafik-Algorithmen enthält, bereits vorgestellt.Es enthält zwei Java-Applets, die Progressive-Refinement-Radiosity in der Shooting-Variante visualisieren. Das erste Applet ist nicht viel mehr als eine Animation, durch dieschrittweise navigiert werden kann. In jedem Schritt ist eine mit Radiosity beleuchteteSzene zu sehen. Jeder Navigationsschritt entspricht dabei einem Progressive-Refinement-Iterationsschritt (siehe Abbildung 3.5).

Abbildung 3.5: Visualisierung von Progressive-Refinement-Radiosity (Screenshot von[WSIP1])

Das zweite Applet ermöglicht deutlich mehr Interaktion. Es können verschiedene Para-meter wie Iterationschritt, Fehler, Intensität und Zeichenmodus eingestellt werden. MitZeichenmodus kann zwischen einer Wireframe-Darstellung, Radiosity oder Radiosity mitambienter Beleuchtung gewählt werden. Die Ansicht der 3D-Szene kann mit der Mausbeliebig rotiert werden (siehe Abbildung 3.6).

32

Page 42: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.5 Simulation und Visualisierung von Radiosity

Abbildung 3.6: Interaktive Visualisierung von Progressive-Refinement-Radiosity(Screenshot von [WSIP2])

Beide Visualisierungen enthalten keine Erklärungstexte oder Hinweise welche Auswir-kung einzelne Parameter haben. Der Benutzer wird mit der Visualisierung „allein gelas-sen“, sodaß der didaktische Nutzen dieser Visualisierungen fraglich ist.Eine weitere Radiosity-Visualisierung steht unter der Webseite [RADSG] bereit. Sie zeigtden grafischen Unterschied zwischen Progressive-Refinement-Radiosity als Shooting- undals Gathering-Variante. Aufgrund von technischen Inkompatibilitäten konnte das Appletleider nicht ausgeführt werden. Nach Angaben der Webseite, kann in dieser Visualisie-rung einer der beiden Algorithmen ausgewählt werden. Dieser Algorithmus wird auf einevorgefertigte Szene angewandt, um diese zu beleuchten. Die aus den einzelnen Iteratio-nen resultierenden Beleuchtungsveränderungen der Szene werden schrittweise, animiertdargestellt. Zusätzlich ist die Formfaktormatrix und deren Veränderung während der ein-zelnen Iterationen dargestellt. Die Kamera kann in der 3D-Szene frei bewegt werden. AlsParameter lassen sich u.a. ein Wert für „Mesh Density“, also wie fein die Szene in Patchesunterteilt ist sowie die Art des Shadings, zur Auswahl stehen Flat- und Gouraud-Shading,auswählen. Gegenüber den vorher vorgestellten Visualisierungen ist der Funktionumfangzwar etwas größer, jedoch existieren auch in dieser Visualisierung keine Erklärungstexte.Wie genau die Radiosity-Algorithmen arbeiten wird nicht erklärt.Im selben Archiv, in dem die gerade vorgestellte Radiosity-Visualisierung enthalten ist,existiert eine weitere Simulation und Visualisierung des Radiosity-Verfahrens [RADFF].Diese zeigt die Abhängigkeit des Formfaktors vom Winkel und der Distanz der bei-

33

Page 43: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.5 Simulation und Visualisierung von Radiosity

den zum Formfaktor zugehörigen Flächen. Aufgrund von technischen Inkompatibilitätenkonnte leider auch dieses Applet nicht ausgeführt werden. Somit bezieht sich die folgen-de Auswertung wiederum auf Angaben der Webseite dieser Simulation. Zu sehen ist eine3D-Szene, in der zwei Flächen dargestellt sind, zu denen der Formfaktor ermittelt werdensoll. Unter dieser Darstellung wird ein Graph angezeigt, der wahlweise die Abhängigkeitdes Formfaktors von dem Winkel, in dem die beiden Flächen zueinander stehen oder vonder Distanz zwischen den beiden Flächen, darstellt. Der Benutzer hat die Möglichkeitzwischen einem dieser beiden Darstellungen zu wählen und den Winkel bzw. die Distanzder beiden Flächen zu ändern. Genau wie in der vorhergehenden Visualisierung kannauch in dieser die Kamera frei in der 3D-Szene bewegt werden. Diese Simulation ist dieerste bisher vorgestellte, die zumindest einen Teilaspekt des Radiosity-Algorithmus dar-stellt. Der Benutzer kann nachvollziehen, welche Faktoren in der Formfaktorberechungberücksichtigt werden müssen. Ein wichtiger Faktor, von dem die Formfaktorberechnungebenfalls abhängt, die Sichtbarkeit bzw. Verdeckung von Flächen, bleibt hier jedoch un-berücksichtigt. Auch in dieser Visualisierung fehlen erklärende Texte. Wenn Benutzernicht schon Vorkenntnisse von Radiosity haben und somit wissen, was sie in dieser Vi-sualisierung sehen sollen, werden sie nur wenig von dem Dargestellten verstehen können.Eine in Visual C++ geschrieben Radiosity-Visualisierung wird auf folgender Webseitevorgestellt [RAGDR]. Diese Visualisierung basiert auf einem abgeänderten Radiosity-Verfahren, daß als Initialisierung von jedem Patch der Szene einen Strahl zur Lichtquelleaussendet. Erreicht dieser Strahl die Lichtquelle, so wird das Patch in Farbe und In-tensität der Lichtquelle voll beleuchtet und dessen Farbe entsprechend gesetzt. Falls derStrahl durch Verdeckung nicht ankommt, wird das Patch schwarz gefärbt. Nach dieserInitialisierung wird Progressive Refinement Radiosity in der Gathering-Variante mittelseines Hemi-Cubes berechnet. Die Szene wird je nach Bedarf während der Berechnungadaptiv unterteilt. Die Visualisierung ermöglicht es die Szene nach einzelnen Iterations-schritten zu betrachten. In der Szene kann ein Patch gewählt werden und die Projektionder Szene auf den entsprechenden Hemi-Cube als 2D-Grafik in einem separaten Fensterangezeigt werden. Es ist auch möglich die adaptive Unterteilung als Gitterstruktur in derSzene anzeigen zu lassen. In Abbildung 3.7 ist die Anwendung dargestellt.Der Funktionsumfang dieser Visualisierung ist wesentlich größer, als bei den bisher Vor-gestellten. Jedoch fehlen auch hier wieder erklärende Texte, sodaß der Benutzer Radiositykennen muß, um zu verstehen, was die angebotenen Darstellungen verdeutlichen sollen.

34

Page 44: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.5 Simulation und Visualisierung von Radiosity

Abbildung 3.7: Interaktive Visualisierung einer Radiosity-Variante (übernommen von[RAGDR])

Ein Radiosity-Visualisierungs-Tool zur Darstellung von klassischem, Progressive Refine-ment und Wavelet Radiosity25 ist radvis. Es basiert auf dem Radiosity-Renderer Radiatorund bildet dessen Visualisierungs-Frontend. Auf der Webseite von radVis [RAVIS] stehtdas Tool zusammen mit Radiator zum kostenlosen Download bereit. Eine Dokumenta-tion der zahlreichen Funktionen und Einstellungen steht ebenfalls zur Verfügung. Dieseist auch nötig, denn wie in Abbildung 3.8 zu sehen ist, ist radvis nicht sonderlich über-sichtlich gestaltet.

Abbildung 3.8: Das Radiosity-Visualisierungs-Tool radvis (übernommen von [RAVIS])

25Weitere Informationen zu Wavelet Radiosity siehe: [WRA93]

35

Page 45: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.6 Zusammenfassung

Im linken Bereich des Fensters wird die 3D-Szene dargestellt. Auf der rechten Seite, überden Einstellungsmöglichkeiten, befindet sich die Ansicht der Formfaktormatrix, deren In-halt je nach Art des visualisierten Radiosity-Verfahrens variiert. Ein Vorteil von radvis istdas mehrere Radiosity-Verfahren visualisiert werden können und zu jeder Variante vieleParameter einstellbar sind. Nachteilig ist, daß radvis nur für Red Hat Linux verfügbarist. Weiterhin fällt die unübersichtliche Anordnung der Bedienelmente auf. Der Benutzerwird beim ersten Betrachten von der Vielfalt der Möglichkeiten regelrecht „erschlagen“.Auch diese Radiosity-Visualisierung bietet keine Erklärungstexte.

3.6 Zusammenfassung

Für eine Lernanwendung mit 3D-Inhalten ist die Interaktion mit diesen Inhalten einzentrales Element. Es existieren so gut wie keine Autorensysteme, die dem Autor die Er-stellung von komplexen, interaktiven 3D-Inhalten erleichtern. Alle komplexen 3D-Inhaltemüssen per Hand programmiert werden. Adobe Director unterstützt zwar die Entwick-lung von 3D-Inhalten, erzeugt jedoch keine mit Lernplattformen kompatiblen Kurse,sondern eigenständige Anwendungen. Ein weiterer Ausschlußgrund für die Verwendungvon Adobe Director zur Erstellung der für diese Arbeit implementierten Lernanwendungist, daß die Software proprietäre ist. Generell ist es nicht möglich komplexe 3D-Inhalte alsLernkurse, nach den E-Learning-Standards SCORM oder AICC, mit den aktuell gängigenund den in dieser Arbeit vorgestellten Autorenwerkzeugen zu erstellen. Die hier vorge-stellten Autorensyteme sind somit nicht geeignet um die visuelle Simulation von Radiosityvollständig in ihnen zu entwerfen. Als Resultat daraus kann die 3D-Lernanwendung auchgleich manuell, ohne Verwendung eines E-Learning-Autorensystems, erstellt werden.Einen möglichen Einsatz für ein Autorensystem bietet sich jedoch in der Gestaltung einesKurses zum angeleiteten Lernen, sodaß der Kurs das Lernen mit der 3D-Lernanwendunginstruiert oder zum Entwurf von Test- und Fragebögen, die der Lernkontrolle dienensollen. Die hier vorgestellten Autorensysteme bieten eine gute Auswahl an vorgefertigtenFragetypen, die zu diesem Zweck verwendet werden können. Wie in Kapitel 3.1 beschrie-ben entstehen bei der Online-Verwendung von mit CourseLab erstellten Kursen unschöne,störende Effekte. Letzendlich bietet es sich an, für die Erstellung des anleitenden Kurses,zu der in dieser Diplomarbeit entwickelten Lernanwendung, das Autorenwerkzeug Lern-Bar zu verwenden, das an der selben Professur weiterentwickelt wird, an der auch dieseDiplomarbeit geschrieben wurde.Eine kleine Erleichterung in der Erstellung von 3D-Inhalten bietet Java 3D. Durch seine

36

Page 46: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3.6 Zusammenfassung

bereitgestellten Klassenbibliotheken ist Java 3D nicht so „lowlevel“ zu programmieren,wie z.B. OpenGL. Es erlaubt plattformunabhägige, online verfügbare 3D-Inhalte zu ent-werfen. Der Zusammenbau des 3D-Inhaltes mit den Navigationselementen und den An-weisungstexten des GUI muß jedoch manuell ausgeführt werden.Wie in Kapitel 3.4 zu sehen war, werden in den meisten existierenden Computergrafik-Visualisierungen die Inhalte lediglich zweidimensional dargestellt. Die 3D-Darstellungkann jedoch die Motivation und das Verständnis des Benutzers erhöhen, bringt aber auchdas Problem der Navigation in 3D-Inhalten sowie die möglichen Orientierungsschwierig-keiten des Benutzers und den möglichen Verlust von essentiellen Informationen mit sich.Ob eine 3D-Darstellung letzten Endes für ein bestimmtes Problem besser geeignet istals 2D, hängt vom Problem selbst und der Umsetzung der Visualisierung ab. Eine di-daktisch effektiv erstellte 3D-Visualisierung ist besonders für den im Dreidimensionalenarbeitenden Radiosity-Algorithmus äußerst nützlich.Das Auffinden von Visualisierungen und Simulationen zu einem bestimmten Thema istdurch die mangelnde Verwaltungsinfrastruktur (es existieren nur wenige kleine Archi-ve) schwierig. Ein Großteil der Visualisierungen kann nicht ohne erheblichen Aufwandzum Laufen gebracht werden. Lediglich Java-Applets bieten eine gute Möglichkeit, ob-wohl selbst diese veralten können, wodurch technische Inkompatibilität das Ausführenunmöglich macht.Wie in Kapitel 3.5 beschrieben wird in Visualisierungen und Simulationen oft nur dasVerhalten und das Ergebnis des Algorithmus gezeigt, und nicht wie der Algorithmus zudem entsprechenden Ergebnis kommt, sodaß der didaktische Nutzen der entsprechendenVisualisierungen sehr fraglich ist. Insbesondere erklärt keine der vorgestellten Radiosity-Visualisierungen wie es zu den dargestellten Ergebnissen von Radiosity kommt, also wieRadiosity eigentlich berechnet wird und funktioniert. Sie zeigen lediglich die Ergebnissebzw. die Auswirkungen von Radiosity-Berechnungen auf eine Szene und ermöglichen die-se auf verschiedene Weise durch Einstellungen zu ändern bzw. die Ansicht des Ergebnisseszu ändern. Erklärungstexte fehlen gänzlich. Ein Großteil der existierenden Visualisierun-gen sind reine Animationen ohne hohen Interaktionsgrad [AVS07]. Dadurch haben vieleVisualisierungen nur einen geringen didaktischen Wert.Die Entwicklung von Simulationen, Visualisierungen und Animationen in 3D erfordert,ohne die Zuhilfenahme von vorgefertigten Komponenten, eine Menge an Entwicklungs-aufwand. Deshalb verwundert es auch nicht, daß Visualisierungen und Simulationen vonAlgorithmen in 3D bisher nur im geringen Maße im Bereich des E-Learnings zum Einsatzkommen. Somit ist in diesem Bereich großer Bedarf nach didaktisch effektiv erstellten3D-Visualisierungen und 3D-Simulationen, u.a. auch für Radiosity.

37

Page 47: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4 Konzept

„Je planmäßiger die Menschen vorgehen, desto wirksamer trifft sie der Zufall.“

Friedrich Dürrenmatt

4.1 Anforderungsanalyse

Der Titel der Diplomarbeit ist „Visuelle Simulation eines Radiosity Algorithmus und ihreAnwendung in Lernprozessen“. Die Aufgabe in dieser Diplomarbeit ist die Konzeption undImplementierung einer 3D-Simulation eines Radiosity-Verfahrens, als Lernanwendung zuE-Learning-Zwecken. Die Lernanwendung soll angeleitetes Lernen ermöglichen, d.h., es istein E-Learning-Kurs zu entwickeln, der den Lernenden durch die Lernanwendung führt.Der Kurs soll zusammen mit der Lernanwendung dem Erlernen des Radiosity-Verfahrensdienen. Als Randbedingungen ist vorgegeben, Java und Java 3D zur Entwicklung derLernanwendung zu verwenden und weiterhin die Verwendung der LernBar zum Erstellendes anleitenden Kurses.Als Radiosity-Verfahren wurde Progressive-Refinement Gathering mittels Hemi-Cube ge-wählt. Die Wahl des Verfahrens begründet sich darin, daß das simulierte Verfahren mög-lichst anschaulich in 3D darstellbar sein soll. Dadurch ist das Wavelet-Verfahren schonmal kein geeigneter Kandidat. Weiterhin soll das gewählte Verfahren möglichst viele In-halte bieten, für die eine 3D-Darstellung dem Lernenden einen echten Vorteil bietet. Dasklassische Radiosity-Verfahren verwendet die meiste Zeit damit, mit einem iterativenVerfahren, wie z.B. das Gauss-Seidel-Verfahren, die Formfaktormatrix zu lösen und pro-fitiert somit nur wenig von einer 3D-Darstellung. Dadurch ist auch dieses Verfahren keingeeigneter Kandidat. Progressive Refinement hingegen ist eine gute Wahl. Es liefert, imGegensatz zum klassischen Radiosity, anzeigbare Zwischenergebnisse, die es dem Lernen-den erlauben zu verstehen, was sich nach jedem Iterationsschritt an der Szene veränderthat. Wie schon in Kapitel 2.5.4 erwähnt, existiert Progressive Refinement in den zwei

38

Page 48: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.1 Anforderungsanalyse

Varianten Shooting und Gathering. Beide Verfahren sind gute Kandidaten, jedoch istdie Grundidee des Gathering-Verfahrens dem klassischen Radiosity ähnlicher. Für dasEinsammeln (to gather) des auf ein Patch einfallenden Lichtes wird ein Hemi-Cube ver-wendet. Auch dieses Vorgehen profitiert von einer Darstellung in 3D.Die Zielgruppe der Lernanwendung und des Kurses sind Informatikstudenten, die gewisseGrundlagen im Bereich der Computergrafik mitbringen. Voraussetzung sind mathema-tische Grundkenntnisse sowie Kenntnisse in der Beleuchtungsrechnung und im Shading.Weder Kurs, noch Lernanwendung sollen ein Ersatz für die Präsenzlehre sein, sondernsollen diese ergänzen.Allgemeines Lernziel der Lernanwendung und des Kurses ist, zu verstehen, was Radio-sity ist, wie es sich auf eine Szene auswirkt, was es kann oder nicht kann und wie derAlgorithmus des ausgewählten Radiosity-Verfahrens im Detail funktioniert. Nachfolgendwerden die detailierten Lernziele aufgelistet. Der Lernende soll folgendes verstehen underlernen:

1. Radiosity-Gleichung und deren einzelnen Terme

2. Formfaktoren und deren Eigenschaften

3. Progressive Refinement

4. Veränderung der Szene nach den jeweiligen Iterationsschritten des Progressive Re-finements (color bleeding, weiche Schatten)

5. Laufzeit und Speicherplatzkomplexität von Radiosity allgemein und der vorgestell-ten Variante

6. Aufbau, Struktur, Nutzen und Berechnung eines Hemi-Cubes sowie dessen Elemen-te (Hemi-Cube-Pixel, Delta-Formfaktoren)

7. Vor- und Nachteile des Radiosity-Verfahrens

Die Lernanwendung soll, anhand einer mit Radiosity gerenderten Szene und weiteren3D-Darstellungen, die in den Lernzielen definierten Themen anschaulich darstellen. InKapitel 3.6 wurde festgestellt, daß viele Visualisierungen und Simulationen reine Anima-tionen sind, die oft gar keine erklärenden Texte bereit stellen. Die zu implementierendeLernanwendung soll dahingegen didaktisch wertvoller sein und sowohl einen höheren In-teraktionsgrad als reine Animationen haben, als auch Erklärungstexte beinhalten, diedem Lernenden u.a. erläutern, was er sieht und was davon besonders wichtig bzw. in-teressant ist. Weiterhin soll ein Pseudo-Quellcode des verwendeten Algoritmus angezeigt

39

Page 49: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.2 Ablauf der Lernanwendung und des Kurses

werden, in dem der gerade ausgeführte Schritt der Lernanwendung durch Syntaxhigh-lighting markiert wird.Der in der LernBar zu erstellende Kurs soll dem Lernenden die theoretischen Hintergrün-de zu den einzelnen Themen der Lernziele erläutern und möglichst so aufgebaut sein, daßder Benutzer die Reihenfolge, in der er die Lektionen verwendet, selbst bestimmen undeine Lektion ggf. überspringen kann. Zur Kontrolle des Lernfortschritts des Benutzerssollen zu jeder Lektion Fragen konzipiert werden.Die Lernanwendung und der Kurs sollen simultan ausgeführt werden und so konzipiertsein, daß sie „Hand in Hand greifen“, sodaß der Lernende zu jedem Zeitpunkt weiß, was erzu tun hat. Dazu müssen die Erklärungstexte Überleitungen enthalten, die das Wechselnzwischen Kurs und Lernanwendung vorgeben und beschreiben.

4.2 Ablauf der Lernanwendung und des Kurses

Der Lernende beginnt mit dem Lesen des Kurses. Dieser vermittelt die theoretischenHintergrundinformationen zu den einzelnen in 4.1 genannten Lernzielen und weist denBenutzer an bestimmten Stellen an, zur Lernanwendung zu wechseln. In der Lernanwen-dung führt der Benutzer vorgegebene Schritte aus, um die gerade gelesene Theorie durchdie 3D-Inhalte der Lernanwendung zu vertiefen und zu ergänzen, bis die Lernanwendungwieder zum Kurs überleitet. Am Ende von einigen Lektion des Kurses werden dem Ler-nenden Fragen zur gerade abgeschlossenen Lektion gestellt. Folgende Lektionen sollensowohl im Kurs, als auch in der Lernanwendung erstellt werden, in Klammern ist dieZuordnung des entsprechenden Lernziels aus Kapitel 4.1 angegeben:

1. Kurs - Einleitung: Beschreibt die Zielsetzung, den Aufbau und die Voraussetzungendes Kurses.

2. Radiosity - Einleitung: Erklärt Radiosity, dafür notwendige Voraussetzungen, dieRadiosity-Gleichung, sowie Formfaktoren. (1. und 2. Lernziel)

3. Bedienungsanleitung: Macht den Benutzer mit dem GUI der Lernanwendung ver-traut.

4. Initialisierung: Beschreibt die notwendigen Initialisierungen des Progressive Re-finements und zeigt die einzelnen Initialisierungsschritte an einer 3D-Szene. (3.Lernziel)

5. Progressive Refinement: Erklärt Progressive Refinement und zeigt die Veränderungeiner 3D-Szene nach den einzelnen Iterationsschritten. (3. und 4. Lernziel)

40

Page 50: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.3 Navigation in 3D

6. Laufzeit- und Speicherplatzkomplexität: Vermittelt wie aufwendig die Radiosity-Berechnung ist und zeigt exemplarisch an einer 3D-Szene, wie viele Hemi-Cubesfür einen einzigen Iterationsschritt berechnet werden müssen. (5. Lernziel)

7. Der Hemi-Cube: Beschreibt den Aufbau sowie die Berechnung des Hemi-Cubesund der dazugehörenden Elemente (Hemi-Cube-Pixel, Formfaktoren). Zeigt einenHemi-Cube in 3D sowie dessen Hemi-Cube-Pixel und die Berechnung der Delta-Formfaktoren. (6. Lernziel)

8. Projektion auf einen Hemi-Cube: Zeigt die Projektion einer 3D-Szene auf die fünfSeiten des Hemi-Cubes. (6. Lernziel)

9. Schlusswort: Die Vor- und Nachteile des Radiosity-Verfahrens werden kurz zusam-mengefaßt. Der Benutzer wird ermutigt die Lernanwendung nochmals selbstständigzu erkunden und auf Details zu achten. (7. Lernziel)

4.3 Navigation in 3D

Die Navigation in der 3D-Szene der Lernanwendung soll dem Benutzer einen möglichstgroßen Grad an Freiheit lassen. Am intuitivsten, ist die Bedienung der Kamera mit derMaus. Dazu sollen, wie in 3D-Darstellungen üblich, die linke und rechte Maustaste zumrotieren und translieren der Kamera sowie das Mausrad zum Zoomen verwendet wer-den. Dabei kann die Rotation auf zwei Achsen beschränkt werden. Die Rotation um dieZ-Achse kann den Benutzer durch die Änderung des Kamera-Up-Vektors verwirren undwird zur Exploration der Szene nicht benötigt.Wie in Kapitel 3.5 bereits erwähnt, kann es zu Problemen mit der Navigation in 3D-Inhalten kommen. Durch die Projektion der 3D-Szene auf den 2D-Bildschirm kann eszu Orientierungsschwierigkeiten des Benutzers und zur Verdeckung bzw. Verlust vonessentiellen Informationen kommen. Deshalb sollte je Iterationsschritt eine geeignete Ka-meraeinstellung vorgegeben werden, die dafür sorgt, daß alle für diesen Schritt wichtigenAspekte sichtbar sind. Die manuelle Steuerung der Kamera durch den Benutzer kann fürihn ungewohnt sein und dazu führen, daß der Benutzer sich dabei „verzettelt“. Deshalbsollen, zusätzlich zu der je Simulationsschritt voreingestellten Kamera, noch verschiedeneandere Kameraansichten vorgegeben werden, die in jedem Schritt zur Verfügung stehen.Diese sollen dem Benutzer andere Einblicke in die 3D-Szene ermöglichen.

41

Page 51: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.4 Entwurf des Graphical User Interfaces (GUI)

4.4 Entwurf des Graphical User Interfaces (GUI)

Das Graphical User Interface (GUI) einer Lernanwendung ist von zentraler Bedeutung.Es sollte übersichtlich, funktionell und einfach bedienbar gestaltet sein sowie sich anallgemeinen Gestaltungsrichtlinien orientieren. Für den LernBar-Kurs wird das Designdurch den LernBar Player und die verwendeten Templates vorgegeben. Das GUI derLernanwendung muß jedoch manuell implementiert werden.Es wurden mehrer Entwürfe des GUI der Lernanwendung gefertigt. Abbildung 4.1 zeigtdie zwei Entwürfe, die es in die engere Wahl geschafft haben.

Abbildung 4.1: Zwei Entwürfe des GUI der Lernanwendung

Der erste Entwurf enthält eine Navigationsleiste am oberen Bildschirmrand, mit der dieLernanwendung navigiert werden kann und alle nötigen Einstellungen getroffen werdenkönnen. In der Mitte wird die 3D-Szene dargestellt. Links davon werden in einem Fens-ter die Erklärungstexte zu jedem einzelnen Simulationsschritt angezeigt. Auf der rechtenSeite befindet sich die Anzeige für den Pseudo-Quellcode des verwendeten Algorithmus.Der zweite Entwurf enthält einen großen Anzeigebereich, in dem die 3D-Szene darge-stellt wird, Informationstexte angezeigt werden sowie die Auswahlmenüs für Parameterder Szene zur Verfügung gestellt werden. Die Erklärungstexte und eine Überschrift, die

42

Page 52: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.4 Entwurf des Graphical User Interfaces (GUI)

beschreibt, was gerade dargestellt wird, werden im Anzeigebereich als On-Screen-Displayeingeblendet. Auf der linken Seite befindet sich im oberen Bereich ein Navigationsbaum(Navigation-Tree), der es ermöglicht einen bestimmten Schritt der Lernanwendung auszu-wählen. Der Navigation-Tree ist so aufgebaut, daß die einzelnen Knoten je einem Themader Lernanwendung entsprechen. Details zu einzelnen Themen und Unterthemen wer-den als Kindknoten an den entsprechenden Elternknoten gehängt. Die einzelnen Knotenkönnen nach Bedarf expandiert oder kollabiert werde, wodurch deren Kindknoten ein-bzw. ausgeblendet werden. Dies führt zu einer übersichtlicheren Anordnung der Themen.Unter dem Navigation-Tree befindet sich die Pseudo-Quellcode-Anzeige.Die beiden Entwürfe unterscheiden sich nicht nur in der Anordnung, sondern auch in derFunktionalität. Im ersten Entwurf wird die Lernanwendung mit einem Vorwärts- undeinem Rückwärts-Button gesteuert. Der Ablauf ist dadurch linear. Im zweiten Entwurfermöglicht der Navigation-Tree einen freien, nicht linearen, durch den Benutzer bestimm-ten Ablauf der Lernanwendung. Die Wahl zwischen den beiden Entwürfen entscheidetEntwurf 2 für sich. Er bietet durch den Navigation-Tree eine besser Navigation, dieden Benutzer weniger einschränkt sowie eine übersichtliche Darstellung der Lernanwen-dungsschritte. Insgesamt erscheint der Entwurf „aufgeräumter“ und weniger „überladen“als Entwurf 1. Eine Erweiterung muß an Entwurf 2 jedoch noch vorgenommen werden.Ursprünglich war angedacht, daß Einstellungen, die den Anzeigebereich betreffen, direktper Kontextmenü vorgenommen werden können. Durch die Navigation in der 3D-Szeneüberschneidet sich die Funktionalität der rechten Maustaste, sodaß ein Kontextmenünicht geeignet ist. Alternativ wird eine Menüleiste am oberen Rand des GUI angelegt.Mit dieser lassen sich benötigte Parameter der 3D-Szene und der gesamten Lernanwen-dung per Menü einstellen.Das GUI sollte so gestaltet sein, daß es sich möglichst an die 8 goldenen Regeln des Iter-face Designs nach Shneiderman hält [EGR87]. Die Regeln und wie sie umgesetzt werdensollen, wird nachfolgend aufgelistet:

1. Strive for consistency: Der Aufbau und die Bedienung von Menüs soll konsistentsein. Für den Aufbau des GUI kann das Java Toolkit Swing verwendet werde, sodaßeinzelne GUI-Elemente in sich konsistent sind. Weiterhin ist bei der Entwicklungdes GUI auf eine konsistente Anordnung und Bedienung der Elemente zu achten.

2. Enable frequent users to use shortcuts: Für erfahrene Benutzer sollte das Menü mitTastaturkürzel bedienbar sein, um schnellere Interaktionen zu ermöglichen. SolcheTastaturkürzel werden im Menü der Lernanwendung angelegt.

3. Offer informative feedback: Die Anwendung sollte aussagekräftige Rückmeldungen

43

Page 53: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.5 Vorrendern der Szene

liefern.

4. Design dialog to yield closure: Verwende Dialoge, um eine Interaktionssequenz alsabgeschlossene Einheit zu repräsentieren.

5. Offer simple error handling: Die Anwendung soll eine geeignete Fehlerbehandlungenthalten. Die Lernanwendung sollte so konzipiert werden, daß Bedienfehler ver-mieden werden, in dem je Interaktionsschritt nicht zu verwendende Bedienelementedeaktiviert werden.

6. Permit easy reversal of actions: Die Anwendung soll Möglichkeiten bereit stellen,die Auswirkungen von Interaktionen rückgängig machen zu können.

7. Support internal locus of control: Der Benutzer sollte das Gefühl haben, daß erjederzeit die Anwendung kontrolliert und nicht die Anwendung ihn.

8. Reduce short-term memory load: Die Belastung des Kurzzeitgedächtnisses des Be-nutzers sollte so gering wie möglich sein. Der Benutzer sollte sich während derBedienung nicht unnötig viel merken müssen.

Als weitere Richtlinie sollte beachtet werden, daß die Menütiefe nicht zu tief sein sollte,sonst verliert der Benutzer die Übersicht [DMS86]. Die Breite eines Menüs sollte vor derTiefe favorisiert werden [DBM84].

4.5 Vorrendern der Szene

Die Berechnung von Radiosity für eine Szene hat einen sehr hohen Laufzeitbedarf. Es istfür den Benutzer nicht zumutbar Minuten bis Studen zu warten, bevor eine Szene ange-zeigt werden kann. Eine Möglichkeit dieses Problem zu umgehen ist, die Szene im Vorauszu rendern und in einer Datei zu speichern. Für das Rendern können externe Radiosity-Renderer verwendet werden und deren Ergebnisse als Lightmaps geladen werden. Eineweiter Möglichkeit ist die Implementierung eines eigenen Radiosity-Renderers mit Ja-va und Java 3D. Die meisten verfügbaren Radiosity-Renderer verwenden das Shooting-Verfahren. Um gegenüber dem gezeigten Radiosity-Verfahren konsistent zu bleiben, wirddie Implementierung eines eigenen Renderers vorgezogen, auch wenn der Lernende davonnicht viel merken wird. Dies vermeidet u.a. Probleme, die in Java 3D mit dem Import undExport einer Szene auftreten können. Es ist z.B. nicht ohne weiteres möglich eine in Java3D erstellte Szene zu exportieren. Zwar existieren vorgefertigte Klassen, die den Im- undExport in gängige Formate erlauben sollen, jedoch treten dabei gelegentlich Bugs mit

44

Page 54: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.6 Darstellung der mit Radiosity gerenderten Szene

den sog. Java 3D-Appearances auf. Diese Objekte enthalten u.a. die Farb- und Texturin-formationen eines 3D-Objektes und gehen gelegentlich beim Im- und Export vollständigverloren.Für das Speichern der vorgerenderten Radiosity-Szene gibt es verschiedene Ansätze. Eskönnen Lightmaps verwendet werden, d.h. Texturen, die für jedes Objekt dessen Hellig-keitswerte (brightness) enthalten. Dieser Ansatz hat das Problem, daß Lightmaps, je nachAnzahl und größe, einen hohen Speicherverbrauch mit sich bringen, sowohl zur Laufzeitim Arbeitsspeicher als auch auf der Festplatte. Eine wesentlich einfachere, platzsparendeMöglichkeit ist, die Szene per Patch zu berechnen und jeden Patchfarbwert in einer Dateizu speichern. Die Anzahl der Patches einer Szene ist wesentlich geringer als die Anzahlder Pixel. Der Nachteil daran ist jedoch, daß zur Laufzeit für jeden einzelnen Patch Farb-werte aus der Datei wieder zugeordnet werden müssen. Dennoch wird diese Methode fürdiese Diplomarbeit vorgezogen, denn Radiosity ist ein sehr speicherintensives Verfahren,das den von der Java Virtuell Machine zur Verfügung gestellten Arbeitsspeicher schnell„sprengen“ kann. Deshalb ist es besonders wichtig, bei der Implementierung des Renderersund der Radiosity-Darstellung die Nutzung des Arbeitsspeichers so gering wie möglichzu halten, und stattdessen möglichst viele Daten zur Laufzeit (on-the-fly) zu generieren.

4.6 Darstellung der mit Radiosity gerenderten Szene

Progressive Refinement Radiosity in der Gathering-Variante konvergiert, im Gegensatzzum Shooting, sehr schlecht. Das führt dazu, daß eine Menge Iterationsschritte notwen-dig sind, bevor in der Szene überhaupt etwas zu erkennen ist. In den ersten Schrittenerscheint die Szene zum größten Teil fast schwarz, sodaß es für die Darstellung der Szenein der Lernanwendung einer zusätzlichen Nachbearbeitung der Szene bedarf. In [PrR88]wird ein Verfahren vorgestellt, daß die Darstellung verbessert, indem ein ambienter Termberechnet wird. Der ambiente Term ist eine Wert zwischen 0 und 1, der durch verschiede-ne Parameter der Szene berechnet werden kann. Durch Anwendung des ambienten Termsauf jeden Patch der Szene, erhöht sich die Helligkeit der gesamten Szene deutlich. Pro-blematisch ist, daß dieses Verfahren für die Shooting-Variante entwickelt wurde und dieBerechnung des ambienten Terms u.a. darauf basiert wieviel Energie in der Szene noch zuverschießen ist. Diese Information fehlt jedoch in der Gathering-Variante, sodaß das Ver-fahren in dieser Form nicht angewandt werden kann. Die Grundidee des ambienten Termskann jedoch aufgegriffen und verwendet werden. Anstatt den ambienten Term dynamischmit der zu verschießenden Energie zu bestimmen, kann z.B. die Durchschnittshelligkeitder Szene berechnet werden und der ambiente Term auf einen Wert festgelegt werde,

45

Page 55: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

4.6 Darstellung der mit Radiosity gerenderten Szene

der die Durchschnittshelligkeit um ein gewisses Maß erhöht. Die Helligkeit jedes Patcheswird dabei durch Addition des ambienten Terms erhöht. Eine weitere Möglichkeit dieDarstellung der Szene zu verbessern ist die Erhöhung des Kontrastes der Szene.Im Radiosity-Verfahren wird ein Patch mit einer Farbe versehen. Dazu werden in Java 3Dallen Vertices (Knoten) eines Patches die selbe Farbe zugewiesen (Per-Patch-Shading).Dadurch scheint es, als wäre auf die Szene Flat-Shading angewandt worden, selbst wennin Java 3D Gouraud-Shading zur Darstellung der 3D-Szene explizit festgelegt wurde. ZurBerechnung von Gouraud-Shading werden die Farben der Vertices über die Fläche desPatches interpoliert. Sind die Farben der Vertices alle gleich, kann kein, für Gouraud-Shading typischer, Farbverlauf entstehen. Dennoch ist es sinnvoll und erforderlich dieSzene mit Gouraud-Shading darstellen zu können, denn dadurch kann der Lernendeeinen besseren Eindruck über die Auswirkungen des Radiosity-Verfahrens auf eine Sze-ne bekommen. Andere Aspekte, wie z.B. das Setzen eines Hemi-Cubes auf einen Patch,lassen sich wiederum mit Flat-Shading besser veranschaulichen. Um Gouraud-Shadingzu ermöglichen, müssen die Vertices eines Patches verschieden Farbwerte zugewiesen be-kommen. Eine Methode zur Bestimmung eines Vertex-Farbwertes, ist den Mittelwert vonallen Farbwerten der Patches, die den Vertex enthalten, zu berechnen. Wurde jeder Vertexjedes Patches der Szene berechnet und zugewiesen, so kann Java 3D Gouraud-Shadingauf die Szene anwenden.Für das Berechnen der Mittelwerte, wird eine Topologie der Szene benötigt. Diese ist inden Geometriedaten von Java 3D nicht enthalten, denn für das Rendern der Geometrienwerden lediglich topographische Informationen benötigt. Die Topologie kann entwederdirekt beim Erstellen der Szene für jeden Patch mit angegeben werden, was jedoch nichtpraktikabel ist, falls vorgefertigte 3D-Objekte zum Einsatz kommen, oder man berechnetdie Topologie aus den Geometriedaten nach dem Erstellen der Szene. Die Verwendungvon vorgefertigten 3D-Objekten soll für die Implementierung der Lernanwendung nichtausgeschlossen werden, sodaß nur eine nachträgliche Berechnung der Topologie in Fragekommt.

46

Page 56: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5 Umsetzung

„Wege entstehen dadurch, dass man sie geht.“

Franz Kafka

Die Lernanwendung wurde auf folgendem System entwickelt: Intel Core 2 Duo E6850, 4GB DDR2 RAM, NVIDIA Geforce 9800 GT mit 1024 MB RAM, Windows Vista Business64 Bit, Java in Version 1.6_014 und Java 3D in Version 1.5.2, Bildschirmauflösung: 1280x 1024 Pixel. Die Lernanwendung wurde für eine Minimalauflösung von 1024 x 768 Pixelentwickelt. Der LernBar-Kurs wurde mit dem LernBar Studio Version 2.1.26 entwickeltund unterliegt dessen Mindestanforderungen.

5.1 Aufbau der Lernanwendung

Die Lernanwendung ist konzipiert als eine interaktive, angeleitete Selbstlerneinheit. DieAufgabe des Anleitens teilen sich der LernBar-Kurs und die Lernanwendung. Vorgesehenist die Lernanwendung für Studenten der Informatik, die bereits Grundkenntnisse in derComputergrafik besitzen.Das in der Lernanwendung vorgestellte Radiosity-Vefahren ist Progressive RefinementGathering mittels Hemi-Cube. Die Lernanwendung besteht aus den in Abbildung 5.1dargestellten sieben Klassen. Die Hauptklasse ist VisualRadiosity. Sie verwendet alleanderen Klassen und erstellt zu Beginn das GUI, den Java 3D-Szenegraph sowie die 3D-Ansicht, in der die Szene dargestellt wird. In ihr enthalten sind der Radiosity-Rendererund Methoden, die den Ablauf der gesamten Lernanwendung steuern.In VisualRadiosity ist die Klasse CodePanel als innere Klasse eingebunden. Sie enthälteinen Pseudo-Code des verwendeten Radiosity-Verfahrens und ermöglicht zeilenweisesSyntaxhighlighting. Zur Realisierung des Syntaxhighlightings, wird für jede Zeile desPseudo-Codes der Offset des ersten Zeichens sowie die Zeilenlänge anhand der Zeilenum-bruchszeichen berechnet und in einem zweidimensionalen Array gespeichert.

47

Page 57: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.1 Aufbau der Lernanwendung

Abbildung 5.1: Klassen der Lernanwendung mit ihren wichtigsten Attributen undMethoden

Das Highlighting erfolgt, indem für jedes Zeichen einer Zeile eine ausgewählte Hinter-grundfarbe und Textfarbe, die Farbe des Highlights, gesetzt wird. Zum Entfernen desHighlights wird die Hintergund- und Textfarbe aller Zeichen einer Zeile wieder auf dieStandardfarbe des Textfensters gesetzt. Durch die Verwendung des Arrays ist die Angabeder entsprechenden Zeilennummer zum Setzen oder Entfernen des Highlights ausreichend.Die Klasse Canvas3DOSD ist abgeleitet von der Java 3D-Klasse Canvas3D. Sie stellt ei-ne Ansicht für die 3D-Szene bereit. Erklärungstexte und eine Überschrift werden direktin der Methode postRender als On-Screen-Display auf das Canvas3D-Fenster in einenvorgegebenen Bereich gezeichnet. Dazu wurde eine Methode implementiert, die einen ge-eigneten Zeilenumbruch des anzuzeigenden Textes in Abhängigkeit der Höhe und Breitedes Canvas3D-Fensters dynamisch errechnet. Dadurch skaliert der gesamte Erklärungs-text variabel mit der Größe des Canvas3D-Fensters. Ein Canvas3D-Objekt kann nichtmit den üblichen Java-Layout-Managern in dem GUI der Lernanwendung ausgerichtetwerden. Um deren Größe dennoch dynamisch an die Größe des Eltern-Fensters anzupas-sen, wird bei jedem ausgelösten Resize-Event des Canvas3DOSD-Objektes die Größe desEltern-Fensters ermittelt und das Canvas3DOSD-Objekt daran angepaßt. Dieses Vorgehenerfordert die Übergabe der aktuell laufenden VisualRadiosity-Instanz als Parameter(pointerApp) an die Canvas3DOSD-Klasse.Die Klasse Camera erzeugt eine virtuelle Kamera, die Methoden zum Anzeigen und zurNavigation der 3D-Szene zur Verfügung stellt. Die Steuerung der Kamera erfolgt mit der

48

Page 58: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.2 Erstellung des Graphical User Interfaces (GUI)

Maus. Dazu werden die in Java 3D enthaltenen Klassen MouseTranslate, MouseRotateund MouseZoom verwendet, die ihrem Namen entsprechende Funktionalitäten bereitstel-len. Wie stark sich die Bewegung der Maus auf die Kameraansicht auswirkt, kann mitder Methode setMouseMoveFactor eingestellt werden. Weiterhin übernimmt die KlasseCamera eine Instanz der Klasse Canvas3DOSD. Diese stellt die Ansicht bereit, auf die sichdie Aktionen der virtuellen Kamera auswirken. Die Klasse Camera enthält die MethodensetPosition zum Setzen der Kameraposition, setCameraRotation zum Rotieren derKamera um die X- und Y-Achse sowie eine Methode setCameraViewX, (X = 1,...,4) zurErzeugung der in Kapitel 4.3 erwähnten, vorgegebenen Kameraansichten.Universe ist eine Klasse, die dazu beiträgt den Szenegraph aufzubauen. Sie enthält dieWurzelknoten für den Teilgraph, an dem die Szene hängt (root_Scene) und für den Teil-graph root_view, der alle Komponenten für die Ansicht und deren Steuerung enthält.Mit der Methode addCamera wird eine Instanz der Camera-Klasse dem Szenegraph hin-zugefügt.Die NavigationTree-Klasse ermöglicht die Steuerung der einzelnen Lernanwendungs-schritte. Sie ist abgeleitet von der Java-Klasse JTree. Weitere Details zu NavigationTree

folgen in Kapitel 5.2.TriangleGouraud ist eine Hilfsklasse, die für die Berechnung des Gouraud-Shadings be-nötigt wird. Sie stellt die Datenstruktur zur Speicherung der Topologie eines einzelnenPatches/Dreiecks der Szene bereit.

Die Lernanwendung stellt zwei verschiedene Szenen zur Verfügung, eine für den LernBar-Kurs und eine weitere zur anschließenden freien Exploration der Lernanwendung. Diezweite Szene soll die Motivation des Lernenden erhöhen sich die Lernanwendung einzweites Mal eigenständig anzusehen. Je Szene gibt es drei verschiedene Detailgrade, diesich darin unterscheiden, in wie viele Patches die Szene unterteilt ist. Dies ermöglicht demLernenden zu sehen, wie sich die Feinheit der Unterteilung einer Szene auf die Radiosity-Berechnung auswirkt. Die Szenen können mit Gouraud- oder Flat-Shading angezeigtwerden. In der Lernanwendung steht direkt zu Beginn eine Einleitung zur Verfügung, inder die Theorie des Radiosity-Verfahrens erläutert wird. Dies soll dem Lernenden ermög-lichen, den für die Lernanwendung benötigten Wissenstand zu erreichen.

5.2 Erstellung des Graphical User Interfaces (GUI)

Entwurf 2 aus Kapitel 4.4 wurde für die Lernanwendung als GUI umgesetzt, wie inAbbildung 5.2 zu sehen ist.

49

Page 59: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.2 Erstellung des Graphical User Interfaces (GUI)

Abbildung 5.2: Graphical User Interface der Lernanwendung

Das GUI der Lernanwendung ist in drei große Bereiche unterteilt. Oben links befindetsich der Navigation-Tree, darunter das Pseudo-Code-Fenster. Der dritte und größte Be-reich ist die 3D-Ansicht, die rechts von den beiden anderen Bereichen angeordnet ist.Der Navigation-Tree ermöglicht die Navigation der Lernanwendung. Die Ordnersymbolesowie deren Inhalte (Kindknoten) stellen je einen Schritt der Lernanwendung dar. Die-ser kann ausgeführt werden, in dem ein Eintrag entweder durch Anklicken markiert undanschließende auf den Button Anzeigen geklickt wird oder durch einen Doppelklick aufden Eintrag. Untergeordnete Einträge können durch das Expandieren des übergeordnetenEintrags sichtbar gemacht werden bzw. unsichtbar durch Kollabieren. Dazu wird auf dasPlus- bzw. Minus-Symbol vor einem Eintrag geklickt. Durch diese Baumstruktur sind dieLernanwendungschritte thematisch geordnet, wie Abbildung 5.3 zeigt. Die Knoten derersten Ebene des Navigation-Trees sind zu Beginn der Lernanwendung kollabiert, sodaßder Lernende nicht direkt mit dem gesamten Funktionsumfang der Lernanwendung kon-frontiert wird, sondern langsam an die einzelnen Themen und Funktionen herangeführtwerden kann. Die Reihenfolge der Lernanwendungsschritte ist durch die Verwendung desNavigation-Trees nicht fest vorgegeben. Der Lernende kann selbst entscheiden in welcherReihenfolge er die Anwendung abarbeitet und ob er Aspekte, die er bereits kennt, über-springt. Wird mit dem Navigation-Tree ein Schritt der Lernanwendung ausgewählt, sostartet ein neuer Thread und führt den entsprechenden Schritt aus. Dies verhindert, daßdas GUI während der Abarbeitung der Schritte „einfriert“.

50

Page 60: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.2 Erstellung des Graphical User Interfaces (GUI)

Abbildung 5.3: GUI-Elemente. Links: voll expandierter Navigation-Tree; Rechts: Pseudo-Code-Fenster mit Syntaxhighlighting

Das Pseudo-Code-Fenster, in Abbildung 5.3 dargestellt, zeigt den Code des Algorith-mus an. In jedem Schritt der Lernanwendung wird der zugehörige Code-Abschnitt mitHighlights versehen. Bei der Erstellung dieses Fensters mußte abgewogen werden, ob essinnvoller ist, automatischen Zeilenumbruch im Code zu erlauben, oder einen horizonta-len Scrollbalken zu verwenden. Beides hat Vor- und Nachteile. Ein Zeilenumbruch sorgtdafür, daß der gesamte Code auf einen Blick sichtbar ist, zerstört jedoch die Formatie-rung des Codes und erschwert dadurch die Lesbarkeit. Horizontale Scrollbalken solltenin Verbindung mit vertikalen Scrollbalken vermieden werden, weil dies das durchgängi-ge Lesen des Codes erschwert. Der Pseudo-Code besteht aus so wenigen Zeilen, daß imPseudo-Code-Fenster, bei Verwendung der vorgegebenen Fenstergröße, kein vertikalerScrollbalken benötigt wird. Deshalb ist ein horizontales Scrollen hinnehmbar und wurdeumgesetzt. Weiterhin besteht für den Benutzer die Möglichkeit, durch Verschieben desSeparators zwischen 3D-Ansicht und Pseudo-Code-Fenster, die Größe des Pseudo-Code-Fensters so zu ändern, daß der gesamte Pseudo-Code auch ohne Scrollbalken sichtbar ist.Die 3D-Ansicht zeigt die Visualisierungsschritte, bietet Auswahlmöglichkeiten und zeigtInformationen an. In diesem Fenster werden Erklärungstexte zu den einzelnen Darstel-lungen und die jeweilige Bezeichnung des Visualisierungsschrittes als On-Screen-Displayangezeigt.In Kapitel 4.4 wurde bereits erwähnt, daß Entwurf 2 um eine Menüleiste erweitert werdenmuss. In Verbindung mit der 3D-Ansicht bzw. der Canvas3DOSD-Klasse entsteht jedochein unangenehmer Effekt, wie in Abbildung 5.4 zu sehen ist.

51

Page 61: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.2 Erstellung des Graphical User Interfaces (GUI)

Abbildung 5.4: Oben: Ansicht-Menü bei ausreichendem Abstand zur 3D-Ansicht; Unten:Überlagerung des Ansicht-Menüs durch die 3D-Ansicht.

Das Ansicht-Menü wird von der 3D-Ansicht bzw. des Canvas3DOSD-Objektes überlagert,wenn der Abstand zwischen beiden nicht groß genug ist. Dies ist ein grundsätzliches Pro-blem der Java 3D-Klasse Canvas3D, die scheinbar in der Z-Order der Fensterelementeimmer als oberstes (allways on top) gezeichnet wird, und sich nicht dem Menü unterord-net, wie es eigentlich sein sollte.Die Menüleiste bietet unter dem Eintrag Datei die Möglichkeit die Anwendung zu been-den. Unter Ansicht stehen verschiedene Kameraansichten sowie die Auswahl zwischenGouraud- und Flat-Shading zur Verfügung. Der Menüeintrag Schnelle Kamerabewegungen

ermöglicht mit der Methode setMouseMoveFactor (siehe Kapitel 5.1) das Wechseln zwi-schen zwei vorgegebenen Faktoren. Die Einträge Kamera-Ansicht 1 bis Kamera-Ansicht 4

rufen die Methoden setCameraView1 bis setCameraView4 der Camera-Klasse auf. In jederdieser Methoden wird die Kamera mit vorgegebenen Parametern, wie Rotation der Kame-ra um die X- und Y-Achse sowie die Kameraposition, gesetzt. Diese Kameraeinstellungenentsprechen einer Eckansicht der Szene von oben. Die Kamera ist in einem 45◦-Winkelnach unten auf die Szene geneigt. Der Eintrag Kamera-Ansicht 5 ruft resetCamera derCamera-Klasse auf und zeigt die Szene in Frontalansicht. In Abbildung 5.5 sind die ein-zelnen Kameraansichten gegenübergestellt.

52

Page 62: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.3 Erstellung der 3D-Szenen

Abbildung 5.5: Vorgegebene Kamera-Ansichten 1-5 von links nach rechts.

Die Elemente des GUI wurden so implementiert, daß sie mit der Fenstergröße skalieren,sodaß verschiedene Fenstergrößen möglich sind.Die in Kapitel 4.4 erwähnten Richtlinien zum Entwurf und Design von Interfaces wurdebei der Implementierung der GUI berücksichtigt. Bei der Erstellung der Menüs wurdedie Menübreite der Menütiefe vorgezogen. Die Menüeinträge sind über Tastaturkürzelerreichbar. Die Bedienelemente sind so konzipiert, daß die jeweils während eines Inter-aktionsschrittes nicht zu verwendenden Bedienelemente deaktiviert sind. Falls sich derBenutzer mit der manuellen Kamerasteuerung „verzettelt“, kann er durch die Wahl einervorgegebenen Kameraansicht wieder zu einer geeigneten Darstellung der Szene gelangen.Alle Einstellungen der Lernanwendung können rückgängig gemacht werden. Jeder Schrittder Lernanwendung ist in sich geschlossen und beeinflußt die anderen Schritte nicht.

5.3 Erstellung der 3D-Szenen

Für die Lernanwendung wurden zwei 3D-Szenen erstellt, die jeweils aus einem Raumbestehen, der zwei Objekte und eine weiße Fläche, die als Lichtquelle dient, enthält. Da-mit sich beide Szenen hinsichtlich des Radiosity-Verfahrens möglichst stark voneinanderunterscheiden, wurden verschiedene Farben, Lichtquellenpositionen und Objekte verwen-det. Die Objekte der ersten Szene sind eine rote und eine gelbe Kugel. Die Lichtquelle istmittig an der Decke angebracht. Die zweite Szene enthält einen blauen Zylinder, der wieeine Säule vom Boden der Szene bis an die Decke ragt, und einen magentafarbenen Ke-gel. Jede Szene steht in den drei verschiedenen Detailgraden Niedrig, Medium und Hoch

zur Verfügung. Die Detailgrade unterscheiden sich darin, wie fein die Szene in Patchesunterteilt ist. In Abbildung 5.6 sind die beiden Szenen mit unterschiedlichem Detailgraddargestellt.

53

Page 63: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.3 Erstellung der 3D-Szenen

Abbildung 5.6: Flat-Shading-Darstellung Szene 1 (oben) und Szene 2 (unten) in den De-tailgraden (von links): Niedrig, Medium, Hoch.

Der Raum wird aus Rechtecken erzeugt, die zu einem sechseitigen Würfel angeordnetwerden. Nach dem Erstellen des Raums besteht jede Seite aus einem einzigen Rechteck,das anschließend, je nach Detailgrad der Szene, mehrfach in kleinere Rechtecke unterteiltwird. Bei der Unterteilung eines Rechtecks wird dieses in vier gleich große Rechteckeunterteilt, indem für jede Kante des Rechtecks und für das gesamte Rechteck der Mit-telpunkt berechnet wird und aus den daraus resultierenden Koordinaten vier kleinereRechtecke erzeugt werden. Diese ersetzen in der Geometrie des Raums das ursprünglicheRechteck.Für die Erstellung der Objekte Kugel, Zylinder und Kegel wurden die in Java 3D vor-gefertigten Klassen Sphere, Cylinder und Cone verwendet. Der Klasse Sphere kann einParamter divisions und den Klassen Cylinder und Cone die Paramter xdivision undydivison im Konstruktor übergeben werden. Diese Parameter regulieren wie stark dasentsprechende Objekt in Dreiecke unterteilt wird.Für den Detailgrad Niedrig wird jede Seite des Raums einmal in kleinere Rechtecke un-terteilt. Die Klasse Sphere bekommt als divisions 1 übergeben, die Klassen Cylinder

und Cone für xdivision und ydivison je 3. Auf Detailgrad Medium werden zweimal nach-einander alle Rechtecke des Raums unterteilt. Die Klasse Sphere bekommt 20 übergebenund Cylinder sowie Cone für beide Paramter je 10. Unter Verwendung von Detailgrad

54

Page 64: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.4 Aufbau und Funktionsweise des Radiosity-Renderers

Hoch werden viermal nacheinander alle Rechtecke des Raums unterteilt. Sphere bekommt50 übergeben, Cylinder und Cone für beide Parameter je 30.Ein Patch soll in den Szenen durch je ein Dreieck repräsentiert werden. Die Geometriein-formationen zu den Dreiecksflächen der Kugeln, des Zylinders und des Kegels werden inForm der Java 3D-Geometrieklasse TriangleStripArray bereitgestellt, die Geometrie-informationen des Raums jedoch in Form der Java 3D-Geometrieklasse QuadArray. Umeine einheitliche Geometrierepräsentation zu erhalten, wurden Funktionen implementiert,die alle Dreiecke aus den verwendeten Objekten auslesen und in eine Repräsentation inForm der Java 3D-Geometrieklasse TriangleArray überführen sowie die Rechtecke desRaums in je zwei Dreiecke zerlegen und diese ebenfalls in ein TriangleArray überführen.

5.4 Aufbau und Funktionsweise des Radiosity-Renderers

Zur Radiosity-Berechnung der Szenen wurde ein eigener Radiosity-Renderer in Java undJava 3D implementiert. Der Renderer hat nicht den Anspruch universell einsetzbar zusein, viel mehr ist er, aus Performancegründen, genau auf die beiden Szenen der Lernan-wendung zugeschnitten. Der Zweck des Renderers ist es, die vorgerenderten Radiosity-Szenen zu erzeugen, die anschließend in Dateien gespeichert und in die Lernanwendung,bei deren Benutzung, geladen werden. Der Renderer ist „hardgecodet“, besitzt also keineSchnittstellen zum GUI der Lernanwendung, und ist nicht für eine weitere Verwendungaußerhalb dieser Diplomarbeit gedacht. Dies ist auch, aufgrund der fehlenden Univer-salität und der langen Berechnungszeiten, nicht erforderlich. Der Renderer verwendetProgressive Refinemente Radiosity in der Gathering-Variante mittels Hemi-Cube. DerAblauf- und der Aufbau des Radiosity-Renderers orientiert sich an dem in Code 5.1 ab-gebildeten Pseudo-Code. Der für die Berechnung verwendete Hemi-Cube hat die Maße512 x 512 x 256 Pixel. In den Schritten 1-3 wird die Szene erzeugt, die Delta-Formfaktorenwerden berechnet und in einer Lookup-Table gespeichert. Die Schritte 4-7 des Algorith-mus sind die Initialisierung der Szene, nach der die gesamte Szene, bis auf die Lichtquelle,schwarz ist. Die Anzahl der Iterationschritte wurde für die Lernanwendung auf fünf be-schränkt. Eine höhere Anzahl bedingt mehr Rechenzeit, besonders bei Detailgrad Hoch,erhöht jedoch kaum den didaktischen Wert der Lernanwendung. Mit jedem Iterations-schritt wird die Änderung des Radiosity-Wertes eines einzelnen Patches geringer. In denSchritten 9-12 wird Radiosity für jeden Patch der Szene berechnet. Anschließend, in denSchritten 13-16, werden alle Patches der Szene mit den berechneten Radiosity-Wertenaktualisiert.

55

Page 65: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.4 Aufbau und Funktionsweise des Radiosity-Renderers

1 erzeuge Szene

2 berechne Delta -Formfaktoren

3 speichere Delta -Formfaktoren in einer Lookup -Table

4 für alle Patches i:

5 Patch_i.emission = Emission des zu i gehörigen Objektes

6 Patch_i.reflectivity = Farbe des zu i gehörigen Objektes

7 Patch_i.radiosity = Patch_i.emission

8 für jeden Iterationsschritt k:

9 für alle Patches i:

10 erzeuge Hemi -Cube für Patch_i

11 projiziere Szene auf Hemi -Cube

12 FarbListe[i] = Summe über (Hemi -Cube -Pixel -Farbe_j *

Delta -Formfaktor_j) für alle j

13 // Aktualisierung der Patches / Szene

14 für alle Patches i:

15 Patch_i.radiosity = Patch_i.emission + Patch_i.reflectivity *

FarbListe[i]

16 Zeichne Szene neu

Code 5.1: Pseudo-Code des vorgestellten Radiosity-Verfahrens

Das in Schritt 15 verwendete Attribut Patch_i.radiosity vom Typ float3f darf alsRGB-Wert (1.0, 1.0, 1.0) nicht überschreiten. Patch_i.reflectivity und FarbListe[i]

können pro Farbkanal maximal 1 werden. Das einzige Objekt, daß einen Emissionswertgrößer 0 pro Farbkanal hat ist die Lichtquelle (weiße Fläche). Diese wird jedoch von derBerechnung ausgenommen, denn sie hat bereits durch ihren RGB-Emissions-Wert von(1.0 ,1.0 ,1.0) den sich nicht mehr ändernden Radiosity-Wert von 1 pro Farbkanal.In Java 3D ist es schwierig an die Pixelfarbwerte der Szene, die für die Projektion inSchritt 11 benötigt werden, heranzukommen, ohne gleich die ganze Renderingpipelineund das ganze Rendern der Szene selbst zu implementieren. Eine von Java 3D zur Vefü-gung gestellte Möglichkeit die Pixelfarbwerte auszulesen, ist die Verwendung der KlasseRaster. Diese Klasse ermöglicht es, aus dem Framebuffer Pixelwerte auszulesen und die-se in einem Array bzw. Bild zu speichern. Dies entspricht in etwa der Erstellung einesScreenshots. Es muß dafür gesorgt werden, daß der Framebuffer genau das Bild der Szeneenthält, daß auf eine Seite des Hemi-Cubes projiziert werden soll. Dies kann durch dasSetzen und Rotieren der Kamera in der Szene erreicht werden. Wichtig dabei ist, daß dasSichtfeld (field of View) der Kamera auf 90◦ horizontal und vertikal, bei einem Seitenver-hältnis (Aspect Ratio) von 1, gesetzt wird. Die Projektion auf die Hemi-Cube-Front ist

56

Page 66: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.4 Aufbau und Funktionsweise des Radiosity-Renderers

mit diesen Einstellungen problemlos möglich, jedoch enthalten die Bilder für die Hemi-Cube-Seiten durch das 90◦ Sichtfeld noch zu viel Informationen. Die Bilder für die Seitenmüssen je nach Lage der Seite halbiert werden. Die Bilder für links und rechts müssenvertikal halbiert werden, die für oben und unten horizontal. Der Ablauf der Projektionauf den Hemi-Cube ist dabei wie folgt:

1. Setze die Kamera auf den Mittelpunkt des zu berechnenden Patches.

2. Rotiere die Kamera bis die Blickrichtung mit der Normale des Patches überein-stimmt.

3. Lese Framebuffer mit Raster aus und speichere die Pixelwerte (als Bild).

4. Rotiere die Kamera 90◦ um die Y-Achse.

5. Lese Framebuffer mit Raster aus und speichere die Pixelwerte (als Bild).

6. Rotiere die Kamera 180◦ um die Y-Achse.

7. Lese Framebuffer mit Raster aus und speichere die Pixelwerte (als Bild).

8. Rotiere die Kamera 90◦ um die Y-Achse und 90◦ um die X-Achse.

9. Lese Framebuffer mit Raster aus und speichere die Pixelwerte (als Bild).

10. Rotiere die Kamera 180◦ um die X-Achse.

11. Lese Framebuffer mit Raster aus und speichere die Pixelwerte (als Bild).

12. Zuschneiden (halbieren) der Bilder für die Hemi-Cube-Seiten.

Die Gesamtheit der fünf Bilder entspricht der gesamten Projektion auf den Hemi-Cube.Jedes Pixel entspricht einem Hemi-Cube-Pixel. Für die Ausrichtung der Kamera muß derMittelpunkt eines Patches, in diesem Fall ein Dreieck, bestimmt werden. Dazu werdenBaryzentrische Koordinaten verwendet. Sei p der gesuchte Mittelpunkt des Dreiecks unda, b und c die Eckpunkte des Dreiecks, dann ist p = a

3 + b3 + c

3 .Im Renderer sollen die einzelnen Projektionen direkt nacheinander in einer Schleife be-rechnet werden, jedoch erfolgt die Kamerarotation asynchron, d.h., es wird im Program-mablauf nicht auf das Beenden der Kamerarotation gewartet, sondern gleich das Auslesendes Framebuffers mit Raster ausgeführt. Dies kann zu Problemen führen, wenn die Ro-tation der Kamera noch nicht vollendet ist und das Auslesen bereits beginnt. Um dies zuvermeiden wurde eine Wartefunktion implementiert, die jedoch sehr „fragil“ ist. In Java

57

Page 67: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.4 Aufbau und Funktionsweise des Radiosity-Renderers

3D existiert keine Möglichkeit herauszufinden, ob eine 3D-Transformation der Szene, wiez.B. die Kamerarotation, bereits vollständig abgeschlossen ist und bereits im aktuellenFrame dargestellt wird. Eine Möglichkeit wäre eine gewisse Zeit, bis zu der die Rotationmit großer Wahrscheinlichkeit ausgeführt wurde, zu warten, bevor der Framebuffer aus-gelesen wird. Die verwendete Methode kommt dem sehr nahe, hat jedoch noch zusätlicheVorteile. Es wird mit der Java 3D-Klasse WakeupOnElapsedFrames eine gewisse Anzahlan Frames gewartet, bevor das Auslesen beginnt. Zur Verzögerung der Transformationkann es bei erhöhter Auslastung des Systems kommen. Das Warten eines festen Zeitbe-trags nimmt darauf keine Rücksicht, die Framemethode jedoch schon, denn wenn dasSystem stark ausgelastet ist, dauert es länger bis ein neuer Frame gerendert wird, alsowird auch länger auf das Rotieren gewartet. Optimal ist diese Lösung dennoch nicht,denn es muß in WakeupOnElapsedFrames eine feste Framezahl, auf die gewartet werdensoll, vorgegeben werden. Diese wurde auf das System, auf dem die Szenen vorgerendertwurden, abgestimmt.Die Verwendung von Raster hat einen Nachteil. Die Berechnung der Radiosity-Wertewird mit dem Datentyp float, der in Java vier Byte groß ist, durchgeführt. Die Pi-xelfarbwerte, die in einem Bild gespeichert werden, können jedoch nur im FORMAT_RGB8

ausgelesen werden, d.h., für jeden Farbkanal steht nur ein Byte zur Verfügung. Dies führtunvermeidbar zu Rundungsfehlern bei sehr kleinen Radiosity-Werten.Der Renderer wurde so implementiert, daß er möglichst wenig Speicher verbraucht. Eini-ge Operationen werden on-the-fly durchgeführt, wie z.B. das Anlegen und die Projektionauf den Hemi-Cube. Die dabei entstehenden Bilder werden nur solange im Speicher aufbe-wahrt, bis, wie in Schritt 12 des Codes 5.1 beschrieben, der neue Farbwert des Patches be-stimmt wurde. Dieser Farbwert wird jedoch, wie von Progressive Refinement vorgegeben,bis zur Aktualisierung der Szene in den Schritten 14-16 des Codes 5.1, gespeichert. Wäh-rend der gesamten Ausführung des Renderers wird die Tabelle der Delta-Formfaktorenim Speicher gehalten. Ein erneutes Berechnen für jeden Hemi-Cube erhöht die Laufzeitzu stark.Der Radiosity-Renderer wurde exakt auf die Geometrierepräsentationen der beiden Sze-nen zugeschnitte. Wie in Kapitel 5.3 erwähnt, wurden Methoden implementiert, die einTriangleStripArray und ein QuadArray in ein TriangleArray umwandeln. In Java 3Dexistieren noch weitere Geometrierepäsentationen wie TriangleFanArray,IndexedTriangleFanArray, IndexedQuadArray oder IndexedTriangleStripArray. Die-se kommen jedoch in den beiden Szenen nicht vor und werden deshlab vom Radiosity-Renderer nicht berücksichtigt.In Abbildung 5.7 sind die beiden Szenen mit Detailgrad Hoch nach den jeweiligen Itera-

58

Page 68: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.5 Darstellung der 3D-Szene

tionschritten dargestellt.

Abbildung 5.7: Gouraud-Shading-Darstellung Szene 1 (oben) und Szene 2 (unten) nachden Iterationsschritten (von links): 1-5; Detailgrad: Hoch

Nachfolgend wird kurz auf die Laufzeiten des Radiosity-Renderers eingegangen. Szene1 enthält mit Detailgrad Niedrig 64 Dreiecke. Der Renderer benötigt zur Berechnungdieser Szene ca. 1,5 Minuten. Bei Detailgrad Medium sind es ca. 600 Dreiecke und eineLaufzeit von 11 Minuten, mit Detailgrad Hoch enthält die Szene schon ca. 5500 Dreiecke,für die der Renderer 2 Stunden zur Berechnung benötigt. Alle Zeitangaben beziehensich auf einen einzigen Iterationsschritt und auf das am Anfang des Kapitels genanntePC-System. Die Szene 2 enthält bei Detailgrad Hoch nochmals ca. 1200 Dreiecke mehr,also ca. 6700 Dreiecke, wodurch eine Rechenzeit von ca. 2,5 Stunden benötigt wird. ZurErzeugung des fünften Iterationsschrittes der Szene 2 mit Detailgrad Hoch benötigt derRadiosity-Renderer ca. 12,5 Stunden Rechenzeit.

5.5 Darstellung der 3D-Szene

In Kapitel 4.6 wurde bereits erwähnt, daß es notwendig ist, die Szene einer Nachbear-beitung zu unterziehen, um trotz der schlechten Konvergenz, in den ersten Iterations-chritten etwas erkennen zu können. Es wurden zwei Verfahren gegeneinander abgewogen,einerseits die Verwendung eines ambienten Terms, der zu dem Farbwert eines jeden Pi-xels addiert wird und andererseits eine Kontrasterhöhung. In Abbildung 5.8 werden dieOriginaldarstellung der Szene, die Anwendung eines ambieten Terms und die Szene mitKontrasterhöhung gegenübergestellt. Die Szene ohne Nachbearbeitung ist fast vollständigschwarz. Es sind mittig lediglich zwei Kugeln zu erahnen. Die Verwendung des ambientenTerms erhöht die Sichtbarkeit der Szene, führt jedoch zu einer nebelartigen Darstellung.

59

Page 69: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.5 Darstellung der 3D-Szene

Die Kontrasterhöhung liefert ein brauchbares Ergebnis und wurde zur Verbesserung derDarstellung implementiert.

Abbildung 5.8: Mit Radiosity gerenderte Szene. Links: Original; Mitte: Ambient-Term;Rechts: Kontrasterhöhung

Zur Kontrasterhöhung wird wie folgt vorgegangen:

1. Berechne für jeden Farbkanal das arithmetische Mittel aller Farbwerte der Szene.

2. Subtrahiere von jedem Farbwert den in Schritt 1 berechneten Mittelwert.

3. Multipliziere jeden Farbwert mit dem Faktor, um den der Kontrast erhöht werdensoll.

4. Addiere zu jedem Farbwert den in Schritt 1 berechneten Mittelwert.

Anschaulich entspricht das Vorgehen einer Verschiebung des Farbspektrums der Szene,sodaß der Mittelwert null ist (Schritte 1 und 2), mit einer anschließenden, dem Kon-trastfaktor entsprechenden, Streckung des Spektrums nach oben und unten (Schritt 3),und des Zurückverschiebens des Farbspektrums, sodaß der Mittelwert dem ursprüngli-chen Wert entspricht (Schritt 4). Dabei kann es vorkommen, daß durch die StreckungFarbwerte kleiner 0 oder größer 1 entstehen, diese werden dann auf 0 bzw. 1 gesetzt.Dies kann zu einem Informationsverlust in der Szene führen. Deshalb ist es wichtig, daßfür die Lernanwendung ein Faktor gewählt wurde, der die Darstellungsqualität erhöht,jedoch keinen oder nur wenig Informationsverlust zur Folge hat. Für Szene 1 wurde alsKontrastfaktor 8 gewählt. Szene 2 ist noch etwas dunkler, sodaß als Faktor 10 gewähltwurde.In Kapitel 4.6 wurde bereits darauf hingewiesen, daß das Darstellen der Szenen mitGouraud-Shading implementiert werden soll. Java 3D kann eine Szene mit Gouraud-Shading darstellen, jedoch müssen dazu die Vertices eines Dreiecks unterschiedliche Farb-werte aufweisen. Durch das implementierte „Per-Patch-Shading“ haben alle Eckpunkte

60

Page 70: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.5 Darstellung der 3D-Szene

eines Dreiecks die selbe Farbe. Eine Methode zur Bestimmung eines Vertex-Farbwertesist es, den Mittelwert von allen Farbwerten der Patches zu berechnen, die den Vertexenthalten. Wurde jeder Vertex jedes Patches der Szene berechnet und zugewiesen, sokann Java 3D Gouraud-Shading auf die Szene anwenden. Für dieses Vorgehen ist dieBerechnung einer Topologie der Szene nötig, also die Information, welche Patches sicheinen Vertex teilen. Dazu wurde eine Methode implementiert, die über alle Vertices al-ler Patches iteriert und deren Koordinaten mit den Koordinaten der jeweils anderenVertices der anderen Patches vergleicht. Sind zwei Koordinaten gleich, so grenzen dieentsprechenden Patches aneinander an und teilen sich diesen Vertex. Zur Verwaltung derTopologie wird die in Kapitel 5.1 vorgestellte Klasse TriangleGouraud verwendet. Fürjedes Patch wird eine Instanz dieser Klasse angelegt und in einem Array gespeichert.Die Attribute faceVertex0, faceVertex1 und faceVertex2 dieser Klasse sind Arrays,die alle IDs der Patches enthalten, die den entsprechenden Vertex ebenfalls verwendenund somit zur Bestimmung des Farbwertes entscheidend sind. Die Patches sind in einemTriangleArray-Objekt enthalten. Die in der Klasse TriangleGouraud verwendeten IDsentsprechen den Positionen der Patches in dem TriangleArray. Das Berechnen der To-pologie ist sehr zeitaufwendig und hängt nur von der Geometrie der Szene ab. Deshalbwurde die Topologie einmalig für beide Szenen berechnet und in einer Datei gespeichert.Dennoch müßten jedesmal, wenn der Benutzer Gouraud-Shading auswählt, die Mittel-werte der angrenzenden Patches aus der Toplolgie berechnet werden. Auch dies benötigtetwas Rechenzeit, die den Ablauf der Lernanwendung unnötig unterbrechen würde. Umdies zu vermeiden, wurden die Farbwerte des Gouraud-Shadings beider Szenen für je-den Iterationsschritt vorberechnet und in Dateien gespeichert. Wählt der Benutzer dasGouraud-Shading, so müssen lediglich die Farbwerte der Szene geladen und gesetzt wer-den.Wie in Kapitel 5.3 beschrieben, enthalten die beiden Szenen die in Java 3D vorgefertig-ten 3D-Objekte Sphere, Cylinder und Cone. Deren Geometrien werden in Abhängigkeitder Paramter division bzw. ydivison xdivision aufgebaut. Dabei gibt es jedoch einProblem, das am Beispiel eines Kreises verdeutlicht werden soll. Die Berechnung einesKreises beginnt mit einem „Startvertex“. Um im letzten Schritt den Kreis zu schließen,sollte eine Kante erzeugt werden, die vom letzten Vertex zurück zum „Startvertex“ reicht.Die in Java 3D vorgefertigten 3D-Objekte gehen jedoch nicht so vor, sondern berechnenebenfalls die Koordinate des Endpunktes der letzten Kante. Dies führt regelmäßig zuRundungsfehlern, sodaß die Koordinaten des Endpunktes und des „Startvertex“, ab einergewissen Nachkommastelle, nicht exakt gleich sind. Dies wirkt sich auf das verwendeteVerfahren zur Berechnung der Topologie aus. Sind die Werte nicht exakt gleich, werden

61

Page 71: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.5 Darstellung der 3D-Szene

sie auch nicht als Nachbarn angesehen. Dadurch entstehen an solchen Stellen „harte“Kanten auf dem Objekt. Zur Umgehung dieses Effektes wurde eine Methode implemen-tiert, die alle Koordinaten auf eine feste Anzahl an Nachkommastellen beschränkt. Einegeeignete Wahl der Nachkommastellen ist ganz entscheidend, denn sollte deren Anzahlfür die Geometrie der Szene zu gering sein, so würden Patches die „nur“ nahe beieinanderliegen als Nachbarn betrachtet werden und somit wäre die Darstellung verfälscht. Ist dieAnzahl zu groß gewählt, so bleiben die Rundungsfehler bestehen. Die Wahl der richti-gen Anzahl der Nachkommastellen ist individuell von der Geometrie der Szene abhängig,u.a. davon in welchem Wertebereich wie viele Vertices enthalten sind und wie groß derenAbstände zueinander sind. Für die Lernanwendung hat sich das Beschränken aller Ko-ordinaten auf sieben Nachkommastellen als sinnvoll erwiesen. In Abbildung 5.9 wird dieAuswirkung des Rundungsfehlers verdeutlicht.

Abbildung 5.9: Auswirkung des Rundungsfehlers auf das Gouraud-Shading in Szene 1;Detailgrad: Hoch; links ohne Beschränkung der Anzahl der Nachkommas-tellen; rechts Beschränkung auf sieben Nachkommastellen

Im linken Bild ist besonders an der gelben Kugel eine Art halbierende, schwarze, harteKante zu erkennen, die das Resultat des Rundungsfehlers ist. Mit der Beschränkung aufsieben Nachkommastellen ist dieser Fehler nicht mehr vorhanden, wie im rechten Bildersichtlich ist. Diese Rundungsfehler treten ebenso beim Mantel des Zylinder und desKegels in Szene 2 auf.Bei der Implementierung des Gouraud-Shadings wurde berücksichtigt, daß die Ecken desRaums als „harte“ Kanten beibehalten werden sollen. Der gesamte Raum besteht auseiner einzigen Geometrie, sodaß durch Anwenden des Gouraud-Shadings die Ecken desRaums abgerundet wirken würden. Um dem entgegen zu wirken, wurde die Methodezur Erstellung der Topologie so erweitert, daß Patches des Raums nur als benachbart

62

Page 72: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.6 Umsetzung der Lernziele

angesehen werden, wenn ihre Normalen in die gleiche Richtung zeigen. Bei Patches aneiner Raumecke ist dies nicht der Fall, sodaß dort kein Mittelwert über die Ecke hinweggebildet wird. Dadurch entsteht eine „harte“ Kante.

5.6 Umsetzung der Lernziele

Der Ablauf- und der Aufbau der Lernanwendung orientiert sich an dem in Kapitel 5.4vorgestellten Pseudo-Code 5.1. In Kapitel 4.1 wurden die folgenden sieben Lernzielevorgegeben. Der Lernende soll folgendes verstehen und erlernen:

1. Radiosity-Gleichung und deren einzelne Terme

2. Formfaktoren und deren Eigenschaften

3. Progressive Refinement

4. Veränderung der Szene nach den jeweiligen Iterationsschritten des Progressive Re-finements (color bleeding, weiche Schatten)

5. Laufzeit und Speicherplatzkomplexität von Radiosity allgemein und der vorgestell-ten Variante

6. Aufbau, Struktur, Nutzen und Berechnung eines Hemi-Cubes sowie dessen Elemen-te (Hemi-Cube-Pixel, Delta-Formfaktoren)

7. Vor- und Nachteile des Radiosity-Verfahrens

Die Aufteilung dieser Lernziele in neun Lektionen der Lernanwendung wurde in Kapitel4.2 vorgenommen. An diesen Lektionen orientiert sich der Ablauf und die Schritte derLernanwendung.Der Lernende kann mittels des Navigation-Trees einen der Lernanwendungsschritte freiwählen. Folgende Schritte wurden implementiert, in Klammern Angabe des umgesetztenLernziels:

1. Einleitender Text (1. und 2. Lernziel)

2. Szenenauswahl

3. Initialisierung (3. Lernziel)

4. Berechne Iterationen (4. Lernziel)

5. Berechnung einzelner Iterationsschritt (5. Lernziel)

63

Page 73: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.6 Umsetzung der Lernziele

6. Was ist ein Hemi-Cube? (6. Lernziel)

7. Wie wird die Farbe eines Patches berechnet? (6. Lernziel)

Die nachfolgende Abbildung 5.10 zeigt den voll expandierten Navigation-Tree, und somitdie Anordnung und Unterteilung der Lernanwendungsschritte.

Abbildung 5.10: Anordnung und Unterteilung der Lernanwendungsschritte, veranschau-licht durch den voll expandierten Navigation-Tree

Zu Beginn der Lernanwendung (1. Schritt) wird dem Benutzer ein Einleitungstext zurVerfügung gestellt. Dieser erläutert die benötigte Theorie des Radiosity-Verfahrens undsoll es dem Lernenden ermöglichen ein Grundwissen zu erlangen, um die anderen Schrittenachvollziehen zu können.Der Lernende kann im 2. Schritt der Lernanwendung eine der beiden Szenen und einender drei Detailgrade auswählen. Diese Szene wird dann in allen weiteren Schritten ver-wendet.Im 3. Schritt wird die Initialisierung des Progressive Refinements erläutert und gezeigt,wie die Szene nach der Initialisierung aussieht. Dieser Schritt ist in drei weitere Schritteunterteilt. Unterschritte dienen dazu, weitere Details zu einem Schritt bereitzustellen.Sie zeigen, z.B. was alles nötig ist, um das Ziel des übergeordneten Schrittes zu erreichenoder in welche Unterschritte der Schritt algorithmisch unterteilt ist. Der Lernende kannsich im ersten Unterschritt zunächst die Szene unbeleuchtet ansehen, um einen Eindruck

64

Page 74: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.6 Umsetzung der Lernziele

von dem Aufbau und den Farben der Szene zu bekommen. In Unterschritt 2 wird dieSzene als Wireframe dargestellt. Der Lernende kann durch diese Darstellung einen Ein-druck davon bekommen, wie die Szene in Patches unterteilt ist. Unterschritt 3 zeigt dieSzene nach dem Iterationsschritt B0, also nach der Initialisierung des Verfahrens. NachB0 ist die gesamte Szene, bis auf emittierende Flächen (Lichtquellen), schwarz.Der 4. Schritt ist eine Animation, in der dargestellt wird, wie die Szene nach den einzel-nen vorgerenderten Iterationsschritten (B1-B5) des Radiosity-Verfahrens aussieht. DieserSchritt zeigt die sukzessive Veränderung der Szene und ermöglicht dem Lernenden dieAuswirkungen der fünf Iterationsschritte auf die Szene, wie Schattenwurf und color blee-ding, zu sehen. Als Unterschritte können die Iterationen B1-B5 einzeln ausgewählt undangeschaut werden. Dadurch kann der Lernende sich in aller Ruhe den Übergang voneinem Schritt zu einem anderen anschauen, ohne, wie es in der Animation der Fall ist,eine Zeitvorgabe zu haben.Der 5. Schritt ist ein Unterschritt von Schritt B4. Er soll verdeutlichen wieviel Auf-wand zur Berechnung des gewählten Radiosity-Verfahrens nötig ist, insbesondere wieviele Hemi-Cubes für einen einzelnen Iterationsschritt berechnet werden müssen. Dazuwird als Animation gezeigt, wie ein Hemi-Cube in Wireframe-Darstellung auf jeden ein-zelnen Patch der Szene gesetzt wird. Zur Vermeidung einer zu langen Animationszeit beieiner Szene mit Detailgrad Hoch, wird die Wartezeit bis zum Setzen des Hemi-Cubes aufden nächsten Patch von zwei Sekunden bis zu einem Minimalwert im Millisekundenbe-reich sukzessive verringert.Der 6. Schritt ist ein Unterschritt von Schritt 5 und erklärt den Aufbau und die Struktureines Hemi-Cubes anhand einer 3D-Darstellung eines auf einem Patch „sitzenden“ Hemi-Cubes in Wireframedarstellung. Schritt 6 hat einen Unterschritt, der dem Lernendenerläutert was Delta-Formfakoren sind und wie diese berechnet werden. Dafür wird einHemi-Cube in Wireframedarstellung gezeigt. In der Darstellung sind die für die Berech-nung wichtigen Parameter eingezeichnet und mit 3D-Texten beschriftet.Schritt 7 ist ebenfalls ein Unterschritt von Schritt 5. In einer Animation wird gezeigt,wie eine Szene schrittweise auf die fünf Seiten des Hemi-Cubes projiziert wird. Für jedeSeite wird das „ViewVolume“ vom Mittelpunkt des Patches in Richtung der Normalen derentsprechenden Hemi-Cube-Seite, in Form eines grünen, semitransparenten Pyramiden-stumpfes, eingezeichnet. Bevor die Animation zur nächsten Hemi-Cube-Seite wechselt,wird der aktuellen Hemi-Cube-Seite eine Textur zugeordnet. Diese Textur entspricht demBild, das durch eine Projektion der Szene auf die Hemi-Cube-Seite entstehen würde. Ei-ne Projektion zur Laufzeit der Lernanwendung wäre für den Benutzer durch die nötigenKameratransformationen verwirrend. Deshalb wurden für alle Szenen und deren mögli-

65

Page 75: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.6 Umsetzung der Lernziele

che Paramter Texturen vorberechnet und in Dateien gespeichert. Diese werden dann inSchritt 7 zur Darstellung der Projektion geladen. Der Hemi-Cube wird in Wireframe-darstellung gezeigt. Die einzelnen Raster des Hemi-Cubes stellen die Hemi-Cube-Pixeldar. Um die Textur zu erhalten und dennoch ein Gitter für die Hemi-Cube-Pixel beizu-behalten, wird ein zweiter Hemi-Cube, der minimal größer als der erste ist, in Wirefra-medarstellung über den ersten gelegt. Als Unterschritte können die einzelnen Animati-onsschritte separat betrachtet werden, d.h., für jede Hemi-Cube-Seite steht ein eigenerSchritt bereit, der die Projektion auf diese Seite zeigt.Die nachfolgende Abbildung 5.11 zeigt die Darstellung der Projektion auf die Unterseitedes Hemi-Cubes.

Abbildung 5.11: Darstellung der Projektion auf die Unterseite des Hemi-Cubes

Jeder der Schritte enthält einen Erklärungstext, der wie in Kapitel 5.2 beschrieben, alsOn-Screen-Display angezeigt wird. Der Aufbau und die Unterteilung der Lernanwen-dungsschritte wurde so gewählt, daß eine Erklärung des Radiosity-Verfahrens vom All-gemeinen ins Spezielle erfolgt, d.h., mit jeder tieferen Navigation-Tree-Ebene geht es beiden Erklärungen mehr ins Detail. Die erste Ebene gibt somit lediglich einen groben Über-blick des Verfahrens. Der Lernende kann bei einer freien Exploration der Lernanwendung(ohne Nutzung des LernBar-Kurses), je nach seinem Wissensstand, selbst entscheidenwelche Details er erfahren möchte.

66

Page 76: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.7 Erstellung des LernBar-Kurses

5.7 Erstellung des LernBar-Kurses

Der Lernende kann in der Lernanwendung die Schritte frei wählen. In der LernBar wurdeein Kurs entwickelt, der ein angeleitetes Lernen ermöglicht. Dieser Kurs ist in neunLektionen unterteilt, die zusammen mit der Lernanwendung abgearbeitet werden sollen.Die Lektionen ermöglichen einen linearen Ablauf, indem sie dem Lernenden vorgeben,was er wann zu tun hat. Dennoch hat der Lernende die Möglichkeit die Reihenfolgeder Lektionen selbst zu bestimmen oder eventuell einzelne Lektionen, mit dessen Inhalter bereits vertraut ist, zu überspringen. Die Lektionen entsprechen der in Kapitel 4.2vorgestellten Unterteilung, die nachfolgend nochmals aufgelistet wird:

1. Kurs - Einleitung: Beschreibt die Zielsetzung, den Aufbau und die Voraussetzungendes Kurses.

2. Radiosity - Einleitung: Erklärt Radiosity, dafür notwendige Voraussetzungen, dieRadiosity-Gleichung sowie Formfaktoren. (1. und 2. Lernziel)

3. Bedienungsanleitung: Macht den Benutzer mit dem GUI der Lernanwendung ver-traut.

4. Initialisierung: Beschreibt die notwendigen Initialisierungen des Progressive Re-finements und zeigt die einzelnen Initialisierungsschritte an einer 3D-Szene. (3.Lernziel)

5. Progressive Refinement: Erklärt Progressive Refinement und zeigt die Veränderungeiner 3D-Szene nach den einzelnen Iterationsschritten. (3. und 4. Lernziel)

6. Laufzeit- und Speicherplatzkomplexität: Vermittelt wie aufwendig die Radiosity-Berechnung ist und zeigt exemplarisch an einer 3D-Szene, wie viele Hemi-Cubesfür einen einzigen Iterationsschritt berechnet werden müssen. (5. Lernziel)

7. Der Hemi-Cube: Beschreibt den Aufbau sowie die Berechnung des Hemi-Cubesund der dazugehörenden Elemente (Hemi-Cube-Pixel, Formfaktoren). Zeigt einenHemi-Cube in 3D sowie dessen Hemi-Cube-Pixel und die Berechnung der Delta-Formfaktoren. (6. Lernziel)

8. Projektion auf einen Hemi-Cube: Zeigt die Projektion einer 3D-Szene auf die fünfSeiten des Hemi-Cubes. (6. Lernziel)

9. Schlusswort: Die Vor- und Nachteile des Radiosity-Verfahrens werden kurz zusam-mengefaßt. Der Benutzer wird ermutigt die Lernanwendung nochmals selbstständigzu erkunden und auf Details zu achten. (7. Lernziel)

67

Page 77: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.7 Erstellung des LernBar-Kurses

Jede Lektion erklärt zuerst die notwendigen Grundlagen und weißt anschließend denLernenden an, bestimmte Schritte in der Lernanwendung auszuführen. Um das Kurz-zeitgedächtnis des Lernenden nicht zu sehr zu strapazieren, wurden für jede Anweisungzusätzlich erklärende Bilder bereitgestellt, die verdeutlichen was der Lernende in derLernanwendung zu tun hat. Ein Beispiel eines solchen Bildes ist Abbildung 5.12.

Abbildung 5.12: Anweisung des LernBar-Kurses in Bildform

Die Teilbilder der Abbildung 5.12 entsprechen Bereiche aus der Lernanwendung. Die ro-ten Zahlen beschreiben die Reihenfolge der Aktionen. Die roten Linien weisen auf dasElement, mit dem im entsprechenden Schritt interagiert werden soll. Durch diese Bildererhält der Lernende einen visuellen Eindruck davon, wo sich die einzelnen Elemente, dieer bedienen soll, befinden und wie diese Aussehen. Dies soll die Suche nach den in denAnweisungstexten erwähnten Bedienelementen in der Lernanwendung reduzieren.Je Lektion werden Erklärungstexte und einleitende Grundlagenbeschreibungen gegeben,um den nötigen Stand des Wissens zu erreichen, dennoch sind gewisse Grundkenntnissedes Lernenden erforderlich. Der Kurs richtet sich an Studenten der Informatik, die be-reits Basiswissen durch die Vorlesung „Grundlagen der Computergrafik“ oder einer ver-gleichbaren Vorlesung vermittelt bekommen haben. Die Themengebiete zu den folgendenStichwörter werden als bekannt vorausgesetzt: Globale vs. Lokale Beleuchtung, diffuseReflektion, Emission, Reflektionsgleichung, Vorgang des Renderns, Oberflächennormale,Gouraud- vs. Flat-Shading, iterativ, Approximation, Konvergenz und Projektion.Die Zielsetzung des Kurses ist es, dem Lernenden ein Verständnis für Radiosity zu ver-mitteln. Er soll die einzelnen Schritte des verwendeten Algorithmus verstehen sowie einenEindruck davon bekommen, welche Fähigkeiten, aber auch welche Schwachpunkte, Ra-

68

Page 78: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5.7 Erstellung des LernBar-Kurses

diosity mit sich bringt.Die Bearbeitungszeit des Kurses beträgt ca. 60-90 Minuten, ist aber nicht auf diesesZeitfenster beschränkt. Der Kurs kann jederzeit unterbrochen und an der selben Stelle,zu einem anderen Zeitpunkt fortgesetzt werden, jedoch empfiehlt es sich eine Lektionzusammenhängend abzuarbeiten.Im Kurs enthalten sind 16 Fragen, die in Form von Single-Choice und Multiple-Choiceangelegt wurden. Sie dienen dem Abfragen des Lernfortschrittes und werden am Endeder jeweiligen Lektion gestellt. Die nachfolgende Abbildung 5.13 zeigt exemplarisch eineSeite des LernBar-Kurses.

Abbildung 5.13: Eine Seite des Kurses

Das Design, zu dem die Schriftgröße, die Anordnung der Elemente sowie das Farbschemazählt, ist durch die LernBar und deren Templates vorgegeben.Eine direkte Kommunikation zwischen dem LernBar-Kurs und der Lernanwendung istaufgrund mangelnder Schnittstellen nicht möglich, sodaß der Benutzer selbstständig zwi-schen den beiden Anwendungen wechseln muß. Sobald ein Wechsel notwendig ist, wird inden Erklärungstexten des Kurses und der Lernanwendung darauf hingewiesen. Ursprüng-lich sollten Lernanwendung und Kurs so konzipiert werden, daß sie beide gleichzeit aufdem Bildschirm darstellbar sind. Die Lernanwendung wurde so implementiert, daß dieFenstergröße in gewissen Grenzen skalierbar ist. Die Fenstergröße des LernBar-Kurseskann jedoch aufgrund der festen Schriftgröße nicht ohne Verlust von Textteilen verklei-nert werden. Dies führt dazu, daß bei einer Bildschirmauflösung von 1024 x 768 Pixeloder 1280 x 1024 Pixel nicht beide Anwendungen zeitgleich angezeigt werden können.Im Anhang A.1 dieser Diplomarbeit sind alle Seiten des LernBar-Kurses abgebildet.

69

Page 79: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

6 Bewertung und Ausblick

„...etwas in Frage zu stellen, ist der einzige Weg, es zu verbessern.“

Richard Ginnow

6.1 Bewertung

In dieser Diplomarbeit wurde eine 3D-Lernanwendung für Progressive Refinement Radio-sity in der Gathering-Variante mittels Hemi-Cube implementiert. In der LernBar wurdeein Kurs entwickelt, der angeleitetes Lernen ermöglicht. Während der Präsentation desLernstoffes wird in regelmäßigen Abständen durch Abfragen des bereits präsentiertenLernstoffes, in Form von Single- und Multiple-Choice-Fragen, ein Feedback erzeugt.Nach ihren technischen Merkmalen (siehe Kapitel 2.6) entspricht die Lernanwendung inVerbindung mit dem Kurs einer Mischung aus einem tutoriellen System in Form einesmultifunktionalen Lernprogramms und einer Präsentations- und Visualisierungssoftware,die der Veranschaulichung komplexer Sachverhalte dient.Es wurde darauf Wert gelegt, daß der didaktische Nutzen der Lernanwendung in Verbin-dung mit dem Kurs höher ist, als die in Kapitel 3.5 vorgestellten, bereits existierendenRadiosity-Visualisierungen. Die Lernanwendung enthält erklärende Texte, sodaß der Ler-nende mit dem was er sieht nicht „allein gelassen“ wird. Es wird nicht nur gezeigt wiesich Radiosity auf eine Szene auswirkt, wie es bei vielen Visualisierungen aus Kapitel3.5 der Fall ist, sondern einzelne Schritte des verwendeten Algorithmus werden erläu-tert und dargestellt. Der Interaktionsgrad der Lernanwendung beschränkt sich nicht nurauf reine Animationen. In der Lernanwendung kann die Repräsentationsform der Sze-nen variiert werden. Die Kamera kann frei bewegt werden. Ein Verändern der Inhalteist allerdings nicht möglich. Dies entspricht Stufe III der sechs Stufen der Interaktivi-tät einer Multimedia-Anwendung (siehe Kapitel 2.6) und bietet somit wesentlich mehrInteraktivität als alle in Kapitel 3.5 vorgestellten Radiosity Simulationen und Visuali-sierungen. Eine höhere Stufe der Interaktivität kann nicht ohne weiteres implementiert

70

Page 80: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

6.1 Bewertung

werden. Die Stufen IV, V und VI erfordern alle, daß die Inhalte vom Benutzer verändertwerden können. Zu diesen Änderungen zählt z.B. das Verändern der Szenengeometrieund der Lichtquellen oder das Verändern von Farben. Dies ist, solange Radiosity nichtechtzeitfähig ist, nicht praktikabel, sonst müßte der Lernende nach Änderung der SzeneMinuten bis Studen warten, bis Radiosity für die Szene neu berechnet wurde und dieAusführung der Lernanwendung fortgesetzt werden kann.Wie in Kapitel 2.6 bereits erwähnt, soll die Lernanwendung sowohl für „starke“ Lernerals auch für „schwache“ Lerner geeignet sein. Die „starken“ Lerner profitieren von demvergleichsweise hohen Interaktionsgrad der Lernanwendung und unterliegen dadurch, daßLektionen übersprungen werden können, nicht dem Zwang bereits bekannten Lernstoffabarbeiten zu müssen. Die Einstellung verschiedener Parameter, wie Detailgrad der Sze-ne, die verschiedenen Kameraansichten und die Bereitstellung der Szene 2, die im Verlaufdes Kurses nicht explizit verwendet wird, ermutigen zur weiteren Auseinandersetzung mitder Lernanwendung, auch nach Abarbeitung des Kurses. „Schwache“ Lerner bekommendurch den anleitenden Kurs solide Grundlagen vermittelt und werden schrittweise andas Thema herangeführt. Der strukturierte Aufbau der Lektionen und die in Text- undBildform vermittelten Anweisungen ermöglichen ihnen, sich auf das Wesentliche der Lek-tionen zu konzentrieren.Die Szenen wurden für die Lernanwendung vorgerendert und die Farbwerte der Patchesnach der Radiosity-Berechungen in Dateien gespeichert. Alle anderen aufwendigen Be-rechnungen, wie das Anlegen der Topologie oder die Berechnung der Farben der Verticesfür das Gouraud-Shading, wurden ebenfalls im Voraus einmalig berechnet, sodaß der Be-nutzer der Lernanwendung davon profitieren kann, daß mit Radiosity gerenderte Szenenin Echtzeit betrachtet und durchlaufen werden können. Die Antwortzeit der Anwendungauf eine Benutzereingabe wurden minimiert.Bei der Entwicklung einer Lernanwendung sollte die Benutzerfreundlichkeit (usability)immer im Vordergrund stehen. Deshalb wurde das GUI sehr übersichtlich gestaltet unddarauf geachtet, daß die Bedienung möglichst einfach und komfortabel ist. Für das GUI-Design der Lernanwendung wurden gestalterische Richtlinien, wie z.B. die 8 goldenenRegeln des Interface Desings nach Shneiderman (siehe Kapitel 4.3), berücksichtigt.Die Verwendung der LernBar zur Erstellung des Kurses hat den Vorteil, daß der Kursdurch die Verwendung der vorgefertigten Templates den gestalterischen Richtlinien undQualitätskriterien der LernBar folgt. Durch die Auswahl der vorgegebenen Templates istdas Layout und das Design des Kurses bereits festgelegt. Dies reduziert den Arbeitsauf-wand bei der Erstellung des Kurses enorm. Ein Problem, das jedoch bei der simultanenVerwendung der Lernanwendung und des Kurses auftritt ist, daß nicht beide Anwendun-

71

Page 81: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

6.2 Die Zukunft von 3D-Simulationen und 3D-Visualisierungen im Bereich desE-Learnings

gen zeitglich auf dem Bildschirm dargestellt werden können. Das Fenster des LernBar-Kurses nimmt fast den ganzen Bildschirm ein und kann aufgrund der festen Schriftgrößenicht ohne Verlust von Textteilen verkleinert werden. Der Komfort bei der Benutzung derLernanwendung und des Kurses leidet darunter, daß eine direkte Kommunikation zwi-schen dem LernBar-Kurs und der Lernanwendung aufgrund mangelnder Schnittstellennicht möglich ist, sodaß der Benutzer selbstständig zwischen den beiden Anwendungenwechseln muß. An dieser Stelle ist noch Potential für Verbesserungen vorhanden.Das Problem der zu dunklen Darstellung der Szenen, verursacht durch die schlechteKonvergenz des Verfahrens, wurde durch das in Kapitel 5.5 vorgestellten Verfahren zurKontrasterhöhung überwunden.Java 3D kann wirklich viel und erleichtert durch seine bereitgestellten Klassen die Erstel-lung von 3D-Inhalten. Jedoch enthält Java 3D einige kleinere Bugs und Eigenschaften, dienicht unbedingt so zu erwarten wären. Deren Umgehung stellte bei der Implementierungeine ständige Herausforderung dar. Ein Beispiel dafür sind die in Kapitel 5.5 erwähn-ten Rundungsfehler, die bei der Erstellung der vorgefertigten Geometrien für die Szenenauftreten und das Berechnen der Topologie für das Gouraud-Shading erschweren. VieleProbleme, wie das genannte, konnten umgangen oder beseitigt werden. Ein Problem, dasin dieser Arbeit jedoch nicht umgangen werden konnte, ist, daß es bei der Verwendung desRaster-Objektes, zum Erstellen der Projektionen, wegen Rundungsfehlern zum Verlustvon sehr kleinen Radiosity-Werten kommt (siehe Kapitel 5.4). Es hat sich gezeigt, daßdie Implementierung eines eigenen Radiosity-Renderers, ohne die gesamte Renderingpi-peline selbst zu implementieren, in Java 3D schwierig ist und nur mit Einschränkungbezüglich der Universalität des Renderers realisierbar ist. Könnte man über die in Java3D in Kapitel 4.5 erwähnten Bugs bei dem Im- und Export von Szenen hinwegkommen,dann würde sich die Verwendung eines externen Radiosity-Renderers anbieten.

6.2 Die Zukunft von 3D-Simulationen und 3D-Visualisierungen imBereich des E-Learnings

Wie in Kapitel 3.6 bereits erwähnt wurde, existieren so gut wie keine E-Learning-Autoren-systeme, die dem Autor die Erstellung von komplexen, interaktiven 3D-Inhalten erleich-tern. Alle komplexen 3D-Inhalte müssen per Hand programmiert werden. Deren Ent-wicklung erfordert, ohne Zuhilfenahme von vorgefertigten Komponenten, eine Menge anEntwicklungsaufwand. Besonders Autoren, die nicht aus dem Bereich der Computergra-fik oder der Informatik kommen, fehlen oft die Programmierkenntnisse, um komplexe3D-Inhalte zu Lernzwecken zu erstellen. Deshalb verwundert es auch nicht, daß 3D-

72

Page 82: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

6.2 Die Zukunft von 3D-Simulationen und 3D-Visualisierungen im Bereich desE-Learnings

Visualisierungen und 3D-Simulationen bisher nur im geringen Maße im Bereich des E-Learnings zum Einsatz kommen.Um die Verbreitung von 3D-Simulationen und 3D-Visualisierungen im Bereich des E-Learnings zu erhöhen ist es notwendig, daß diese direkt in Autorensystemen zusammenmit Kursen erstellt werden können. Dies würde mehr Komfort für die Autoren bedeu-ten, aber auch für die Lernenden, denn das Umschalten zwischen 3D-Lernanwendungund Kurs, wie es in der implementierten Lernanwendung erforderlich ist, fällt dadurchweg. Idealerweise sollte das Anlegen von simplen 3D-Inhalten per Drag-and-Drop mög-lich sein, um auch Autoren ohne Programmierkenntnisse die Erstellung solcher Inhaltezu ermöglichen.Es stellt sich die Frage, warum immer noch so gut wie kein einziges E-Learning-Autoren-system die Erstellung von 3D-Inhalten unterstützt, obwohl die Anzahl der E-Learning-Autorensysteme ständig zunimmt. Wie in Kapitel 3.3 bereits erwähnt, ist es eine wichtigeAnforderung für den Einsatz von 3D-Inhalten in Autorensystemen, daß die 3D-Inhalteonline genutzt werden können. Obwohl es schon lange möglich ist mit z.B. Java 3D, dasschon seit über 10 Jahren zur Verfügung steht, VRML, Adobe Flash oder Microsoft Sil-verlight online verfügbare 3D-Inhalte zu erstellen, kam es bisher zu keinem Durchbruchvon 3D-Inhalten im Web. Bevor es keinen 3D-Web-Standard gibt, der sich durchsetztund ähnlich weite Verbeitung wie z.B. Adobe Flash findet, werden Autorensysteme dieErstellung von 3D-Inhalten nur schwer unterstützen können.Ein vielverprechender Ansatz ist Adobe Flash auf 3D zu erweitern, wie z.B. mit Papervi-sion3D26. Eine weitere Möglichkeit könnte HTML 527 sein. HTML 5 ist gerade in der Ent-wicklung und enthält im aktuellen Arbeitsentwurf ein canvas-Element, das Funktionenzur Verwendung und zur Erstellung von 2D-Grafiken bereitstellt. In der API-Übersicht28

des canvas-Elements wird erwähnt, daß eine zukünftige Erweiterung auf 3D-Grafikensehr wahrscheinlich ist. Dies könnte eine Möglichkeit darstellen 3D-Inhalte in allen Web-browsern verfügbar zu machen.Es ist wichtig anzumerken, daß nicht jeder Lerninhalt eine 3D-Darstellung erfordert. Wiebereits in Kapitel 3.4 erwähnt, können einige Inhalte, wie z.B. Radiosity, von einer 3D-Darstellung profitieren, andere jedoch nicht. Das Lehrmaterial vieler Autoren ist in Formvon Foliensätzen präsent und kann somit leicht in einen 2D-Lernkurs umgewandelt wer-den. Das Entwerfen von 3D-Lerninhalten erfordert oftmals eine komplette Neukonzeption

26Weitere Informationen zu Papervision3D siehe: http://papervision-3d.de/papervision3d undhttp://www.papervision3d.org/.

27Weitere Informationen zu HTML 5 siehe: http://dev.w3.org/html5/spec/Overview.html.28Weitere Informationen zum canvas-Element-API siehe: http://www.w3.org/TR/2009/WD-html5-

20090423/the-canvas-element.html#the-canvas-element.

73

Page 83: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

6.2 Die Zukunft von 3D-Simulationen und 3D-Visualisierungen im Bereich desE-Learnings

des Lernmaterials und ist deshalb mit erheblichem Aufwand verbunden. Die Entwicklungvon komplexen 3D-Inhalten dürfte nur schwer in E-Learning-Autorensysteme integrier-bar sein. Ohne die Zuhilfenahme von Skripting oder Programmierung ist dies vemutlichunmöglich. Die Bedürfnisse nach verschiedenen Funktionen bei der Erstellung von 3D-Inhalten sind je nach Themengebiet sehr unterschiedlich, sodaß nur ein Autorensystemzur Erstellung von komplexen 3D-Inhalten geeignet wäre, das so gut wie alle Funktiona-litäten, die auch in OpenGL oder DirectX enthalten sind, bereit stellt, sonst wäre dasAutorensystem nicht universell einsetzbar.Java 3D hat vermutlich keine große Zukunft vor sich, denn es hat sich in den letzten10 Jahren im Bereich von 3D-Web-Inhalten nie richtig durchsetzen können. Weil Java3D nicht zusammen mit der Java-Laufzeitumgebung zur Verfügung gestellt wird, ist esnotwendig Java 3D separat zu installieren. Dies ist hinsichtlich der Verbreitung sicherlichnicht förderlich. Es sind noch immer einige Bugs in Java 3D enthalten. Die Weiterent-wicklung wurde bereits 2004 von Sun Microsystems gestoppt.Wesentlich bessere Alternativen zur Erstellung von 3D-Web-Inhalten lassen jedoch nochauf sich warten. Dennoch dürfte es nur eine Frage der Zeit sein, bis sich ein 3D-Web-Standard durchsetzt und dadurch E-Learning-Autorensysteme die Erstellung von 3D-Inhalten unterstützen.

74

Page 84: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[ABP04] Jarc,D. J.; Feldman, M. B.; Heller, R. S.: Assessing the benefits ofinteractive prediction using web-based algorithm animation courseware. InSIGCSE 2000: Proceedings of 31th SIGCSE Technical Symposium on Com-puter Science Education, Seiten: 377-381, 2000

[ADURL] Spieleentwicklung, Authoring-Software für Multimedia-Inhalte | Adobe Di-rector:http: // www. adobe. com/ de/ products/ director/ , Zugriff: 28.05.2009

[ANI00] Rößling, Guido; Schüler, Markus; Freisleben, Bernd: The ANIMALalgorithm animation tool. In: Commununications ACM, 2000

[ANWEB] Animal Home Page | Home of the Animal AV System:http: // www. algoanim. info/ Animal2/ , Zugriff: 22.05.2009

[AVC07] Grissom, Scott; McNally, Myles F.; Naps, Tom: Algorithm visualizationin CS education: comparing levels of student engagement. In: Commununi-cations ACM, 2003

[AVS07] Shaffer, Clifford A.; Cooper, Matthew; Edwards, Stephen H.: Algo-rithm visualization: a report on the state of the field. In: CommununicationsACM, 2007

[CLABB] Abbildung Course Lab:http: // www. courselab. com/ db/ cle/ root_ id/ courselab/ doc. html ,Zugriff: 27.05.2009

[COLAB] CourseLab - free e-Learning authoring toolhttp: // www. courselab. com/ , Zugriff: 27.05.2009

[DBM84] Kiger, John I.: The depth/breadth trade-off in the design of menu-drivenuser interfaces. In: International Journal of Man-Machine Studies, Seiten:201-213, 1984

[DDL05] Schweitzer, Dino: Designing computer graphics courses for distance lear-ning. In: Commununications ACM, 2005

75

Page 85: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[DMS86] Shneiderman, Ben: Designing menu selection systems. In: Journal of theAmerican Society for Information Science 37(2), Seiten: 57-70, 1986

[DSAVW] Data Structure And Algorithm Visualization - Algoviz Wiki:http: // wiki. algoviz. org/ AlgovizWiki/ , Zugriff: 25.05.2009

[EAS99] Byrne, M. D.; Catrabone, R.; Stasko, J. T.: Evaluating Animations asStudent Aids in Learning Computer Algorithms. Computers and Education,33, Seiten: 253-278, 1999

[EEA94] Lawrence, A. W. ; Stasko, J. T.; Badre, A.: Empirically evaluating theuse of animations to teach algorithms. In: Proceedings, IEEE Symposiumon Visual Languages, Seiten 48-54, 1994

[EEM02] Cockburn, A.; McKenzie, B.: Evaluating the effectiveness of spatial me-mory in 2d and 3d physical and virtual environments. In: Proceedings ofthe SIGCHI conference on Human factors in computing systems, Seiten:203-210, 2002

[EGR87] Shneiderman, Ben: Eight Golden Rules of Interface Design. In: Addison-Wesley, 1987

[GDV09] GDV-Vorlesungsskript SS 2007 V09-Beleuchtungsrechnung:http: // www. gdv. informatik. uni-frankfurt. de/ lehre/ ss2007/

GDV/ Folien/ V09-Beleuchtungsrechnung. pdf , Seite: 9, Folie: 27,Zugriff: 31.03.2009

[GDV11] GDV-Vorlesungsskript SS 2007 V11-RayTracing+Radiosity:http: // www. gdv. informatik. uni-frankfurt. de/ lehre/ ss2007/

GDV/ Folien/ V11-RayTracing+ Radiosity. pdf , Seite: 20ff, Folie: 58ff,Zugriff: 31.03.2009

[Gou71] Gouraud, Henri: Computer display of curved surfaces. In: Commununica-tions ACM, 1971

[Hem85] Greenberg, Donald P.; Cohen, Michael F.: The hemi-cube: a radiositysolution for complex environments. In: Commununications ACM, 1985

[HemPR] Abbildung Projektion auf Hemi-Cube:http: // upload. wikimedia. org/ wikipedia/ commons/ c/ c9/

Hemicube_ Radiosity. png , Zugriff: 03.04.2009

76

Page 86: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[HHB04] Arnold, Patricia; Kilian, Lars; Thillosen, Anne; Zimmer, Gerhard:Handbuch für Hochschulen und Bildungszentren : Didaktik, Organisation,Qualität. BW Bildung und Wissen, 2004

[HLV00] Hansen, S. R.; Narayanan, N. H.; Schrimpsher, D.: Helping learnersvisualize and comprehend algorithms. In: Interactive Multimedia ElectronicJournal of Computer-Enhanced Learning, 2, 2000

[IBR03] Shneiderman, B.: Why not make interfaces better than 3d reality? In:IEEE Comput. Graph. Appl. 23, Seiten: 12-15, 2003

[IMA05] Schulmeister, Rolf: Interaktivität in Multimedia-Anwendungen. 2005www. e-teaching. org/ didaktik/ gestaltung/ interaktiv/

InteraktivitaetSchulmeister. pdf , Zugriff: 08.05.2009

[ITM96] Naiman, Avi C.: Interactive teaching modules for computer graphics. In:Commununications ACM, 1996

[JAAPC] Java Applets Centre:http: // www. cosc. canterbury. ac. nz/ mukundan/ cogr/ applcogr.

html , Zugriff: 25.05.2009

[JHAVÉ] JHAVE: Home Page:http: // jhave. org/ , Zugriff: 22.05.2009

[JWEBS] Java SE Desktop Technologies - Java Web Start Technology:http: // java. sun. com/ javase/ technologies/ desktop/

javawebstart/ index. jsp , Zugriff: 22.05.2009

[KKL02] Gottfried, Clemens; Hager, Gerhard; SCHARL, Wolfgang: KRITERI-ENKATALOG zur qualitativen Bewertung von Lernsoftware. 2002http: // www. htlw3l. ac. at/ kk/ , Zugriff: 08.05.2009

[LeBar] Abbildung LernBar-Kurs:http: // www. megadigitale. uni-frankfurt. de/ et/ LernBar/ index.

html , Zugriff: 08.06.2009

[LerBa] LernBar-Portal:http: // lernbar. uni-frankfurt. de/ , Zugriff: 26.03.2009

77

Page 87: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[PEV07] McNally, Myles; Naps, Tom; Furcy, David; Grissom, Scott; Trefftz,Christian: Supporting the rapid development of pedagogically effective al-gorithm visualizations. In: Commununications ACM, 2007

[PHO75] Phong, Bui T.: Illumination for computer generated pictures. In: Com-mununications ACM, 1975

[PHOSP] Abbildung Phong-Shading Kugel:http: // en. wikipedia. org/ wiki/ File: Phong-shading-sample. jpg ,Zugriff: 31.03.2009

[PrR88] Cohen, Michael F.; Chen, Shenchang E.; Wallace, John R.; Green-

berg, Donald P.: A progressive refinement approach to fast radiosity imagegeneration. In: Commununications ACM, 1988

[Rad84] Goral, Cindy M.; Torrance, Kenneth E.; Greenberg, Donald P.; Bat-

taile, Bennett: Modeling the interaction of light between diffuse surfaces.In: Commununications ACM, 1984

[RADFF] Radiosity Form Factor:http: // www. cs. brown. edu/ exploratories/ freeSoftware/

repository/ edu/ brown/ cs/ exploratories/ applets/

radiosityFormFactor/ radiosity_ form_ factor_ guide. html , Zu-griff: 29.05.2009

[RADPR] Abbildung Glass Szene:http: // en. wikipedia. org/ wiki/ File: Glasses_ 800_ edit. png , Zu-griff: 01.04.2009

[RADSG] Radiosity Shooting vs Gathering:http: // www. cs. brown. edu/ exploratories/ freeSoftware/

repository/ edu/ brown/ cs/ exploratories/ applets/ radiositySVG/

radiosity_ shooting_ vs_ gathering_ guide. html , Zugriff: 29.05.2009

[RADSP] Abbildung Radiosity Kugeln:http: // de. wikipedia. org/ wiki/ Datei: Radiosity-yes. jpg , Zugriff:15.06.2009

[RAGDR] Radiosity | Andy’s Game Development Resources:http: // amesgames. net/ 2004/ 03/ 16/ radiosity/ , Zugriff: 29.05.2009

78

Page 88: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[RAVIS] Radiosity Visualisation:http: // www. cs. cmu. edu/ ~radiosity/ radvis. html , Zugriff:29.05.2009

[RIM01] Cockburn, A.; McKenzie, B.: 3d or not 3d?: evaluating the effect of thethird dimension in a document management system. In: Proceedings Pro-ceedings of the SIGCHI conference on Human factors in computing systems,Seiten: 434-441, 2001

[RIM04] Cockburn, A.: Revisiting 2d vs 3d implications on spatial memory. In:Proceedings of the fifth conference on Australasian user interface, Seiten:25-31, 2004

[sigPR] Radiosity OverView - SIGGRAPH 1993 Education Slide Sethttp: // www. siggraph. org/ education/ materials/ HyperGraph/

radiosity/ radiosity. htm , Zugriff: 07.05.2009

[TCCAA] The Complete Collection of Algorithm Animations:http: // www. cs. hope. edu/ ~dershem/ ccaa/ ccaa/ miscell. html , Zu-griff: 25.05.2009

[TEA96] Gurka, J. S.; Citrin, W.: Testing effectiveness of algorithm animation. In:Proceedings, IEEE Symposium on Visual Languages, Seiten: 182-189, 1996

[TRH78] Siegel, Robert; Howell, John: Thermal Radiation Heat Transfer. Publis-hing Corp., 1978

[UAA01] Ciesielski, Vic; McDonald, Peter: Using animation of state space al-gorithms to overcome student learning difficulties. In: CommununicationsACM, 2001

[VCG96] Goldman, David A.; Eckert, Richard R.; Cohen, Maxine S.: Three-dimensional computation visualization for computer graphics rendering al-gorithms. In: Commununications ACM, 1996

[VLA00] Hundhausen, C.; Douglas, S.: Using visualizations to learn algorithms:should students construct their own, or view an expert´s? In: Proceedings,IEEE Symposium on Visual Languages, Seiten: 21-28, 2000

[VOS93] Ware, C.; Hui, D.; Franck, G.: Visualizing object oriented software inthree dimensions. In: Proceedings of the conference of the Centre for Ad-vanced Studies on Collaborative research, Seiten: 612-620, 1993

79

Page 89: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

Literaturverzeichnis

[WCG98] Klein, Reinhard; Hanisch, Frank; Straßer, Wolfgang: Web-based tea-ching of computer graphics: concepts and realization of an interactive onlinecourse. In: Commununications ACM, 1998

[Whi80] Whitted, Turner: An improved illumination model for shaded display. In:Commununications ACM, 1980

[WRA93] Gortler, Steven J.; Schröder, Peter; Cohen, Michael F.; Hanrahan,Pat: Wavelet Radiosity. In: Commununications ACM, 1993

[WSIGR] WSI-GRIS: GraphicalDevice:http: // www. gris. uni-tuebingen. de/ edu/ projects/ grdev/ doc/

html/ Overview. html , Zugriff: 25.05.2009

[WSIP1] Abbildung: Visualisierung von Progressive-Refinement-Radiosityhttp: // www. gris. uni-tuebingen. de/ edu/ projects/ grdev/

applets/ progressiverefinement/ html/ index. html ,Zugriff: 04.06.2009

[WSIP2] Abbildung: Interaktive Visualisierung von Progressive-Refinement-Radiosityhttp: // www. gris. uni-tuebingen. de/ edu/ projects/ grdev/

applets/ radio3D/ html/ index. html , Zugriff: 04.06.2009

80

Page 90: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

A Anhang

A.1 LernBar-Kurs

Auf den nachfogelnden Seiten ist der gesamte LernBar-Kurs als Pdf-Export abgebil-det.

81

Page 91: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

1 von 33Radiosity /Kurs-Einleitung/Seiten/Kurs-Einleitung

2 von 33Radiosity /Radiosity - Einleitung/Seiten/Radiosity - Einleitung

A.1 LernBar-Kurs

82

Page 92: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

3 von 33Radiosity /Radiosity - Einleitung/Seiten/Radiosity - Einleitung

4 von 33Radiosity /Radiosity - Einleitung/Seiten/Formfaktoren

A.1 LernBar-Kurs

83

Page 93: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

5 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 1

6 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 2

A.1 LernBar-Kurs

84

Page 94: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

7 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 3

8 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 4

A.1 LernBar-Kurs

85

Page 95: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

9 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 5

10 von 33Radiosity /Radiosity - Einleitung/Seiten/Frage 6

A.1 LernBar-Kurs

86

Page 96: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

11 von 33Radiosity /Bedienungsanleitung/Seiten/Bedienungsanleitung

12 von 33Radiosity /Bedienungsanleitung/Seiten/Bedienungsanleitung

A.1 LernBar-Kurs

87

Page 97: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

13 von 33Radiosity /Initialisierung/Seiten/Initialisierung

14 von 33Radiosity /Initialisierung/Seiten/Frage 7

A.1 LernBar-Kurs

88

Page 98: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

15 von 33Radiosity /Progressive Refinement/Seiten/Progressive Refinement

16 von 33Radiosity /Progressive Refinement/Seiten/Progressive Refinement

A.1 LernBar-Kurs

89

Page 99: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

17 von 33Radiosity /Progressive Refinement/Seiten/Frage 8

18 von 33Radiosity /Progressive Refinement/Seiten/Frage 9

A.1 LernBar-Kurs

90

Page 100: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

19 von 33Radiosity /Laufzeit- und Speicherplatzkomplexität/Seiten/Laufzeit- und Speicherplatzkomplexität

20 von 33Radiosity /Laufzeit- und Speicherplatzkomplexität/Seiten/Laufzeit- und Speicherplatzkomplexität

A.1 LernBar-Kurs

91

Page 101: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

21 von 33Radiosity /Laufzeit- und Speicherplatzkomplexität/Seiten/Frage 10

22 von 33Radiosity /Laufzeit- und Speicherplatzkomplexität/Seiten/Frage 11

A.1 LernBar-Kurs

92

Page 102: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

23 von 33Radiosity /Der Hemi-Cube/Seiten/Der Hemi-Cube

24 von 33Radiosity /Der Hemi-Cube/Seiten/Der Hemi-Cube

A.1 LernBar-Kurs

93

Page 103: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

25 von 33Radiosity /Der Hemi-Cube/Seiten/Der Hemi-Cube

26 von 33Radiosity /Der Hemi-Cube/Seiten/Frage 12

A.1 LernBar-Kurs

94

Page 104: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

27 von 33Radiosity /Der Hemi-Cube/Seiten/Frage 13

28 von 33Radiosity /Projektion auf den Hemi-Cube/Seiten/Projektion auf den Hemi-Cube

A.1 LernBar-Kurs

95

Page 105: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

29 von 33Radiosity /Schlusswort/Seiten/Frage 14

30 von 33Radiosity /Schlusswort/Seiten/Frage 15

A.1 LernBar-Kurs

96

Page 106: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

31 von 33Radiosity /Schlusswort/Seiten/Frage 16

32 von 33Radiosity /Schlusswort/Seiten/Schlusswort

A.1 LernBar-Kurs

97

Page 107: Visuelle Simulation eines Radiosity Algorithmus und ihre ... · Konzept zur Implementierung der Lernanwendung und zur Erstellung des Kurses vor-gestellt und erläutert. Der Ablauf

33 von 33Radiosity /Schlusswort/Seiten/Auswertung

A.1 LernBar-Kurs

98