flash-tutorials - Digital Media

Transcription

flash-tutorials - Digital Media
ABSCHLUSSARBEIT
ZUR ERLANGUNG DES AKADEMISCHEN
GRADES BACHELOR OF ARTS
FLASH-TUTORIALS
FÜR EINSTEIGER ALS
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
VIDEO-PODCAST
„Hiermit erklären wir, dass wir die Arbeit selbständig und nur mit den
angegebenen Quellen und Hilfsmitteln angefertigt haben. Weiterhin
erklären wir, dass die Arbeit nicht anderweitig veröffentlicht oder in
einem anderen Fach als Prüfungsleistung vorgelegt wurde.
Der betreuende Dozent: Professor Silko M. Kruse.“
Ulm, den 12. Januar 2007
Alexander Steinhart
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Marcus Merz
ERKLÄRUNG
2
3
1. THEMENBESCHREIBUNG
7
2. DATEN DVD
9
3. RECHERCHE
10
3.1. ALLGEMEIN
3.1.1. Thematik und Nutzbarkeit
10
3.1.2. Positionierung, Zielgruppe
11
3.1.3. Verbreitung von videofähigen Playern
12
3.1.4. Weitere Nutzbarkeit
13
3.1.5. Erweiterbarkeit der Tutorials
14
3.2. FLASHTUTORIAL
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
10
15
3.2.1. Mögliche Arten von Tutorials
15
3.2.2. Grundidee Jump’n’Run-Spiel
16
3.2.3. Grundlagen der Animation
17
3.2.4. Grundlagen ActionScript
19
3.2.5. Animationen anlegen
20
3.2.6. Programmierung des Spiels
21
3.2.7. Modularisierung der Inhalte
21
3.2.8. Vorlesungen
24
3.2.9. Evaluation
24
3.3. VIDEO-PODCAST
25
3.3.1. Verbreitungsgrad
25
3.3.2. Darbietungsform und Größe
25
3.3.3. Bedienbarkeit und Wiedergabemöglichkeiten
26
3.3.4. Videoformate und Codecs
26
3.3.5. h.264
27
3.3.6. RSS-Feed
29
3.3.7. Chapters
30
3.3.8. Zusammenfassung
32
INHALTSVERZEICHNIS
INHALTSVERZEICHNIS
3.4. AUDIO- /VIDEOPRODUKTION
3.4.1. Produktionsschritte
32
3.4.2. Drehbuchentwicklung, Inhalte, Kapitel
33
3.4.3. Aufnahmeart (Hardware / Software)
33
3.4.4. Rohdatenformate
35
3.4.5. Einblendungen und grafische Darstellungen
36
3.4.6. Schnitt
36
3.4.7. Export und Einstellungen
38
3.4.8. Audioaufnahme und -bearbeitung
38
3.5. WEBSEITE
3.5.1. Nötige Inhalte
4. KONZEPT
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
32
38
38
40
4.1. ANFORDERUNGEN AN DER ERGEBNIS
40
4.2.
FLASH-TUTORIAL
40
4.2.1. Spielekonzept
41
4.2.2. Modularisierung
41
4.2.3. Inhalte und Ziele der Module
41
4.2.4. Konzeptweiterentwicklung durch Vorlesungen
44
4.2.5. Erkenntnisse aus den jeweiligen Vorlesungen
45
4.2.6. Problembehebungen auf Grund der Vorlesungen
45
4.2.7. Scriptbestandteile
45
4.3. PODCAST
48
4.3.1. Erscheinungsbild
48
4.3.2. Bildgröße
48
4.3.3. RSS-Struktur
48
4.4. VIDEOPRODUKTION
50
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
4.4.1. Drehplanentwicklung
50
4.4.2. Drehpläne 1 bis 8
51
4.4.3. Aufnahmeschritte und deren Einstellungen
51
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
4.4.4. Darstellung der Inhalte
51
4.4.5. Schnitt
52
4.4.6. Export
53
4.4.7. Filmgeschwindigkeit
53
INHALTSVERZEICHNIS
4
4.5. WEBSITE
4.5.1. Struktur
54
4.5.2. Navigation
54
4.5.3. Typografie
55
4.5.4. Farbdesign
55
4.5.5. Bildsprache und grafische Elemente
55
4.5.6. Layoutraster
56
4.5.7. Sitemap
57
4.6. DVD
58
4.6.2. Layout
58
4.6.3. Menüführung
58
4.6.4. Authoring
59
5.1. VIDEOPRODUKTION
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
58
4.6.1. Zusätzliches Offlinemedium
5. REALISIERUNG
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
54
60
60
5.1.1. Drehbücher
60
5.1.2. Aufnahme und Aufnahmeschritte
61
5.1.3. Einstellungsgrößen
61
5.1.4. Einblendungen
62
5.1.5. Schnitt
63
5.1.6. Nachvertonung
64
5.1.7. Audiobearbeitung
64
5.1.8. Komposition von Audio und Video
65
5.1.9. Export und Einstellungen
65
5.1.10. Konvertierung
65
5.1.11. Kapitelmarken
67
5.2. PODCAST ERSTELLEN
67
5.2.1. Downloadsite erstellen
67
5.2.2. RSS erstellen
68
5.2.3. Verknüpfung von Videos und RSS
68
5.2.4. Anmeldung bei iTunes
69
5.3. DVD
5.3.1. Erstellung
69
69
INHALTSVERZEICHNIS
5
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
6. ANHANG
70
6.1.
6.2.
6.3.
6.4.
6.5.
6.6.
6.7.
QUELLEN
DREHBÜCHER
SCRIPT
RSS-FEED
FIGUR MIT ZWIEBELSCHALEN
SCREENSHOTS GAME
SOFTWARE
70
73
76
89
92
95
97
6.8.
6.9.
6.10.
6.11.
6.12.
6.13.
HARDWARE
WEBSITE
MENÜFÜHRUNG DVD
TECHNISCHE DATEN IPOD (AUSSCHNITT)
FRAGEBOGEN EVALUATION
EVALUATIONSERGEBNISSE
98
99
102
103
105
107
INHALTSVERZEICHNIS
6
7
„Flash-Tutorials für Einsteiger als Video-Podcast“ lautet der Titel unserer
Abschlussarbeit. Diese Tutorials sind für Einsteiger in Flash gedacht und
diesen helfen einen leichteren Einstieg in das mittlerweile sehr komplexe Autorenwerkzeug Flash zu finden. Flash wurde in den letzten Jahren
zu einem immer wichtigeren Werkzeug für Web- und Multimediaanwendungen, mit dessen Hilfe unterschiedlichste Medien verbunden
und interaktiv behandelt werden können. Das Spektrum der mit Flash
erstellbaren Anwendungen reicht von einfachen linearen Animationen,
über Websites und Spiele, bis hin zu komplexen Websystemen mit
Datenbankanbindungen. Offline- wie auch Online-Anwendungen mit
einer Kombination aus Audio-, Video-, Bild- und Textelementen sind
möglich. So vielfältig die Möglichkeiten von Flash sind, so komplex ist
auch der Einstieg in Flash. Denn es gilt von Anfang an, die Vorteile von
Flash abzuwägen und zu nutzen. Hier sei besonders die Kombination
von Animation und Programmierung.
Wenn man nun Bücher betrachtet, die sich mit dem Einstieg in Flash
beschäftigen, gibt es solche, die sehr leicht erscheinen. Hier ist es
jedoch oft so, dass der Einsteiger nur Dinge nachbauen und das Script
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
abschreiben muss, um zu dem vorgegebenen Ziel zu kommen. Der Lernerfolg ist folglich gering. Andere Bücher hingegen sind so geschrieben, dass Einsteiger oft den Faden verlieren und mit der Zeit auch die
Lust, sich mit der Thematik zu beschäftigen. An diesem Punkt setzt unser didaktisches Konzept an. Wir wollen die Leute weder unterfordern,
noch mit der Thematik abschrecken. Daraus entsteht der Anspruch zu
fördern wie auch zu fordern.
Um diesen Anspruch auch zu realisieren, nutzen wir ein Medium, das
bisher nicht für Einsteiger Tutorials in Flash genutzt wurde. Wir nutzen
Videos, im genaueren Video-Podcasts, um unsere Inhalte zu vermitteln.
Das Medium Video hat in Vergleich zum Buch entscheidende Vorteile.
1. THEMENBESCHREIBUNG
1. THEMENBESCHREIBUNG
So bietet das Medium Video die Möglichkeit, Dinge mit Bewegtbild
und Ton zu erklären. Aber auch Texte können eingearbeitet werden.
So können wir visuell, auditiv und textuell Dinge besser erklären, als
zum Beispiel in einem Buch. Zudem können die Videos direkt auf dem
Rechner, auf dem gearbeitet wird, angesehen werden. Dies bietet die
Möglichkeit durch einfaches „Switchen“ hin und her zu schalten. Nun
kann man dem Buch, im Vergleich zum Video, zu gute Halten, dass
man es überall lesen kann und auch leichter zu bestimmten Punkten
springen kann. Dieses Manko lässt sich mit Video-Podcast beheben.
Ein Video-Podcast lässt sich überall auf dem iPod anschauen und bietet
nun im Vergleich zum Buch wiederum die Oben genannten Vorteile.
Auch das Springen zu bestimmten Punkten im Video lässt sich mit
dem Videopostcast ermöglichen. Durch bestimmte Veränderungen im
RSS-Feed können Kapitel erzeugt werden, die wie die Kapitel auf einer
Video-DVD funktionieren.
So kann man das Thema mit „Einsteigerlehrgängen für die Autorensoftware Flash mit Hilfe von Podcast“ umschreiben. Hier können wir die
oben beschriebenen Punkte sinnvoll vereinigen und die Vorteile, die ViAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
deos beim Lernen haben, ausnutzen. Zudem gibt es, obwohl es bereits
eine Fülle von Video-Tutorials gibt, in dieser Nische in Kombination mit
Video-Podcasts, keinerlei Produkte.
1. THEMENBESCHREIBUNG
8
9
2.2.DATEN
DATEN DVD
DVD
2. DATEN DVD
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
10
3.1.
ALLGEMEIN
3.1.1.
Thematik und Nutzbarkeit
„Flash-Tutorials für Einsteiger als Video-Podcast” stellt als Thema
mehrere Herausforderungen. Zum Ersten geht es um die Vermittlung
von Wissen über die Software Flash, wobei hier von Anfang an ein
Schwerpunkt gesetzt werden muss, da Flash auf Grund seiner vielseitigen Anwendungsgebiete nicht mit einem Tutorial abgehandelt
werden kann. Mit Flash können Animationen, Applikationen wie auch
eine Kombination aus beidem erstellt werden. Große Anwendungsgebiete sind neben Flash-Filmen, die rein auf Animation basieren, auch
Spiele oder Websites. Letztere können statische Seiten sein, aber auch
komplexe Shopsysteme mit Datenbankanbindung. Dies wird durch die
Kombination von Gestaltungs- und Animationsmöglichkeiten und dem
fest integrierten Programmierteil in Flash ermöglicht. Hauptsächlich
dient Flash als Online-Medium, kann aber auch dazu verwendet werden Offlinemedien zu erstellen.
Ein weiterer großer Vorteil von Flash ist die problemlose Integration
von verschiedensten Medien innerhalb der Animation oder Applikation. Neben Texten und Bildern können auch Audiodateien und Filme
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
integriert werden. Flash ist somit ein wichtiges Werkzeug für interaktive
Multimediaproduktionen. Nun gilt es, einen Ausschnitt aus all diesen
Anwendungsgebieten zu wählen, der zum Einen für Einsteiger geeignet ist, zum Anderen aber auch einen weitreichenden Überblick über
Flash gibt.
Die zweite Herausforderung des Themas stellt der Video-Podcast.
Video-Podcasts sind eine recht neue Entwicklung basierend auf dem
Modell Podcast, bei dem Audiodateien auf einen iPod geladen und
dort angehört werden können. Ermöglicht wird das ganze durch Metadaten, die dem Podcast als RSS-Feed mitgegeben werden. Diese Feeds
ermöglichen es, dass die Podcasts maschinell, das heißt mit geeigneter
Software, automatisch gesucht werden können. Ein Beispiel für solch
3. RECHERCHE
3. RECHERCHE
eine Software ist iTunes. Basierend auf dieser Technologie und der
Abspielbarkeit von Videos auf iPods der neuesten Generation entstand
der Video-Podcast, der bestimmte Anforderungen an Produktion und
Publikation der Videos stellt.
Beide oben beschriebenen Herausforderungen ergeben in etwa die
Nutzbarkeit der Video-Podcasts. Es muss darauf geachtet werden, dass
die Tutorials inhaltlich zwar einen Überblick über die Fülle von Möglichkeiten von Flash geben, dennoch aber den Status eines Einsteigertutorials nicht übersteigen. Des Weiteren muss auf die Eigenschaften des
Video-Podcasts ein Augenmerk gelegt werden. So müssen die Videos
ansprechend aufgemacht sein, jedoch wichtige Anforderungen, wie
zum Beispiel die Lesbarkeit des Quellcodes oder die Spezifikationen für
die Videowiedergabe auf einem iPod, erfüllen.
3.1.2. Positionierung, Zielgruppe
Da es bereits sehr viele Videotutorials gibt, ist es besonders wichtig
sich richtig zu positionieren. Dabei stellt sich die Frage, was mit den
Tutorials erreicht werden soll und wer damit angesprochen werden
soll. Als Zielgruppe für unsere Tutorials sind Einsteiger der Thematik
Flash angepeilt. Denn eine Untersuchung des bisherigen Angebotes an
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Videotutorials ergab, dass es besonders hier noch eine Lücke im Markt
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Problem, z.Bsp. Videos zu erstellen, welche die Programmierung gut
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
gibt. Die Gründe hierfür vielfältig. Zum einen das große Spektrum
an Möglichkeiten mit Flash zu arbeiten. Zum Anderen aber auch das
darstellen.
Oft zeigte sich auch, dass viele Tutorials recht einfach gemacht sind.
Meist gibt es nur die Einstellungsgröße „Fullscreen“ und jemand bearbeitet ein Projekt darin. Die Art der Wissenübermittlung zeigt keine
Schwerpunkte und auch der Audioteil der das Gezeigte zusätzlich
erklären soll, ist oft sehr monoton angelegt. In machen Fällen ist der
Tutor durch Einflüsse in seiner Umgebung abgelenkt oder der Ton ist
3. RECHERCHE
11
schlecht aufgenommen. Dies ist das Problem von Liveaufnahmen die
nicht nachbearbeitet werden.
Anhand dieser Punkte ergab sich unsere Positionierung aber auch die
Zielgruppe. Die Zielgruppe sollen Einsteiger in Flash sein, die bisher
noch nicht mit Flash gearbeitet haben. Sie sollten jedoch eine kleines
Vorwissen über Grundlagen einer Programmiersprache haben und
bereits mit Photoshop oder ähnlichen Programmen gearbeitet haben. Die Positionierung ergibt sich vor allem durch diese Zielgruppe,
aber auch durch die Aufmachung der Videos. Dabei sollen durch zum
Beispiel durch Schnitte und verschiedene Einstellungsgrößen Leben
in das Tutorial gebracht werden. Aber auch der Audioteil bekommt
eine besondere Beachtung. Nach der Vertonung wird der Ton in einer
Audio-Nachbearbeitung aufbereitet und somit besser verständlich.
3.1.3. Verbreitung von videofähigen Playern
http://www.amazon.com/gp/bestsellers/
electronics/ref=pd_ts_h/102-7992411-9627369
http://essen.ruhrpott-kingdom.de/index.php/
2006/01/11/apple-keynote-2006/
Bisher gibt es recht wenige mobile videofähige Player. Dazu gehört neben dem iPod der fünften Generation auch der neu in den USA erschienene Zune von Microsoft. Dieser ist zwar ebenfalls Video-Podcastfähig,
jedoch ist der Synchronisation und Suche hier wesentlich schwerer als
beim iPod. Dieser hat durch iTunes eine kostenlose Software, die eine
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Suche durchführt und den iPod automatisch mit den Daten versorgen
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
sich aus den Verkaufszahlen von Elektronikartikeln, beispielsweise von
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
kann. Auch ist der Verbreitungsgrad des iPod der fünften Generation
wesentlich höher. Es gibt derzeit keine konkreten Zahlen, jedoch ergibt
Amazon.com ein klares Bild. So gehört der videofähige iPod zu einem
der am meisten verkauften Elektronikartikel überhaupt.
Zudem gab Apple CEO Steve Jobs im Januar 2006 bei den Apple-Keynotes bekannt dass allein im Weihnachtsgeschäft 2005 14 Millionen
iPods verkauft wurden. (Vorjahr: 4,5 Millionen). Dabei bleibt unklar
wie sich diese Zahl aufteilt in die verschiedenen iPods wie Shuffle,
Nano oder des großen Modells. Aber insgesamt kann man nach der
3. RECHERCHE
12
Betrachtung dieser Werte sagen, dass es doch einen recht großen
Verbreitungsgrad videofähiger und mobiler Player geben muss. Zudem
ist die Wiedergabe auch nicht an einen Mobilen Player gebunden. So
kann jeder Video-Podcast auch auf einem Computer mit entsprechender Software angesehen werden. Da iTunes von Apple eine integrierte
Suchfunktion hat, bietet sich dieser an. Jedoch auch mit QuickTime
oder dem Windows MediaPlayer können die Podcasts wiedergegeben
werden. Insgesamt kann man nun festhalten, dass eine problemlose
Verbreitung und Wiedergabe auch unabhängig von der Anzahl der
mobilen Endgeräte möglich ist,
3.1.4. Weitere Nutzbarkeit
Neben der Verbreitung von Videos über podcastfähige Player gibt es
noch weitere Möglichkeiten die Videos zu publizieren. Dabei ist an Medien wie DVD oder Streaming Video über das Internet zu denken.
Vor der Produktion einer DVD sind diverse Vorbereitungen zu treffen.
So sollte die Aufnahme und der Schnitt der Videos mindestens mit PALAuflösung (720x576 Pixel) geschehen. Für einen Video-Podcast würde
die QVGA-Auflösung (320x240 Pixel) genügen. Da aber diese Auflösung
nicht einmal derer von 1/2 PAL entspricht und somit noch unter der
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Auflösung von einem VHS-Video liegt, wäre die zu erwartende Bild-
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
geschehen, was zwar noch geringfügig unter der Auflösung von PAL
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
qualität des Videos zu schlecht um eine gute DVD zu erstellen. So muss
die Aufnahme mindestens mit einer VGA-Auflösung (640x480 Pixel)
liegt, aber noch im akzeptablen Bereich liegt.
Die zweite Möglichkeit ein Streaming Video zu erstellen ist mit dieser
Grundauflösung von VGA ebenfalls kein Problem. Jedoch gibt es auch
hier wieder bestimmte Einstellungen die beachtet und bereits in der
Aufnahme eingestellt werden müssen. So darf es hier keine Halbbilder geben, wie es beim PAL-Bild üblich ist. Diese würden beim Umschreiben in ein Streamingformat wie zum Beispiel FlashVideo (.flv),
3. RECHERCHE
13
zu Streifen führen und somit zu erheblichen Einbußen in der Bildqualität. Auch im Schnitt muss gegeben sei, dass keine Halbbilder erstellt
werden. Überdies muss weitestgehend auf Überblendungen oder zu
schnelle Schnitte verzichtet werden, da auch dies zu einer Minderung
der Bildqualität führen würde. Die Publikation dieser Videos kann dann
über eine Webseite geschehen, auf der dann auch die Podcasts zum
Download angeboten werden.
Insgesamt muss auch auf die Unterschiede der Seitenverhältnisse der
Pixel in den verschiedenen Medien geachtet werden. So ist das Pixelverhältnis beim Podcast, wie auch beim Streaming Video 1:1, jedoch
beim PAL-Format folgt es einem verhältnis von 4:3. Da aber die Produktion konstant bei quadratischen Pixeln erfolgt und nur bei der Erstellung des PAL-Formats einmal umgerechnet werden würde, ist dieses
Problem nicht maßgeblich und vermindert kaum die Bildqualität beim
PAL-Format.
3.1.5. Erweiterbarkeit der Tutorials
Grundsätzlich werden die Tutorials so angelegt, dass sie eine Sinneinheit bilden und in sich abgeschlossen sind. Da, wie in den vorigen
Kapiteln schon beschrieben, die Fülle an Anwendungsgebieten von
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Flash sehr groß ist, kann überlegt werden, weitere Tutorials zu erstellen, die sich dann mit anderen Themen von Flash beschäftigen. So
kann eine Sammlung von Themen entstehen, die dann thematisch von
einander getrennt betrachtet werden, aber in ihrer Gesamtheit als ein
große Tutorialsammlung fungieren können. Auch die geplante Website
zum Download kann dann dementsprechend angelegt und erweitert
werden. Das gleiche gilt dann für die anderen möglichen Medien wie
DVD oder Streaming Video.
3. RECHERCHE
14
3.2. FLASHTUTORIAL
3.2.1. Mögliche Arten von Tutorials
Zunächst stellte sich die Frage, wie die Tutorials zum einen lehrreich,
zum anderen aber auch bindend sein könnten. Inhaltlich hatten wir
mehrere Möglichkeiten zur Auswahl, die grob in zwei Bereiche aufgeteilt werden können.
Eine Möglichkeit bestand darin, Podcasts zu produzieren, die untereinander inhaltlich kaum oder keinen Bezug haben. Dies hätte den
Vorteil, dass wir bestimmte wichtige Elemente, die für einen Einsteiger
in Flash wichtig sind, hervorheben können. Jedoch ist die Bindung der
Betrachter zu den Podcast gering, da einzelne Bausteine voneinander
unabhängig betrachtet werden können. Des Weiteren kann in manchen Fällen nicht zu sehr in die Tiefe gegangen werden, da nicht immer
von dem gleichen Stand ausgegangen werden kann. Folglich müsste
immer bei Null begonnen werden. Gut für die neuen Betrachter, jedoch
schlecht für Betrachter, die die Podcasts öfter anschauen. Diese werden
gelangweilt und verlieren so das Interesse.
Ein anderer gangbarer Weg wäre, ein großes Projekt innerhalb von
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
mehreren Folgen zu behandeln. Hier wäre die Bindung der Betrachter höher, da er immer wieder auf schon einmal Gelerntem aufbauen
kann. Er kann ein großeres Projekt bearbeiten und kann somit auch
größere Zusammenhänge in Flash erkennen, die Einzelepisoden nicht
ermöglichen. Jedoch muss das Projekt, das bearbeitet wird, ebenfalls
modularisierbar sein. Das heißt, es muss in verschiedene kleinere
Sinneinheiten zerlegt werden können, die dann die einzelnen Episoden bilden. Auch die Schritte zwischen den Podcast dürfen nicht zu
groß sein, damit sie ein Einsteiger noch gut nachvollziehen kann. Ein
weiterer Vorteil einer Episodenreihe ist, dass mit der Zeit das Niveau
angehoben werden kann. Zum einen um die Betrachter zu binden,
zum anderen lassen sich so auch Lösungen zu schwierigeren Probleme
zeigen, was bei Einzelepisoden kaum möglich wäre.
3. RECHERCHE
15
Insgesamt schien uns der Weg, eine Reihe von Episoden zu erstellen,
sinnvoller und auch ansprechender. Aber der Inhalt der Podcasts sollte
auch modularisierbar sein und es ermöglichen, Sinneinheiten zu erstellen. Für diese Forderung schien uns ein Spiel am sinnvollsten. Daran lassen sich alle Eigenschaften und Möglichkeiten von Flash gut erklären.
Auch kann ein Spiel in Module aufteilbar und somit auf einzelne Episoden aufteilen. Nach Rücksprache mit Professor Kruse entwickelten wir
die Idee, ein Jump’n’Run-Spiel zu erstellen. Hier sind die verschiedenen
Elemente wie Animation, Steuerung dieser Animationen, Programmierung, usw. besonders gut darstellbar. Zudem bieten sie dem Betrachter
die Möglichkeit ein interessantes Spiel zu erstellen, was eine weitere
Bindung an die Episoden bedeutet.
3.2.2. Grundidee Jump’n’Run-Spiel
Wie schon oben beschieben, hatten wir beschlossen die Erstellung
eines Jump’n’Run-Spiel als Inhalt der Podcasts zu nehmen. Nun galt es
grob zu überlegen, welche Module für einen Einsteiger wichtig sind,
und wie wir diese innhalb des gesamten Tutorials werten und behandeln können. Flash besteht aus zwei großen Bereich. Zum einen das
vektorielle Arbeiten mit Grafiken und deren Animation, zum anderen
aus einem, seit ActionScript 2.0, sehr mächtigen Programmierteil.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Dementsprechend sollte auch die Gewichtung der Inhalte sein. Ein Teil
sollte sich mit Animation und der Steuerung von Animationen befassen. Darin sollten neben den Zeichnen in Flash und der Einbindung von
extern erstellten Animationen auch das Thema der Tween-Animation
(Animation zwischen zwei Schlüsselbildern) gezeigt werden.
Der andere, in unseren Tutorials stärker gewichtete Teil, sollte sich mit
dem Arbeiten mit ActionScript befassen. Denn jede Animation lässt
sich auch mit Script erstellen. Zum anderen bietet uns diese Gewichtung die Möglichkeit, zu zeigen, dass man ein Spiel mit einem guten
Script interessanter gestalten kann, als nur mit einfachen Animationen.
3. RECHERCHE
16
3.2.3. Grundlagen der Animation
Alle Animationen, wie Film und Video, bestehen aus vielen einzelnen
Bildern (Frames). Diese statischen Bilder bleiben in den Augen des
Betrachters eingefroren, bis das nächste Bild am Auge vorbeiflitzt. Das
menschliche Gehirn kann diese statischen Bilder nicht als einzelne
Bilder erkennen, er sieht sie in einer rhythmischen Bewegung. Wären
unsere Augen schneller und das Hirn nicht so leichtgläubig, würden wir
Filme und Cartoons nur als einzelne Standbilder sehen.
Animatoren geben die Anzahl von Bildern pro Sekunde, die Datenrate
oder auch die Bildgrösse immer in Zahlen an. Diese Begriffe benötigen
eine genauere Erklärung.
Keyframe (Schlüsselbild)
Schlüsselbilder können als Meilensteine einer Animation angesehen
werden. Schlüsselbilder werden immer dann gesetzt, wenn sich in der
Animation grundlegend etwas verändert. Das kann eine Richtung-,
Farb-, Geschwindigkeits- oder Darstelleränderung sein. Für alle Arten
von Animationen ist das richtige Setzen von Keyframes das A und O für
eine schöne Animation.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Frames per Second (fps)
Bilder pro Sekunde wird auch Bildrate (Framerate) genannt. 30 Bilder
pro Sekunde sind Standard für Video, 24 für Film. Die Webanimation
funktioniert zwischen 10 und 30 fps. 10 Bilder pro Sekunde ist wohl
das Minimum an Bildrate, die noch eine etwas realistische Animation
produzieren kann. Realistischer sind Bildraten von 12 bis 15 fps.
Frame Size (Bildgrösse)
Mit Bildgrösse ist die horizontale und vertikale Ausdehnung in Pixeln
gemeint. Eine Web-Animation kann in jeder gewünschten Grösse erstellt werden. Je grösser das Bild ist, desto mehr Datenspeicher benötigt die Animation. und desto langsamer wird sie. Die meisten ganzflächigen Flash-Animationen werden in der Grösse 640 x 480 Pixel erstellt.
3. RECHERCHE
17
Diese Grösse kann auf jedem noch so kleinen Monitor ganz dargestellt
werden. Für Flash ist die effektive Bildgrösse nicht so wichtig, wie für
pixelorientierte Tools, da der Flash Film ohne Qualitätsverlust skaliert
werden kann.
Animationsgrösse (Dateigrösse)
Dieser Begriff wird oft verwechselt mit Bildgrösse oder Auflösung, wird
aber meist für die Datengrösse – für die Grösse in Kilobytes auf der
Festplatte – benutzt. Diese Datenmenge muss der User downloaden,
damit er die Animation vollständig anschauen kann. Flash unterstützt
die Möglichkeit des „Streaming“. Das bedeutet, das die Animation anfängt, sobald die ersten Bilder vollständig geladen sind. Während sich
der Betrachter diese Bilder ansieht, wird im Hintergrund der Rest der
Animation heruntergeladen.
Datenrate
Die Datenrate ist die Menge von Daten, die die Animation über die
Zeitstrecke, in der sie abläuft, benötigt: Dieser Wert wird normalerweise in Kilobytes pro Sekunde angegeben. Es besteht die Möglichkeit,
die Datenrate über den (in Flash integrierten) „Bandwidth Profiler“ zu
kontrollieren, Gleichzeitig kann man mit dem Bandwidth Profiler sehen,
wo die Animation eventuell „ruckeln“ wird und wo es keine Probleme
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
geben wird.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Grundsätzlich gibt es zwei ganz unterschiedliche Animationsarten: Bei
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Frame-by-Frame - kontra Tween-Animation
der Frame-by-Frame-Animation (Bild-für-Bild-Animation) wird jedes
einzelne Bild einer Animation selbst erstellt. Jede Veränderung von Bild
zu Bild wird selbst vorgenommen. Die zweite Art ist die so genannte Tween-Animation (Dazwischen-Animation). Bei dieser Animation
werden vom User nur das erste und das letzte Bild der Animation selber
erstellt. Die Bilder dazwischen werden von der Software „on the fly“
erstellt. Ändert man das Anfangs- oder Endbild, werden alle Bilder dazwischen automatisch wieder neu erstellt.
3. RECHERCHE
18
Beide Arten von Animationen haben Vor- und Nachteile
Bei der Frame-by-Frame-Animation kontrolliert der Animator jedes
einzelne Bild und seine Nuancen. Dadurch hat man aber auch sehr viele
Keyframes. Der Computer muss jedes dieser Keyframes neu rechnen.
Mit der Funktion Onionskinning (Zwiebelschichten) bietet Flash für
Frame-by-Frame-Animationen eine praktische Hilfe. Da Frame-by-Frame-Animationen so viele Keyframes haben, eignen sie sich nicht für
Streaming. Dadurch ergibt sich für den Nutzer der Nachteil, dass er warten muss, bis die gesamte Animation heruntergeladen ist. So können
längere Wartezeiten für den User entstehen.
Die Tween-Animation ist schnell. Ein kleiner Nachteil dieser Art von
Animation ist, dass die von der Software errechneten Zwischeschritte
vielleicht nicht immer ganz den eigenen Vorstellungen des Animators
entsprechen. Dem kann man aber leicht abhelfen, indem man nicht nur
am Anfang und am Ende, sondern auch bei wichtigen Zwischenschritten (Inbetweens) einen Keyframe setzt.
Zeitleiste
Die Zeitleiste organisiert und kontrolliert den Inhalt des Flash-Films
während des ganzen Ablaufs. Die wichtigsten Komponenten der Zeitleiste sind die Frames (die einzelnen Bilder), die Layer (Ebenen) und der
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Playhead (Abspielkopf).
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
3.2.4. Grundlagen ActionScript
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
ActionScript ist die Scriptsprache die in Flash verwendet wird. Bis
zur Flash Version 6 wurde ActionScript 1.0 verwendet, ab der Version
7 ist dies ActionScript 2.0. Vorraussichtlich wird Flash 9 bereits mit
ActionScript 3.0 ausgestattet sein. Innerhalb unseres Tutorials werden
wir uns mit der Programmierung in ActionScript 2.0 für Flash MX 2004
(Version 7) beschäftigen. ActionScript 2.0 basiert auf dem Standard
ECMAScript 4. Hier sind viele Ideen der Java-Programmierung entnommen. So umfasst ActionScript 2.0 Elemente der Objektorientierung
3. RECHERCHE
19
(Klassen, Schnittstellen, usw.) wie auch die Möglichkeit, Variablen
typsicher anzulegen. Beides war bisher in ActionScript 1.0 nicht möglich. Insgesamt ermöglicht ActionScript 2.0 ein besseres und effizienteres Arbeiten mit Flash, gerade im Bezug auf teamorientierte Projekte.
ActionScript 2.0 bietet sich für unser Tutorial an, da es sich um die
aktuelle Version handelt und durch starke Verwandschaft mit Java ein
leichteres Einsteigen in die Materie möglich ist.
Zunächst ist es wichtig, die Grundlagen und die wichtigsten Eigenheiten von ActionScript und deren Einbindung in den Flashfilm kennenzulernen. Hier stellten sich mehrere Punkte als unerlässlich für den
Einstieg in ActionScript heraus. Wo und was kann der Flashanwender
programmieren? Wie lautet die Notation? Worauf ist im Allgemeinen zu
achten. Zum Anderen sind Kenntnisse über Variablen und Typen wichtig, wie auch hierachische Verweise und Kapselung. Auch mögliche
Strategien zur Fehlerkorrektur und Hilfen zur Arbeit mit ActionScript
sind unerlässlich. Nur wenn diese bekannt sind, kann mit ActionScript
und Flash gearbeitet werden. Nachdem diese Grundlagen bekannt
sind, ist es wichtig, direkt in die Programmierung einzusteigen. Denn
nur so erkennt man spezielle Eigenheiten und Eigenschaften. Zudem
lernt man eine Programmiersprache am besten durch Übungen. Wenn
diese Übungen dann noch erklärt werden und diese Eigenheiten verAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
standen werden, ist später dann ein eigenständiges Arbeiten mit Flash
möglich.
3.2.5. Animationen anlegen
Nachdem Flash neben der Entwicklung von Applikationen mit einer
starken Abhängigkeit von der Programmierung auch einfache Animationen ermöglicht, sollten diese ebenfalls behandelt werden. Doch auch
hier ist die Frage nach der Herangehensweise. Flash arbeitet grundsätzlich nach der Keyframe-Methode. Das heißt man muss nicht jeden
Verschiebungsschritt, der in einer Animation vorkommen soll einzeln
erzeugen. Vielmehr erzeugt Flash eine Animation zwischen zwei Ex-
3. RECHERCHE
20
trempunkten, die sich in den Keyframes befinden. Um diese Animation
anzulegen, fügt man zwischen diesen Keyframes einen sogenannten
Tween ein. Hiervon gibt es in Flash zwei Arten.
Erstens den Motiontween. Dieser ist grundsätzlich für die Animation
von Objekten wie Movieclips oder Buttons gedacht. Will man eine Form
animieren, zum Beispiel ein gezeichnetes Viereck, erfolgt dies über den
Formtween. Da hier die Tweenings oft seltsame Zwischenformen zwischen den Keyframes annehmen, kann hier mit Formmarken gearbeitet
werden. Diese legen dann für Flash fest, wohin jeder Punkt animiert
wird. Neben der Form, der Position und der Größe können auch der
Alphakanal, der Farbkanal und auch Filter, die auf Objekte anwendbar
sind (seit Flash 8) animiert werden.
Diese kurze Zusammenfassung zeigt, wie wichtig das Kapitel Tweening
beziehungsweise Animation ist. Deshalb wird es in dem Tutorial bereits
in einer der ersten Episoden behandelt, da dies auf jeden Fall zu den
Basics gehört, die für die Arbeit mir Flash notwendig sind.
3.2.6. Programmierung des Spiels
Ein Teil für die Vorbereitung der Tutorials war die Erstellung des
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Jump‘n‘Run Spiels, da es den Kern der Lehrgänge darstellte. Es ging
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
welche Module nacheinander bearbeitet werden und welche Schwer-
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
darum, ein Spiel so einfach wie möglich, aber dennoch so verständlich
wie möglich zu erstellen. Dazu erfolgte erst eine Bestandsaufnahme,
punkte diese haben sollen. Die Module und der dazugehörige Programmierteil wird im folgenden Kapitel umrissen.
3.2.7. Modularisierung der Inhalte
Wie im Kapitel zuvor beschrieben, ging es nun darum, Module für die
Podcasts zu entwickeln, mit dem Ziel, die Vermittlung der Inhalte klar
zu strukturieren.
3. RECHERCHE
21
3. RECHERCHE
22
Darstellung eines Walkcycles:
.http://www.alexmunn.com/images/
walkcycle01.jpg
Erstes Modul
Im ersten Modul wollten wir uns mit dem Einstieg in Flash beschäftigen. Das bedeutet, dass der Betrachter zuerst die Oberfläche von Flash
erklärt bekommt. Zusätzlich werden wir in diesem Modul aufzeigen,
wie eine einfache Animationssequenz mit Hilfe von Tweens, Pfaden
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
und Maskierungsebenen erstellt wird. Insgesamt soll somit dem Be-
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Zweites Modul
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
trachter einen ersten Eindruck von Flash bekommen.
Im zweiten Modul wird zunächst auf Grundlagen der Animation allgemein eingegangen. Dazu stellt sich die Frage wie funktioniert eine
einfache Animation. Dazu lieferten uns Walt Disney aber auch Eadweard Muybridge die Grundlagen der Bild-für-Bild-Animation. Diese
Grundlagen gilt es nun umzusetzen in Illustrator um eine eigene Figur
zu animieren.
Drittes Modul
Das dritte Modul beschäftigt sich mit dem Einstieg in die ActionScript-
Programmierung. Nachdem ein Jump‘n‘Run-Spiel viel Script beinhaltet,
werden wir hier eine eigene Episode dazu verwenden, auf was bei
ActionScript geachtet werden muss. Dazu gehören neben der Notation
auch Variablen, Typen oder die Frage, welche Objekte man programmieren kann.
Viertes Modul
Die im zweiten Modul erstellte Figur wird nun hier im vierten Modul importiert und zu einer lauffähigen und vor allem steuerbaren Animation
erweitert. Dabei wird dem Betrachter die Arbeit mit den verschiedenen
Zeitleisten, das setzen der notwendigen Keyframes und das richtige
Positionieren des Scriptes erklärt.
Fünftes Modul
Die nun importierte Figur soll nun mittels Tastaturkommandos gesteuert werden. Sie soll gehen, rennen und springen können. Zudem werden über Script die jeweiligen Animationssequenzen gesteuert. Den
Betrachtern wird in diesem Modul das Zusammenspiel von klassischer
Animation und Programmierung näher gebracht.
Sechstes Modul
Damit die Figur ein Ziel zum Springen hat wird zunächst eine Plattform
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
angelegt, auf welche die Figur springen kann. Dazu wird die Steuerung
programmiert. Der wesentliche Kern dieses Moduls ist aber die Dynamisierung der Variablen und Instanznamen. Es soll verdeutlicht werden,
welchen Vorteil diese Programmierweise hat, da dies in klassischen
Programmiersprachen nicht möglich ist.
Siebtes Modul
Das siebte Modul befasst sich mit einem Punktesystem. Dabei sollen
von der Figur Objekte aufgefangen werden, die von oben herunterfallen. Ziel in diesem Modul ist es zu zeigen, dass Animation nicht immer
fest gesteuert werden muss. Sie kann ebenso durch zufällige Aufrufe
gestartet werden.
3. RECHERCHE
23
Achtes Modul
Im letzten und achten Modul wird ein Gegner zum Spiel hinzugefügt.
Dieser soll die Figur angreifen und gegebenenfalls beschießen. Dabei
kommt ein großer Teil mathematischer Programmierung ins Spiel, damit der Gegner auch mit einer gewissen künstlichen Intelligenz ausgestattet ist.
Alle Module sind in der Reihenfolge auf einander abgestimmt. Nacheinander betrachtet ergeben sie das gesamte Tutorial, das insgesamt von
Episode zu Episode die Anforderung steigert. Damit wird am Anfang
der intrinsiche Antrieb, sich solch ein Tutorial anzusehen, unterstützt.
Ebenso wird das Tutorial durch die Steigerung mit der Zeit nicht langweilig.
3.2.8. Vorlesungen
Um uns zu sensibilisieren, worauf bei einem Einsteigertutorial geachtet werden muss, bot uns unser betreuender Professor Herr Kruse an,
unsere Tutorials an den Studierenden des dritten Semsters zu testen.
Im dritten Semester findet im Studiengang Digital Media die Vorlesung
Animation 1 statt. Diese beschäftigt sich mit der Erstellung eines Spiels
auf Basis von Flash. Hierfür sollten wir sieben bis acht Vorlesungen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
vorbereiten. Dies hatte für uns den Vorteil, dass wir die Einsteigertutorials über die Vorlesungen evaluieren und gegebenenfalls modifizieren
konnten.
3.2.9. Evaluation
Um fundierte Erkenntnisse aus den Vorlesungen zu ziehen, werden
wir jede der acht Vorlesungen evaluieren und zudem eine Gesamtevaluation durchführen. Die Evaluationen erfolgen über einen standardisierten Fragebogen. Damit können wir die einzelnen Vorlesungen
bewerten, aber auch untereinander vergleichen. Auch Feedback der
Studierenden während der Vorlesungen oder Übungen zu den Vorle-
3. RECHERCHE
24
Den Evaluationsbogen finden sie im Anhang
sungen fließen in das Konzept der Tutorials mit ein. Dies hilft uns, die
Tutorials soweit zu verbessern, dass sie von jedem interessierten Einsteiger nachvollzogen werden können.
3.3. Video-Podcast
3.3.1. Verbreitungsgrad
Der Video-Podcast hat bereits eine große Akzeptanz und Popularität
in der Medienwelt. Dies zeigt sich beispielsweise an der Vielzahl von
Rubriken und Themen, die als Video-Podcast verbreitet werden. Auch
bei www.podcast.de gibt es eine große Anzahl von Podcasts. Aus dieser Menge an Video-Podcasts lässt sich folglich der Schluss ziehen, dass
sich Video-Podcasts einer steigender Beliebtheit bei den Usern erfreut.
3.3.2. Darbietungsform und Größe
Der Video-Podcast besteht aus den zwei Teilen. Das Video muss den
Spezifikationen, wie sie im technischen Datenblatt des iPod beschrieben sind, genügen. Diese sagen aus, dass ein Video-Podcast eine
maximale Größe von 640x480 Pixeln (VGA) haben darf. Besser ist es
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
die Originalgröße von 320x240 Pixeln (QVGA) zu verwenden. Zudem
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
die Bitrate bei einem h.264 Video in der VGA-Auflösung nicht über 1,5
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
dürfen die Videos nur mit einem MPEG4 oder h.264 Codec kodiert sein.
Andere Codecs sind nicht auf dem iPod installiert. Des weiteren darf
MBit/s und bei QVAG nicht über 768 KBit/s sein. Die maximale Bildrate
beträgt 30 Bilder pro Sekunde, was der NTSC-Bildrate entspricht. Der
Audioteil muss AAC-kodiert sein bei 160 KBit/s und 48 kHz. Bei einem
MPEG4 Video sind die Audio-einstellungen ähnlich, aber die maximale
Videodatenrate liegt bei 2,5 MBit/s und damit höher als bei h.264. Wir
haben beide Codecs mit verschiedensten Einstellungen getestet. Dabei
stellte sich heraus, dass der h.264 Codec ein wesentlich besseres Bild
erzeugt und auch eine kleinere Datenmenge liefert. Vor allem Letzte-
3. RECHERCHE
25
res ist im Zusammenhang mit der Downloadgeschwindigkeit aus dem
Internet sehr wichtig.
3.3.3. Bedienbarkeit und Wiedergabemöglichkeiten
Nachdem das File eines Videopodcasts heruntergeladen ist, z.Bsp. mit
iTunes, kann es sofort mit dieser Software abgespielt werden. Auch die
Wiedergabe mit anderen Playern ist problemlos. Die Bedienbarkeit und
Steuerung eines Podcasts ist relativ einfach. Sei es auf dem Computer
oder auf dem iPod, wo fast die gesamte Steuerung über den Kreis in
der Mitte des iPods erfolgt.
3.3.4. Videoformate und Codecs
Wie schon im Kapitel 3.3.2. Darbietungsform und Größe beschrieben,
kann der iPod h.264 und MPEG4 kodierte Videos abspielen. Um aber
ein besseres Bild zu bekommen, welcher der beiden Codecs geeigneter
ist, müssen wir diese zunächst vergleichen. Die drei entscheidenden
Parameter für unser Projekt Video-Podcast sind die Bildqualität, das Datenvolumen und die Bitrate der einzelnen Videos. Das Datenvolumen
wirkt sich auf die Downloadzeiten der Videos, die Bitrate auf die Abspielbarkeit auf dem iPod und gleichzeitig auf die Qualität des Videos
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
aus. Die Bildqualität, als dritter Parameter, beschreibt wie scharf das Bild
ist und wie gut man bestimmte Bildausschnitte erkennen kann. Dies ist
in unserem Fall sehr wichtig, da ein Teil der Tutorials ActionScript-Code
beinhaltet, der eine gute Lesbarkeit vorraussetzt. Testweise haben wir
für beide Kodierungsarten einen kurzen Film gerendert, um diese beiden Werte vergleichen zu können.
Der Film, ein Produktvideo für den iPod nano, wurde zunächst auf
QVGA-Auflösung umgerechnet und mit dem Sorensen Video 3 Codec
kodiert. Er hatte eine Bildrate von 25 Bilder pro Sekunde bei 16,7 Millionen Farben, eine Datenrate von 3415 KBit/sec und eine Gesamtdauer
von 31 Sekunden. Der Audioteil war mit 16 Bit, bei 44,1 kHz und Stereo,
kodiert. Dieses Video war nun das Ausgangsmaterial für den Versuch.
3. RECHERCHE
26
Zunächst das Ergebnis für die Kodierung zu mp4. Hierfür wurde die
Exportauswahl MP4 (ISMA) getroffen. Das Video hatte nach der Komprimierung eine Gesamtgröße von 3,94 Megabyte bei einer Datenrate
von 1050 KBit/sec. Gleich geblieben ist die Anzahl der Farben mit 16,7
Millionen. Hingegen wurde die Audiospur als ACC Stereo mit 44,1 kHz
angelegt.
Im zweiten Teil des Versuches wurde das Ausgangsmaterial zum
m4v-Video umgeschrieben. Dazu wurde die Exporteinstellung Film zu
iPod in Quicktime verwendet. Im Vergleich zum mp4-Video waren die
Anzahl der Farben und der Audioteil gleich. Jedoch war die Dateigröße
bei 2,82 MByte bei einer Datenrate von 766 MBit/sec. Beide Werte lagen
somit deutlich unter denen des mp4-Videos.
Der dritte Parameter, die Bildqualität, wurde anhand der erscheinenden
Kodierungsverluste im Bild bewertet. Das heißt, läuft das Bild flüssig,
sind Artefakte zu erkennen oder ist die Schrift lesbar. Beide Videos
lagen bei dieser Untersuchung fast gleich auf. Das mp4-Video hatte ein
geringfügig schlechteres Bild.
In der Gesamtbetrachtung dieser Untersuchung kann man sagen, dass
das m4v-Video mit dem h.264 Codec als Sieger hervorging. EntscheiAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
te, da bei der Bildqualität fast kein Unterschied zu erkennen war.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
3.3.5. h.264
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
dend hierfür waren die kleinere Dateigröße und die geringere Datenra-
Nachdem wir uns nun auf das m4v-Format mit der h.264-Kodierung
festgelegt hatten, haben wir diesen Codec eingehender betrachtet.
H.264/MPEG-4 AVC ist ein Standard zur Videokompression. Er wurde
von der ITU-Gruppe und MPEG-Visual entwickelt. Ziel der Entwicklung
war es ein Kompressionsverfahren zu entwerfen, das die Datenrate im
Vergleich zu allen bestehenden Standards um die Hälfte reduziert. An-
3. RECHERCHE
27
wendungsgebiete sollten neben mobilen Anwendungen, auch der TVund HD-Bereich sein. h.264 erreicht typischerweise eine etwa dreimal
so hohe Codiereffizienz wie h.262, der auf MPEG-2 basiert und auch für
hoch aufgelöste Bilddaten (z. B. HDTV) ausgelegt ist. Allerdings ist der
Rechenaufwand auch um den Faktor 2 bis 3 höher.
h.264 hat verschiedenste Einsatzgebiete, da er nicht für einen speziellen Verwendungszweck entwickelt wurde. Dazu gehören neben HDTV
und Portable Video (iPod ist ein Vertreter davon) auch Multimediaanwendungen oder Videokonferenztechnik. Basierend auf h.264 sind die
kommerziellen Entwicklungen Sorensen Video 3 und Microsoft Windows Media Video 9.
H.264 baut weitestgehend auf seinen Vorgängern MPEG-1, MPEG-2,
MPEG-4 und der H.26x-Familie auf, weist jedoch zu diesen deutliche
Veränderungen und Erweiterungen auf. So ist die Blockgröße verkleinert und die Transformationen kommen mit einfachsten Rechenoperatoren (Addition, Subtraktion, binäre Verschiebeoperationen) aus. Durch
die geringere Blockgröße wurden die Ringing-Artefakte reduziert Zusätzlich wurde die Entropiekodierung (verlustfrei Kodierungsmethode)
an die veränderte Transformation angepasst.
Makroblöcke von der Größe 16 × 16 Pixel können in Unterblöcke bis
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
hinunter zu einer Größe von 4 × 4 Pixeln unterteilt werden. Jeder Block
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
kodiert. Zudem ist die Bewegungskompensation immer auf ¼ Pixel
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
hat einen eigenen Bewegungsvektor. Dies führt zu einer scharfen
räumlichen Abgrenzung und komplexe Bewegungen werden besser
genau.
Auch innerhalb von I-Frames kommt eine Form der Bildvorhersage zum
Einsatz, wobei eine Vorhersage aus den umliegenden Pixeln abgeschätzt wird. Zudem gibt es eine Long-Term Prediction. So können
P- und B-Frames nicht nur Referenzen auf den jeweils letzten I- oder
P-Frame enthalten, sondern auch zu theoretisch beliebig vielen vorhergehenden. Des weiteren gibt es eine Gewichtungsvorhersage. Werden
3. RECHERCHE
28
Bildinhalte aus mehreren Referenzbildern gemischt, können diese
Quellen beliebig gewichtet werden und Überblendungen effizient
kodiert werden.
Ein Deblocking-Filter ist integraler Bestandteil von H.264. Damit erreicht man eine sehr hohe wahrgenommene Bildqualität. Besonders
im Zusammenwirken mit der verkleinerten Transformationsgröße von
4 × 4 Pixel ergeben sich große Verbesserungen. Die Switching Slices
Methode ermöglicht zudem den nahtlosen Übergang zwischen verschiedenen Videoströmen
Funtionsweise des Podcastings
Server
bindet ein
rss-Feed
ruft ab
Benutzer
verweist
Podcaster
erstellt
Podcast
.m4v, .mp3
lädt hoch
.m4v, .mp3
download
iPod
Computer
3.3.6. RSS-Feed
RSS-Feeds basieren grundsätzlich auf der XML-Technologie: Das beAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
deutet RSS-Feed haben eine Tag-Stuktur und unterliegen somit einer
festen Formatierung. Diese feste Formatierung ermöglicht es, dass RSSFeeds maschinell, das heißt mittels Software, gelesen werden können.
Ein Teil des Video-Podcasts ist solch ein RSS-Feed. Hier werden neben
grundlegenden Daten wie Titel, Downloadlink, Erstellungsdatum und
Beschreibungen auch die Sprache angegeben. Dieser Teil stellt die
grundlegenden Informationen. Daneben gibt es speziell für iTunes
eigene Tags. Diese Tags beinhalten dann Informationen wie „Kategorie“
oder „Keywords“. Diese Keywords werden dann von iTunes gelesen.
Damit wird der Podcast in Rubriken abgelegt und kann über die Suchfunktion gesucht werden.
3. RECHERCHE
29
{QTtext}{font:Geneva}{plain}
Wenn man, wie in unserem Fall mehrere Podcast-Episoden zu einem
{doNotDisplay:on}
zusammengehörigen Podcast zusammenfügen will, ist es nicht nötig
{keyedText:on}
für jeden Podcast einen eigenen RSS-Feed zu schreiben. Die einzelnen
{size:12}{textColor:
65535, 65535, 65535}{backColor: 0, 0, 0}{justify:
Episoden lassen sich als Bestandteile zu einem RSS-Feed zusammenfassen. Dafür gibt es den item-Tag. Pro Episode wird ein solcher Tag ange-
center}{timeScale:1000}
legt, in dem verschachtelt dann, die Informationen zur Podcast-Episode
{width:160}{height:48}
abgelegt werden können.
{timeStamps:absolute}
{language:0}{textEncoding:0}
[00:00:00.000]
3.3.7. Chapters
{textBox: 0, 0, 50, 160}
Wie schon beschrieben sollte das gesamte Tutorial in mehrere Episo-
Kapitel 1
[00:00:23.690]
{textBox: 0, 0, 50, 160}
den aufgeteilt werden. Dies ermöglicht eine sinnvolle Aufteilung der
einzelnen Themenblöcke, die präsentiert werden sollen. Jedoch ist
Kapitel 2
es so, dass die einzelnen Episoden ebenfalls aus einzelnen kleineren
[00:01:14.720]
Themenblöcken bestehen. Diese bilden zwar eine gesamte Episode,
{textBox: 0, 0, 50, 160}
können jedoch auch als Nachschlagewerk einzeln betrachtet werden.
Kapitel 3
Da aber die Suche nach bestimmten Stellen im Video recht aufwändig
[00:02:10.770]
und umständlich ist, entstand die Idee diese Themenblöcke zu markie-
Text der Steuerspur
für ein Quicktime-Movie
(siehe Kapitel 3.3.7)
ren, ähnlich den Kapiteln einer DVD.
Dass es die Möglichkeit gibt, Podcasts mit Kapitelmarken zu versehen,
ist in vielen Foren oder auf der Apple-Homepage zu lesen. Jedoch ist
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
der meist beschriebene Fall, einen Audio-Podcast mit Kapitelmarken zu
versehen. Folglich recherchierten wir in diese Richtung weiter, um herauszufinden ob es vielleicht hier eine Möglichkeit gibt, Kapitelmarken
in ein Video einzufügen. Das Einfügen in Audiofiles funktioniert prinzipiell recht einfach. Man nimmt ein Audiofile und exportiert es in iTunes
als AAC-Datei. Diese Datei wird nun mit einer XML-Datei erweitert,
indem diese in die AAC-Datei eingefügt wird. Die XML-Datei enthält
Daten wie Kapitelstartzeit und Kapitelnamen. Zusätzlich ist es möglich
weitere vordefinierte Tags, Bilder oder URLs an diesen Zeitpunkten
einblenden zu lassen. Darüber hinaus ist es jedoch nicht möglich, eine
Verknüpfung zu einem Video zu erstellen. Das Zusammenfügen erfolgte dann auf dem Mac mit Hilfe der Software ChapterTool und dem
3. RECHERCHE
30
kommandozeilenbasierten Terminal, mit welchen man direkt auf den
UNIX-Kern des Macs zugreifen kann. Das Verbinden von Audio- und
XML-Datei erfolgte problemlos, jedoch funktionierte der Versuch, anstatt eines Audiofiles ein Videofile zu nehmen, nicht.
Weiterhin gab es die Möglichkeit, Kapitel mit der Software ChapterToolMe zu erzeugen. Hier konnte die Audiodatei importiert werden und
über eine Eingabemaske konnten anschließend die Kapitel angelegt
werden. Jedoch gab es auch hier keine Möglichkeit, Videodateien zu
importieren um diese mit Kapitelmarken zu versehen.
Bei einer weiteren Recherche stellte sich heraus, dass es doch eine Möglichkeit gibt Videos mit Kapitelmarken zu versehen. Auf der Seite http://
convergence.journalism.missouri.edu/4804/enhancedpodcast.html
wird das Vorgehen dazu beschrieben. Dazu wird Quicktime verwendet. Zunächst wird der Film in Quicktime geöffnet. Dazu schreibt man
dann eine Text-Datei die einer bestimmten Formatierungsart folgt. Hier
werden die Startzeiten und die Kapitelnamen festgelegt. Dieses Textfile
wird dann ebenfalls in Quicktime geöffnet, um dann anschließend die
gesamte Zeitspur auszuwählen und zu kopieren. Im bereits geöffneten
Film wählt man die gesamte Zeitspur aus und fügt über “Bearbeiten” ->
“Zur Auswahl hinzufügen und skalieren” die Textspur hinzu. Diese ist im
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Film nicht zu sehen. Über “Fenster” -> “Filmeigenschaften einblenden”
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
marken und bietet die Namen der Kapitel zu Auswahl an.
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
kann man nun die Textspur der Videospur als Steuerspur zuweisen.
Quicktime zieht sich nun die Information aus dem Text, setzt die Kapitel-
Jedoch besteht nun das Problem, dass zwar iTunes, nicht aber der iPod
.mov-Dateien abspielen kann (siehe Technische Spezifikationen iPod).
Denn nur in diesen .mov-Dateien können die Informationen zur Kapitelsetzung gespeichert werden. Auch die Versuche dieses Problem
mit anderen Codecs oder Dateiformaten zu umgehen blieb erfolglos.
Auch das explizite hinzufügen einer Steuerspur beim Export des Videos
brachte nicht den gewünschten Erfolg.
3. RECHERCHE
31
Insgesamt kann man abschließend sagen, dass die Idee einen VideoPodcast mit Kapitelmarken auszustatten, dem Ziel ein optimal nutzbares
Tutorial zu erstellen, sehr dienlich ist. Jedoch ist es technisch momentan
nicht möglich, zu einem iPod-Video Kapitelmarken hinzu zu fügen.
3.3.8. Zusammenfassung
All die beschriebenen Kapitel laufen bei der Produktion eines Podcasts
zusammen. Erst wird das Videomaterial geschnitten und für die Kodierung als m4v-Format vorbereitet. Ist dies geschehen, kann dann der
RSS-Feed erzeugt werden und beispielsweise bei iTunes veröffentlicht
werden.
3.4.
AUDIO- / VIDEOPRODUKTION
3.4.1. Produktionsschritte
Nach der Recherche über das Publikationsmedium und die Inhalte
der Tutorials muss nun die Überlegung angestellt werde, wie beide in
einem Produktionsprozess sinnvoll und optimiert verknüpft werden
können. Dazu benötigt man das Wissen welche Schritte nacheinander
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
folgen müssen um eine optimale Erstellung der Inhalte ohne große
zeitliche Verluste zu erhalten. Für jeden Podcast ist es ratsam Drehbücher zu entwickeln, um die Inhalte mit der Aufnahme zu verknüpfen
und eine sinnvolle Produktionsabfolge zu gewährleisten. Diese Drehbücher werden später beim Schnitt hilfreich sein, da sie dokumentieren, welche Schritte nacheinander im Video dargestellt werden. Die
Aufnahme erfolgt mit einer ScreenCapture-Technologie, deren Test und
Resultate wir im Kapitel 3.4.3 Aufnahmeart beschreiben werden. Bei der
Aufnahme muss bereits ein fundiertes Wissen über die Rohdatenformate bekannt sein. Einblendungen wie Kapitelüberschriften, Intros oder
Outros können parallel erstellt werden. Im darauffolgenden Schnitt
werden die einzelnen Elemente dann, auf den Drehbüchern basierend,
3. RECHERCHE
32
Drehbuchentwicklung
Aufnahme
Vereinheitlichung der Rohdaten
verknüpft und wieder in den logischen Zusammenhang gebracht. Nach
dem ersten Export erfolgt die Nachvertonung und deren Nachbearbeitung. Zuletzt werden Audio- und Videokomponenten zusammengefügt und als Podcast exportiert.
Rohschnitt
Einbindung der Einblendungen
Erstexport
3.4.2. Drehbuchentwicklung, Inhalte, Kapitel
Die Drehbücher müssen in einem standardisierten Format sein, um
effizient damit arbeiten zu können. Folglich muss vor dem Erstellen
die Überlegung durchgeführt werden, was festgehalten werden muss.
Audioaufnahme
Audionachbearbeitung
Zusammenführung Video und Audio
Die Drehbücher sollen auf den Episoden und deren Einzelbausteinen
fußen. Diese Bausteine werden den Aufnahmeprozess bestimmen. Sie
geben vor, wie die Einzelschritte der Bausteine abfolgen müssen. So
wird es für jeden Baustein zunächst eine Fullscreenaufnahme geben.
Je nach Einzelbaustein müssen dann die Nahaufnahmen und Gewich-
Export in das Endformat
tungen bestimmt werden, die helfen werden, die Inhalte deutlich zu
machen. Die jeweiligen Zeiten und anderen wichtigen Daten müssen
dann während der Aufnahme dokumentiert werden.
3.4.3. Aufnahmeart (Hardware / Software)
Um die Podcasts erstellen zu können, wurden Aufnahmen des BildAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
schirms, sogenannte Screencaptures benötigt. Um diese Screencaptures aufnehmen zu können, gibt es mehrere Wege. Zum einen kann
das Signal, das aus dem Rechner kommt, abgefangen werden, um es
aufzunehmen. Zum Anderen kann mittels Software das Video direkt
auf dem Rechner aufgezeichnet werden. Wir testeten beide Methoden,
um herauszufinden welche der beiden das beste Ergebnis liefert.
Zunächst probierten wir das Signal mittels einer „Box“ abzufangen.
Dazu hatten wir den TwinPact 100 von canopus. Durch diese Box
wurde das Signal, ausgehend vom Rechner durchgeschleust, bevor es
zum Monitor kam. Die Box lieferte uns dann ein PAL-Signal. Mittels der
Software TwinCommander konnte neben der Einstellung der Größe des
3. RECHERCHE
33
Aufnahmebereiches auch eingestellt werden ob man das aufgezeichnete Signal direkt auf dem Rechner speichern möchte. Davon kamen
wir aber schnell wieder ab, da das Bild qualitativ sehr schlecht war.
Eine weitere Möglichkeit das Signal aufzuzeichnen, war die Aufnahme
auf MiniDV-Band. Dazu konnte an den TwinPact 100 ein MiniDV-Recorder angeschlossen werden. Diese Bandaufnahme war nun besser als
die Aufnahme zuvor mit der Box direkt auf die Festplatte. Um nun die
Aufzeichnung auf dem Rechner betrachten zu können, musste diese
wiederum überspielt werden. Dieses Überspielen funktionierte nur in
Echtzeit und war somit sehr zeitaufwendig. Die Aufnahme, war wie gesagt besser als die Direktaufnahme auf die Festplatte, überzeugte aber
dennoch nicht. Nach dem Schneiden des Videos und exportieren für
den iPod, war das Bild wiederum sehr schlecht. Zum einen waren die
Farben nicht richtig wiedergegeben, zum anderen war das Bild selbst
sehr unscharf und schwammig. Ein Grund hierfür war vermutlich das
mehrfache Umrechnen des Signals. Schon bei der Aufnahme wird das
Bild auf eine andere Größe (PAL) heruntergerechnet, sowie das Pixelverhältnis von quadratisch auf 4:3 verändert. Nach dem Einspielen wurde
das Bild wiederum verkleinert um auf die benötigte Größe von 320 x
240 Pixeln zu kommen. Des weiteren wurde das Pixelverhältnis wieder
von 4:3 zurück auf quadratisch zurückgeführt, um es so für sein MediAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
um iPod oder Computer anzupassen.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
erwünschten Ergebnisse brachte, probierten wir nun den Bildschirm
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Nachdem der Test mit dem Abfangen des Bildschirmsignals nicht die
mittels Software direkt auf die Festplatte aufzuzeichnen. Dazu recherchierten wir zunächst, welche Software dafür geeignet ist. Snapz Pro
X lieferte nach den Angaben auf der Herstellerseite ambrosia.com die
von uns gewünschen Anforderungen. Mit Hilfe dieser Software kann
man problemlos den Bildschirm capturen, ohne einen Verlust, wie oben
beschrieben, zu haben. Nach der Aufzeichnung kann man den Film als
.mov-Datei abspeichern und einen Codec anwenden der es ermöglicht,
die Datenmenge zu reduzieren. Da die Datenmenge im unkomprimier-
3. RECHERCHE
34
ten Zustand, zwei bis drei Gigabyte pro Minute, zu groß und unhandlich für die Weiterverarbeitung ist, mussten wir testen, welcher Codec
geeignet ist, die Datenmenge zu reduzieren ohne aber einen Qualitätsverlust zu verursachen.
Der Codec h.264 konnte deshalb nicht genommen werden, da hier der
Qualitätsverlust bei den Rohdaten zu hoch war, aber auch Snapz Pro X
Probleme hatte, das Video richtig herauszuschreiben. Deswegen nutzten wir den Codec Sorensen Video 3. Er reduzierte die Datenmenge
zwar nicht so stark wie h.264, lieferte aber qualitativ ein wesentlich besseres Ergebnis. Dies ist in diesem Stadium der Produktionskette wichtiger, da es unerlässlich ist, erst im letzten Schritt das endgültige Format
zu erzeugen, um qualitativ auf dem höchsten Level bleiben zu können.
Dreht man schon zu Anfang dieser Kette der Qualität zu weit nach
unten, kann man sie später nicht mehr steigern und das Resultat ist
wesentlich schlechter. Ein weiterer Vorteil, den die Software gegenüber
der PAL-Box hat, ist dass man alles auf einem System erarbeiten kann.
Man muss nicht erst das Signal auf einem MiniDV-Recorder aufzeichnen, um sie dann mittels einem anderen Abspielgerät wieder auf einen
Rechner überspielen zu müssen. Wir sparten uns einige Arbeitsschritte mit der Software, da hier die Aufzeichnung und Speicherung des
Videos auf einem System funktionierte, was uns neben der qualitativen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
höherwertigen Daten auch einen enormen Zeitvorteil verschaffte.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Pact 100 oder mittels der Software Snapz Pro X, stellte es sich nun her-
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Nach dem verschiedenen Testreihen, sei es nun mit der PAL-Box Twinaus, dass wir auf jeden Fall mit der Software arbeiten würden. Sie bietet
im Vergleich mit der anderen Methode unschlagbare Vorteile, wozu
neben der maßgeblichen Qualität auch der Workflow gehörte.
3.4.4. Rohdatenformate
Die aufgenommen Videos müssen in einem einheitlichen Format abgespeichert werden, um keine qualitativen Einbußen in den Filmen zu be-
3. RECHERCHE
35
kommen. Ziel bei der Sicherung der Rohdaten muss es sein, so gut wie
keine Qualitätsverluste zu haben, aber dennoch ressourcenschonende
Datenmengen zu produzieren. Wie schon erwähnt, nutzten wir hierfür
das .mov-Format mit einer Sorensen Video 3 Kodierung. Diese bot sich
auf Grund ihrer Verwandtschaft zum Endformat h.264 an.
3.4.5. Einblendungen und grafische Darstellungen
Mittels Einblendungen lassen sich die einzelnen Themenabschnitte
klar trennen, geben aber auch so einen groben Leitfaden an, welche
Teilschritte nacheinander durchgeführt werden. Die Einblendungen
dienen hauptsächlich der Strukturierung der Inhalte. Die grafischen
Darstellungen dienen dazu, die gezeigten Inhalte besser zu verdeutlichen. Da manche Schnitte sehr abstrakt sind und schwer von Einsteigern nachvollzogen werden können, werden diese mittels Grafiken
unterlegt und steigern somit die Verständlichkeit für den Betrachter der
Podcasts.
Bei der Erstellung beider Elementtypen muss besonders darauf geachtet werden, dass sie für das Medium iPod optimiert werden. Hier
ist besonders auf die Größe des Displays zu achten. Gerade weil das
Display des iPods nur eine Größe von 320 x 240 Pixel vorweist, müssen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
ben und so für den Betrachter erkennbar zu machen.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
3.4.6. Schnitt
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
die Inhalte deutlich erkennbar sein. Durch animierte Inserts besteht die
Möglichkeit, einzelne Teile (z.B. Lektion 6, „Bounding Box“) hervorzuhe-
Schon vor dem Schnitt ist es wichtig zu wissen, für welches Medium, in
unserem Fall der Video-Podcast, gearbeitet wird. Folglich müssen die
Grundeinstellungen, wie z.Bsp. Größe, Halbbilder, oder Pixelverhältnis
im Schnittprogramm daraufhin angepasst werden. Unser Schnitt erfolgt in einer Größe von 640 x 480 Pixel. Dies ist die doppelte Größe des
geplanten Formats. Dafür gibt es zwei Gründe. Zum Einen sollte man
3. RECHERCHE
36
erst im letzten Schritt auf das endgültige Format umrechnen lassen.
Denn jede Umrechnung und Bearbeitung des Materials ist verlustbehaftet. So sollte im gesamten Produktionsprozess darauf geachtet werden, qualitativ über dem Endformat zu bleiben, um so einen möglichst
geringen Verlust bei der Umrechnung in das Ausgabeformat zu haben.
Zum Anderen wurden von uns weitere Ausgabemedien angedacht.
Dazu gehören neben einer DVD auch Streaming Videos über das
Internet. Da eine DVD PAL-Auflösung hat können wir diese nicht mit
Videos mit einer Größe von QVGA-Auflösung ausstatten. Hier wäre der
Qualitätsverlust zu groß. Unsere Schnittauflösung liegt zwar ebenfalls
unterhalb der PAL-Auflösung, ist aber noch im akzeptablen Bereich und
liefert auch weiterhin qualitativ gute Ergebnisse. Die Streaming Videos
haben eine Auflösung von 480 x 360 Pixel und liegen somit zwischen
QVGA und VGA. Somit können diese problemlos und ohne Qualitätseinbußen umgerechnet werden.
Die Streaming Videos haben mit den Video-Podcasts eine weitere
Eigenheit, auf die beim Schnitt und dessen Voreinstellungen geachtet
werden muss. Da beide auf einem Display mit quadratischem Seitenverhältnis ausgegeben werden, erfolgt der Schnitt und die Aufnahme
ebenfalls schon in diesem Seitenverhältnis. Die einmalige Umrechnung
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
in das PAL-Pixelseitenverhältnis von 4:3 ist weiter kein Problem und
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Auch die Ausgabe der Videos ohne Halbbildern resultiert aus den An-
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
ohne großen Qualitätsverlust.
forderungen des Streaming Videos. Diese können bei einer Erstellung
aus Videomaterial mit Halbbildern Verzerrungen oder ein Streifenmuster aufweisen, was die Qualität erheblich stört. Des weiteren hat das
von uns geplante Streaming-Format .flv durch die Codecs Sorensen
Spark Pro oder On2 VP6 Probleme Überblendungen gut darzustellen.
Zwar hat der Video-Podcast-Codec h.264 solche Probleme durch sein
anderes, mehrschichtiges Codierungsverfahren kaum, dennoch steigern auch hier Videos mit harten Schnitten die Qualität.
3. RECHERCHE
37
3.4.7. Export und Einstellungen
Nach dem Schnitt erfolgt der erste Export als Quicktime-Movie. Die
Einstellungen hierfür basieren auf denen des Schnittes. Es wird in einer
VGA-Auflösung ohne Halbbilder exportiert. Auch das quadratische
Pixelverhältnis bleibt erhalten. Da auch hier, wie bei der Aufnahme
unkomprimierte Videos viel zu groß wären, bedienen wir uns auch
weiterhin dem Sorensen Video 3 Codec, um im gesamten Produktionsprozess auf einer einheitlichen Linie zu bleiben.
3.4.8. Audioaufnahme und -bearbeitung
Die Audioaufnahmen erfolgen getrennt von der Videoproduktion. Die
Videos werden also nach dem Export nachvertont. Dies bietet uns große
Vorteile. So kann der Videoschnitt nach inhaltlichen Gesichtspunkten
erfolgen und muss nicht auf den Ton angepasst werden. Dies ist hilfreich, da wir die Videos in mehreren Durchgängen aufnehmen müssen.
So gibt es für jede Einstellung und Größe eine eigene Aufnahme.
Ferner hat die Trennung von Video- und Audioaufnahme den Vorteil,
dass man sich auf beide Teile als Einzelschritte besser konzerntrieren
kann. Der Versuch, etwas am Bildschirm aufzunehmen und parallel
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
gute Erklärungen zu geben, glückt nur selten. So kann für jeden der
beiden Schritte das beste Ergebnis erzielt werden, wenn sie getrennt
voneinander behandelt werden.
3.5.
WEBSITE
3.5.1. Nötige Inhalte
Die Website hat mehrere zwingend erforderliche Bestandteile. Der
wichtigste ist der RSS-Feed, welcher über iTunes ausgelesen wird. So
muss dieser bei iTunes angemeldet werden und auch einem speziellen
Protokoll folgen. Die URL für diesen RSS-Feed muss wie folgt lauten:
3. RECHERCHE
38
itpc://www.downloadseite.de/rss-feed.xml. Über diesen Link können die
Podcasts dann auch über die Website abonniert werden.
Überdies werden auf der Website die Videos im Streamingformat
angeboten. Neben diesem Bereich gibt es dann noch einen Downloadbereich, in dem Unterrichtsmaterialen wie die Flashdateien, Animationen oder Scripte heruntergeladen werden können. Diese drei Bereiche
stellen den Kern der Website dar. Zusätzlich wird es Informationen zu
dieser Abschlussarbeit geben, wie auch ein Kontaktformular und eine
Linkliste für Flashhilfen.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
3. RECHERCHE
39
40
4.1.
ANFORDERUNGEN AN DER ERGEBNIS
Die Anforderungen an das Videotutorial ist mit wenigen Punkten zu
beschreiben. Erstens soll es didaktisch richtig aufbereitet werden. Es ist
im eigentlichen Sinn kein Lernsystem, da ihm die Abfragemöglichkeiten fehlen. Dennoch sollten didaktische Gesichtspunkte, wie etwa die
sinnvolle Aufbereitung des Inhalts oder das eigenmotivierte Lernen
unterstützt werden. Dies gilt besonders für Einsteiger, da hier die Gefahr besteht, dass sie bei zu schwerem Lernstoff oder nicht sachgerechter Aufbereitung die Lust am Lernen verlieren.
Zudem sollte das Videotutorial technisch einwandfrei funktionieren.
Das heißt, die Videos sollten sowohl mit iPod bzw. iTunes, als auch mit
weiteren Medien, wie Streaming Video oder DVD konsumierbar sein.
Im gesamten Produktionsprozess ist ein sehr hoher Qualitätsstandard
für Video und Audio notwendig. Um jedoch auch inhaltlich qualitativ
hochwertige Resultate zu bekommen, ist mehr als ein einfaches Abfilmen des Bildschirms nötig. Es sind mehrere Durchgänge pro Episode
nötig. Zum einen eine Fullscreenaufnahme, aber auch zum anderen
Detailaufnahmen der wichtigen Bereiche, um diese hervorherben und
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
so besser darstellen zu können.
4.2. FLASH-TUTORIAL
Das Flash-Tutorial wird, wie bereits beschrieben, mehrere Anforderungen erfüllen. So wird es grundsätzlich Flash und die Arbeit mit Flash
erklären. Jedoch geht es über die Vorstellung der Programmoberfläche
und einigen grundlegenden ActionScript-Befehle hinaus. Diese beiden Punkte werden in den ersten Podcast abgehandelt, da sie für ein
effizientes Arbeiten mit Flash unerlässlich sind. Um das Interesse bei
den Betrachtern zu wecken oder zu verstärken, ist ein Projekt das über
4. KONZEPT
4. KONZEPT
alle Episoden hinweg entwickelt wird geplant. So kann man, neben den
grundsätzlichen Arbeitsweisen, zusätzlich das Herangehen an Projekte
zeigen. Dies steht nicht zwingend nur in Zusammenhang mit Flash-Projekten. Es ist vielmehr eine Herangehensweise an alle Arten von Projekten. Inhalt des Tutorials wird ein Jump‘n‘Run-Spiel sein, dass in Flash,
auf verschiedene Episoden mit verschiedenen Themenschwerpunkten
verteilt, erstellt wird. Innerhalb dieser Episoden werden diese in weitere
kleinere Projektteile aufgebrochen, die dann in Gestalt von Kapiteln zu
sehen sind.
4.2.1. Spielekonzept
Das Spielekonzept ist kurz beschrieben. In dem Spiel gibt es einen
Akteur, der gehen, rennen und auf verschiedene Plattformen springen
kann. Ziel des Spiels ist es, möglichst viele Punkte zu erreichen. Die
Punkte werden durch aufsammeln von herunterfallenden Gegenständen erzielt. Zusätzlich wird der Akteur gelegentlich von einem Gegner
angegriffen und beschossen, was einen Verlust der bereits gesammelten Punkte zur Folöge hat.
4.2.2. Modularisierung
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Das oben beschriebene Spielekonzept lässt sich sehr gut modularisieren. Diese Aufteilung in Teilprojekte entspricht dann den einzelnen Episoden der gesamten Tutorials. So werden insgesamt 8 Episoden erstellt,
die jeweils ihren eigenen, für sich abgeschlossenen, Themenbereiche
haben.
4.2.3. Inhalte und Ziele der Module
Erstes Modul
Das erste Modul stellt einen allgemeinen Einstieg in Flash dar. Dabei
werden die Programmoberfläche, die Grundlegende Arbeitsweise mit
Flash und der Zusammenhang der einzelnen Fenster und Module in
4. KONZEPT
41
Flash dargestellt. Zur leichteren Verständlichkeit werden alle Punkte in
einem kleinen Projekt zusammengefaßt.
Zweites Modul
Nach der Vorstellung der Grundlagen der Animation bezieht sich diese
Episode auf den ersten praktischen Teil. Zunächst auf Illustrator. Hier
wird eine Bild für Bild Animation erstellt, die dann später in Flash importiert wird. Der Grund für das Zeichnen in einem externen Programm
liegt darin, dass Flash selbst nicht sehr gut dazu geeignet ist.
Drittes Modul
ActionScript 2.0 ist eine sehr umfangreiche Scriptsprache. Vieles lässt
sich in Flash leichter über Script steuern als über Tweenanimationen.
Wie jede andere Programmiersprache hat auch ActionScript diverse
Eigenheiten. Hier seien die Notation, das Anlegen von Variablen, deren
Typen, Verknüpfungsoperatoren oder auch programmierbare Objekte
genannt. Diese Eigenschaften werden im dritten Modul vorgestellt.
Viertes Modul
Im vierten Modul wird die vorher erstellte Figur in Flash importiert.
Hier liegt das Augenmerk zunächst darauf, zu zeigen, welche Aktionen
nötig sind, damit die Figur auch weiterhin editierbar bleibt. Der nächste
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Schritt ist das Anlegen der Steuerung der verschiedenen Animationssequenzen innerhalb der Figur. Dabei geht es um das setzen der ersten
Keyframes und das Schrieben des ersten einfachen Scripts zu Steuerung dieser Sequenzen. Zu diesen Scripts gehören die Programmierung
von Loops, die in der Geh- und Rennsequenz benötigt werden und von
Stop-Befehlen die ihren Einsatz in der Sprungsequenz finden.
Fünftes Modul
In diesem Modul wird eine erste Steuerung der Figur implementiert.
Dazu gehören die Steuerung des Gehens, Rennens und Springens.
Diese setzt sich aus der Verschiebung der Figur und der Steuerung der
Animationssequenzen zusammen. Beides wird über Script gesteuert,
4. KONZEPT
42
das durch das Ereignis eines Tastendrucks gestartet wird. Hierfür wird
eine Funktion angelegt, die ständig kontrolliert, ob eine entsprechende
Taste gedrückt wird.
Sechstes Modul
Dieses Modul stellt eine Erweiterung des vorhergehenden Moduls dar.
Durch die Möglichkeit des Springens gelangt der Akteur auf eine Plattform. Die Eigenschaften der Plattform (x-Wert, y-Wert, Breite) werden
dazu genutzt, abzufragen, ob die Figur im x-Bereich (zwischen x-Wert
und x-Wert + Breite der Plattform) der Ebene ist. Ist dies der Fall, kommt
eine zweite Abfrage zum Tragen, die überprüft, ob die Figur unter oder
über der Plattform ist. Ist sie darüber, kann sie auf der Plattform landen.
Der nächste Schritt beschäftigt sich damit, ob die Figur von der Bühne
geht oder springt. Beide Fälle werden behandelt. All diese Abfragen
beziehen sich auf eine Plattform. Um eine beliebige Anzahl Plattformen
nutzen zu können, wird das Script durch Arrays und dynamische Instanznamen und Variablen erweitert, welche das Script flexibel gegenüber einer nicht definierten Menge von Plattformen macht.
Siebtes Modul
Im diesem Teilabschnitt des Gesamttutorials wir das Punktesystem
implementiert. Dazu wir eine Ausgabe angelegt, welche den akutellen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Punktestand ausgibt. Die Punkte kann man durch Fangen von herun-
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
ist, wird hier mit Zufallszahlen und dynamischen Variablen gearbeitet.
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
terfallenden Gegenständen sammeln. Um dies interessanter zu gestalten, als es durch eine feste Animation oder Programmierung möglich
Es werden zunächst 10 Objekte erzeuget und außerhalb der Bühne positioniert. Wenn nun eine Zufallszahl eine bestimmte Bedingung erfüllt,
wird das Objekt basierend auf der Zufallszahl über die gesamte Bühne
positioniert und fallen gelassen. Um diesen Teil des Spiels interessanter
zu gestalten, werden noch „schlechte Objekte“ erzeugt, welche den
Punktestand bei einer Kollision mit der Spielfigur wieder verringern.
4. KONZEPT
43
Achtes Modul
In letzten Modul des Tutorials wird noch ein Gegner programmiert, der
die Figur ständig verfolgt. Dazu werden die Differenzen der jeweiligen
x- und y-Werte berechnet und zur Berechnung des Verfolgungsweges
des Gegners genutzt. Der Gegner wird mit einer geringen künstlichen
Intelligenz ausgestattet. Zudem wird ständig der Gesamtabstand
beider Akteure über den Satz des Pythagoras berechnet. Basierend auf
diesem Wert startet der Gegner seinen Angriffsmodus oder feuert ein
Geschoss ab. Dieses Geschoss wird dann zur Figur rotiert und durch
die Berechnung des Einheitsvektor mit einer gleichbleibenden Geschwindigkeit verschoben. Dieses Modul beschäftigt sich vor allem mit
mathematischer Programmierung in Flash und soll zeigen, dass anhand
solcher Berechnungen Spiele dynamischer und interessanter gestaltet
werden können.
So bauen alle Module aufeinander auf, können aber auch getrennt von
einander betrachtet werden, um sie als Nachschlagewerk zu nutzen.
Auch die Steigerung des inhaltlichen Niveaus ist mit diesem Aufbau
gewährleistet.
4.2.4. Konzeptweiterentwicklung durch Vorlesungen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Eine Vorlesung im dritten Semester des Studiengangs „Digital Media“
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
gehalten. Darin werden zunächst die Grundlagen von Flash und Ani-
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
lautet Animation 1 und befasst sich mit der Erstellungen eine Spiels auf
Flashbasis. Diese Vorlesung wird von unserem betreuenden Professor
mationen vermittelt, bevor die Studierenden dann ein Spiel erstellen
sollen.
Unsere Tutorials zielen genau auf solche Einsteiger ab. Wir wollen mit
unseren Lehrgängen einen einfachen und sinnvollen Einstieg in die Materie Flash schaffen. So bot sich eine Intergration unserer Tutorials in die
Vorlesung Animation 1 an. Hier konnten wir dann mittels Vorlesungen
unser Konzept testen, evaluieren und verbessern. Innerhalb von acht
4. KONZEPT
44
Vorlesungen nutzten wir direktes Feedback der Studierenden, wie auch
die Ergebnisse der Evaluationen die wir nach jeder Vorlesung durchführten. Dafür nutzten wir einen standardisierten Fragenbogen, (siehe
Anhang) um die Ergebnisse der einzelnen Vorlesungen auch miteinander vergleichen zu können.
4.2.5. Erkenntnisse aus den jeweiligen Vorlesungen
Größtenteils wurden die Tutorials vom Autitorium positiv, als zusätzliche Hilfe zur eigentlich bestehenden Vorlesung von Prof. Kruse, aufgenommen. Jedoch wurde schnell klar, dass mit zunehmendem Anspruch
auch der Erkärungsbedarf bei den Studenten größer wurde. Die Studenten stuften das Tempo über die 8 Lektionen grundsätzlich als zu
schnell ein.
4.2.6. Problembehebungen auf Grund der Vorlesungen
Nachdem, wie in Kapitel 4.2.5. beschrieben, das Tempo von den Studenten als zu schnell eingestuft wurde, reagierten wir in den letzten
Tutorials darauf, indem wir uns in der Einzelbesprechung mit den Studenten mehr Zeit ließen, um indiviuelle Verständnisschwierigkeiten aus
dem Weg zu räumen. Dies war aufgrund der steigenden Komplexität
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
des Unterrichtsstoffs (Interval, Dynamische Variablen etc.) von Nöten.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Nachhinein ausmerzen konnten.
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Gleichzeitig kamen in diesen Gesprächen auch diverse Programmierfehler (in den von uns erstellten Dateien) zum Vorschein, die wir im
4.2.7. Scriptbestandteile
Es werden viele grundsätzliche Bereiche abgedeckt. Ein vertiefendes
Eingehen auf spezielle Fälle ist in einem Tutorial für Einsteiger jedoch
kaum möglich. Dennoch werden die wichtigsten Scriptbestandteile die
ActionScript bietet, vor allem mit dem Ziel ein Spiel zu erstellen, dargestellt und erklärt.
4. KONZEPT
45
Zunächst werden im Tutorial die Notation von ActionScript allgemein
erklärt. Dabei wird dargestellt, wie eine Variable deklariert und initialisiert wird oder wie ein Funktionskopf aufgebaut sein muss. Auch der
Vorteil der Trennung des Scriptes in zwei Bereiche, einem Deklariationsund Intitialisierungsbereich sowie einem Bereich für die Anweisungen,
wird dagestellt.
Bei den Variablen selbst wird gezeigt, dass sie, obwohl sie nicht typsicher sind, so behandelt werden sollten und welche Typen es gibt.
Zudem wird der Unterschied von lokaler und globaler Gültigkeit von
Variablen vermittelt.
Schleifenanweisungen und Bedingungsabfragen kommen ebenso zum
Einsatz. Die zwei Schleifen, die erklärt werden, sind die for und while
Schleife. Mit ihnen soll gezeigt werden, dass der Quellcode kürzer und
wesentlich effizienter geschrieben werden kann und mit ihrer Hilfe
Redundanzen vermieden werden können. Für die Bedingungen kommt
vor allem die if-else-Abfrage zum tragen. Solche Abfragen sind beim
Schreiben eines Quellcodes, der auf verschiedenste Situationen und
Eingaben reagieren können muss, unerlässlich .
Ein weiterer wichtiger Bestandteil sind die Funktionen. Hier wird zuAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
nächst gezeigt wie sie angelegt werden und wie ihnen Werte mittels
Parameter übergeben werden können. Das Auslagern von mehrfachverwendetem Code dient der Effizienzsteigerung des Quellcodes und
dient somit ebenfalls der Redundanzvermeidung und somit der Vereinfachung.
ActionScript bietet wie andere Programmiersprachen auch Arrays. Zunächst soll den Betrachtern der Aufbau der Arrays erklärt werden und
welchen Vorteil sie daraus schöpfen können. So wird dargestellt dass
mittels Arrays der Quellcode ebenfalls gekürzt und vor allem dynamisiert werden kann.
4. KONZEPT
46
Eine weitere Möglichkeit zur Dynamisierung des Quellcodes bieten
dynamische Variablen und Instanznamen. Dies ist eine Eigenheit von
Scriptsprachen, da sie diese Möglichkeit im Vergleich zu Programmiersprachen, wie zum Beispiel Java, bieten. Auch hier soll dem Betrachter
vermittelt werden, wie der Quellcode mittels dieser dynamischen Variablen gekürzt und somit effizienter geschrieben werden kann.
Darüberhinaus werden Intervalle behandelt. Sie bieten einen zeitlich
kontinuierlichen Aufruf von Anweisungen. Dies geschieht losgelöst von
anderen Anweisungen oder der Zeitleiste, die in Flash beständig, aber
nicht immer mit einer konstanten Geschwindigkeit, abläuft. Mit ihrer
Hilfe können Anweisungen somit in einer anderen Geschwindigkeit
berechnet werden, als sie sonst durch Aufrufe in der Zeitleiste möglich
wäre.
Ein Bereich der besonders in der Spieleprogrammierung benötigt wird,
ist die mathematische Programmierung. Durch die Mathematik lassen
sich Rotationen, Verschiebungen und Abstände berechnen, die für die
Steuerung von diversen Spielelementen nötig sind. Dem Betrachter
wird gezeigt, wie Rechnungen in Flash funktionieren und wie für diese
Zwecke das Math-Objekt genutzt werden kann.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Der objektorientierte Ansatz, den die Symbole mit sich bringen wird
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
selt werden und von verschiedenen Punkten der Programmierung
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
ebenfalls erklärt. Symbole, wie MovieClips, entsprechen in gewissen
Maßen diesem Ansatz. In ihnen kann gegebenfalls Quellcode gekapangesprochen werden. Zudem lassen sich diesen Objekten Variablen
zuweisen die ihnen fest zugeschrieben werden können. Dieser Ansatz
soll ebenfalls dem User gezeigt werden.
4. KONZEPT
47
4.3. PODCAST
4.3.1. Erscheinungsbild
Das Erscheinungsbild der Podcasts wird ganz klar vom Inhalt geprägt.
Dieser stellt meist eine Programmoberfläche dar und ist somit nicht
gut gestaltbar. Jedoch haben wir einige Möglichkeiten, das Erscheinungsbild zu beeinflussen. Zum einen werden die Aufnahmen unter
dem Aspekt bester Qualität angefertigt. Denn ein qualitativ hochwertiges Produkt steigert das Erscheinungsbild. Zum anderen können wir
durch Einblendungen, Grafiken sowie Intro- und Outro-Sequenzen das
Erscheinungsbild prägen. Hier soll ein technischer und innovativer Charakter vermittelt werden, der aber auch kreativ und frisch wirkt. Ausgehend von diesem Gestaltungsbild, wird die Erscheinung der anderen
Medien, wie Homepage oder DVD gestaltet.
4.3.2. Bildgröße
Die maximale Bildgröße eines Video-Podcasts liegt bei 320x240 Pixel.
Dies folgt aus der Auflösung des Displays des iPods. Zwar ist es möglich Videos bis zu einer Größe von 640x480 Pixel abzuspielen, was aber
keinen Vorteil bringt, da diese Videos kleiner skaliert werden müssen.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Diese Punkte bringen zwei entscheidende Nachteile mit sich. Erstens
werden die Dateigrößen der einzelnen Episoden größer und benötigen
somit mehr Zeit zum downloaden. Zweitens muss der iPod beim abspielen der größeren Videos diese erst kleiner skalieren, was zur Folge
hat, dass die Bildqualität darunter leidet.
4.3.3. RSS-Struktur
Mit dem RSS-Feed werden die Informationen die zu den Podcasts
gegeben werden maschinell lesbarbar. Das heißt in Programmen, wie
zum Beispiel iTunes, wird nach Interessensgebieten oder Stichworten
gesucht und iTunes liefert die entsprechenden Ergebnisse aus den
RSS-Feeds. Der RSS-Feed ist eine xml-Datei. Das bedeutet, er weist eine
Tag-Struktur auf, da das XML-Format unter anderem auf HTML basiert.
4. KONZEPT
48
http://blogs.law.harvard.edu/tech/rss
>> Spezifikation
Die Informationen die im RSS-Feed angegeben werden, müssen einer
bestimmten Stuktur folgen. Einen Ausschnitt aus unserem RSS-Feed
finden ist im Anhang dieser Dokumentation angefügt. Im folgenden
werden die Tags kurz erläutert:
<channel>
Umschließt den Kopf und die Episoden des Podcasts
<titel>
Gibt den Titel der Podcasts an
<language>
Angabe der Sprache (hier: de)
<copyright>
Angabe zum Copyright
<iTunes:subtitle>
Kurze Erklärung zu den angebotenen Podcast, werden in
iTunes angezeigt
<iTunes:author>
Angabe zu den Autoren
<iTunes:summary>
Zusammenfassung der Inhalte, maximal 400 Zeichen
<description>
Beschreibung der Inhalte, entspricht <iTunes:summary>
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
<iTunes:owner>
Der oder die Besitzer der Podcasts, umschließt die Tags
<itunes:name> in dem die Namen angegeben werden und
<iTunes:email> einer Email-Adresse zur Kontaktaufnahme
<iTunes:image>
URL zum Bild, das in iTunes angezeigt wird
<iTunes:category>
Angabe zu den Kategorien zu denen der Podcast gehört
<item>
Umschließt die Angaben zu den jeweiligen Episoden. Somit
können pro RSS-Feed beliebig viele Episoden angefügt
werden. Die folgenden Angaben beziehen sich auf die einer
Episode.
4. KONZEPT
49
<title>
Der Titel der Episode
<iTunes:author>
Die Autoren der Episode
<iTunes:subtitle>
Eine kurze Erläuterung zur Episode
<itunes:summary>
Die lange Erklärung zur Episode mit wiederum maximal
4000 Zeichen
<enclosure>
Angabe welche Datei mit diesem Podcast verlinkt ist. Dazu
gibt es drei Angaben. Ersten die URL, zweitens die Größe der
Datei in Byte und drittens welcher Art die Datei ist (hier: Video
vom Typ m4v)
<guid>
Ein weiterer Link zur Podcast-Episode in einem Archiv
<pubDate>
Publikationsdatum nach dem RFC 2822 Standard
<iTunes:duration>
Angabe zur Dauer des Podcast in Minuten und Sekunden
<iTunes:keywords>
Die Begriffe die als Suchwörter zum Podcast leiten sollen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
4.4.
VIDEOPRODUKTION
4.4.1. Drehplanentwicklung
Vor den Aufnahmen steht die Entwicklung von Drehplänen. In diesen
Drehplänen haben wir festgelegt, wie die Episoden in Kapitel aufgeteilt
werden. Diese Kapitel wurden dann wiederum in ihre Teilschritte aufgebrochen. Basierend auf diesen Teilschritten konnten wir dann festlegen
welche Aufnahmeeinstellungen nötig sind und auf welche Elemente
4. KONZEPT
50
innerhalb dieser Aufnahmen der Fokus gelegt wird. Zudem konnte
durch die Aufspaltung in die Teilschritte definiert erden, wo eventuelle
Erklärungsgrafiken zu den Inhalten eingefügt werden sollten.
4.4.2. Drehpläne 1 bis 8
Beispiel dieser Drehpläne zu den Podcastepisoden sind hinten im Anhang dieser Dokumentation angefügt.
4.4.3. Aufnahmeschritte und deren Einstellungen
Die Aufnahmen der einzelnen Einstellungsgrößen mussten von einander getrennt erfolgen. Dies war erforderlich, da die Software Snapz Pro
X immer nur eine Aufnahme gleichzeitig machen konnte. Man hätte
auch nur eine Fullscreenaufnahme machen können und diese anschließend auf die gewünschte Größe skalieren. Da aber bei einem solchen
Schritt die Qualität der Rohdaten darunter leiden würde, haben wir uns
entschieden jede Einstellung einzeln aufzunehmen.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Die Aufnahmen erfolgten immer nach dem selben Schema. So wurde
zunächst das gesamte Kapitel im Fullscreenformat aufgenommen. Dieses wurde dann auf eine Größe von 640x480 Pixel kleiner skaliert. Mit
der Fullscreenaufnahme konnten wir aber dann nochmals kontrollieren,
ob die von uns konzipierten Nahaufnahmen dem Ergebnis dienlich
sind, oder ob wir diese nachmals modifizieren müssen. So wurden
dann nach der Fullscreenaufnahme die Aufzeichnungen der einzelnen
Ausschnitte angefertigt.
4.4.4. Darstellung der Inhalte
Die Darstellung der Inhalte muss zwei Prinzipien folgen. Erstens einer
hohen Bildqualität und zweitens einer guten Darstellung der Inhalte an
4. KONZEPT
51
sich. Die Bildqualität können wir mit den Aufnahmeschritten und deren
Einstellungen beeinflussen. Jedoch für die optimale Darstellung der
Inhalte muss zudem das Aussehen von Flash angepasst werden. Dazu
zählt zum Beipsiel im Kapitel, in dem explizit auf die Keyframes eingegengen wird. Eine weitere wichtige Einstellung ist die Erhöhung der
Schriftgröße im Actions-Fenster. Dies ist nötig, da selbst in der QVGAAuflösung das Script noch lesbar sein sollte.
4.4.5. Schnitt
Resultierend auf den Erkenntnissen der Recherche und den von uns
angepeilten Ausgabemedien, wurden die Vorgaben für den Schnitt
gegeben. Diese Vorgaben sind neben der Auflösung im Schnitt, den
verwendeten Codecs auch Einstellungen bezüglich des Pixelverhältnisses und die Art der Schnitte an sich.
Die Auflösung beim Schnitt liegt bei 640 x 480 Pixel und somit bei einer
VGA-Auflösung. Damit ist gewährleistet, dass bei allen drei Ausgabemedien Videopodcast, Streaming Video und DVD die Bildqualität ausreichend ist. Bei der DVD ist zwar eine Aufwärts-Skalierung nötig, die aber
so gering ist, dass der Qualitätsverlust annehmbar ist. Zudem ist die
DVD nur als ein zusätzliches Offlinemedium angedacht.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Bei der Verwendung der Codecs bleiben wir im gesamten Produktionsprozess auf einer Linie. Die aufgenommenen Videos werden mit Sorensen Video 3 kodiert. Diese Kodierung werden wir auch für den Schnitt
und den Export nach dem Schnitt beibehalten. Sorensen Video 3 bietet
uns zwei entscheidende Vorteile. So bleiben zum einen die Dateigrößen in einem Bereich der noch gut zu handhaben ist. Zum anderen ist
dieser Codec in seiner Art verwandt zum h.264-Codec, dem Codec der
Videopodcasts. So entstehen durch die Umrechnung geringe Qualitätsverluste.
4. KONZEPT
52
Das Pixelverhältnis bei der Aufnahme und im Schnitt ist quadratisch.
Denn beide Hauptausgabemedien Video-Podcast und Streaming Video
werden auf Computerdisplays abgespielt und hier ist des Verhältnis
immer quadratisch. Die DVD folgt als einziges geplantes Medium dem
PAL-Standard und hat somit ein Verhältnis von 4:3. Doch eine einmalige
Umrechnung birgt auch hier kaum Verluste.
Der Schnitt an sich ist besonders an das Streaming Video angepasst.
Bei dieser Art von Videos ist es besonders wichtig auf harte Schnitte zu
achten und so wenig Überblendungen wie möglich zu verwenden. Beide Codecs die im .flv-Format (Sorensen Spark Pro, On2 VP6) verwendet
werden, haben Probleme Überblendungen ohne Qualitätseinbußen
darzustellen. Diese Maßnahme steigert in geringerem Maße auch die
Kodierungsqualität des Video-Podcasts. Zwar arbeitet der h.264-Codec
wesentlich besser bei Überblendungen, dennoch sind diese immer ein
Problem bei der Kodierung. Für die Bildqualität der DVD hat dies so gut
wie keine Auswirkungen.
4.4.6. Export
Der Export aus dem Schnittprogramm Final Cut erfolgt mit den Einstellungen die auch schon bisher genutzt wurden. So bleibt die Auflösung
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
zunächst bei 640 x 480 Pixel. Auch der Codec bleibt bei Sorensen Video
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
umgeschrieben. Dazu gehören beim Video-Podcast das m4v-Format
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
3 und auch das Pixelverhältnis bleibt erhalten. Wenn dann die Nachvertonung abgeschlossen ist, werden die Videos auf ihre Endformate
mit dem h.264 Codec. Das Streaming Video wird in das flv-Format
umgeschrieben mit dem On2 VP6-Codec. Zu guter Letzt werden die
Videos auf DV-PAL exportiert, dem für DVD erforderlichen Format.
4.4.7. Filmgeschwindigkeit
Der Unterschied zwischen erzählter Zeit und Erzählzeit wird bei uns
sehr gering sein. So werden die dargestellten Inhalte fast in Echtzeit
4. KONZEPT
53
wiedergegeben. Dies senkt die Geschwindigkeit des Films und steigert somit die Verständlichkeit der Tutorials. Zudem wird auf schnelle
Schnitte verzichtet, da diese die gefühlte Filmgeschwindigkeit erhöhen
würden.
4.5. WEBSITE
4.5.1. Struktur
Bei der Strukturierung des Inhaltes wurde Wert auf Übersichtlichkeit
und Nachvollziehbarkeit gelegt. Dem Nutzer soll eine intuitiv bedienbare Seite zur Verfügung stehen. Aus diesem Grund haben wir eine flache
Struktur bei der Erstellung der Informationsarchitektur gewählt. Auf
der ersten Ebene (Startseite) werden dem Nutzer alle Bereiche der Seite
als Link zur Verfügung gestellt. Dadurch lässt sich auf der Startseite der
Inhalt logisch und übersichtlich strukturieren und es wird vermieden,
dass der Benutzer von zu viel Auswahlmöglichkeiten verwirrt wird.
4.5.2
Navigation
Die Navigation funktioniert in erster Linie über die Navigationsleiste,
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
die sich im unteren Bereich befindet. Diese Navigationsleiste ist auch in
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Menu besteht aus den Punkten „VodCasts“, „Downloads“, „Links“, „Kon-
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
allen Unterseiten gleich positioniert und somit immer leicht zu finden.
Sie bildet damit den globalen Baustein in der Benutzerführung. Das
takt“ und „Impressum“. Über den Menüpunkt VodCasts gelangt man
auf die Startseite. Auf der Startseite hat man neben der Navigationsleiste auch die Möglichkeit über die einzeln angeordneten kleinen iPodButtons (siehe auch „4.5.5. Bildsprache und grafische Elemente“) zu den
Lektionen zu gelangen. Zusätzlich befindet sich im Footer-Bereich noch
ein dezenter Button zum iTunes Abonnement.
4. KONZEPT
54
Der Font „DIN“
in diversen Schriftschnitten verwendet:
4.5.3
Typografie
Für das Logo und die Head- und Subheadlines haben wir uns für den
Font „DIN“ in den Schriftschnitten Regular, Medium und Bold entschieden. Die Schrift verfolgt eine klare Struktur und ist auf dem Bildschirm
sehr gut zu lesen. Im Copytext haben wir uns für die Serifenlose Schrift
„Verdana“ entschieden, die auf dem Monitor gut lesbar ist und eine
kühle Anmutung besitzt, was sich gut in das Layout integriert.
4.5.4
Farbdesign
Auf der Website überwiegen Grautöne, die, mit einem kräftigen blau
kontrastiert, einen kühlen und sehr technischen Eindruck hinterlassen.
Dieser kühle „Touch“ wurde bewußt gewählt, da sich die Inhalte, die
Die Schrift „Verdana“ – als Copytext verwendet –
auf der Seite vermittelt werden, größtenteils um die Materie des Programmierens drehen. Durch die starke Kontrastierung des in Grautönen gehaltenen Hintergrunds und der typografischen und bildlichen
Gestaltungselemente, die entweder weiß oder blau sind, wird eine gute
Lesbarkeit garantiert.
4.5.5
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Bildsprache und grafische Elemente
Zentrales Element unserer Arbeit ist das Thema PodCast. Deshalb war
es naheliegend eine stark reduzierte Grafik eines iPods in das Layout
einzubauen. Dieser fungiert auch als Key-Visual auf der Startseite, so
dass der User visuell an die Materie Podcasting herangeführt wird.
In den Hintergrund wurde – farblich dezent aber durch seine Größe
dominant – das Signet der Hochschule Ulm gelegt, um einen Bezug
zu dieser herzustellen. Dieses Signet gibt der Site, mit dem Farbverlauf
kombiniert, eine gewisse Tiefe und erhöht die Attraktivität der Site.
4. KONZEPT
55
56
60 px
110 px
840 px
4. KONZEPT
4.5.6. Layoutraster
60 px
Header -für Logos- (1)
10 px
380 px
Contentbereich (2)
768 px
15 px
60 px
125 px
Main-Navigation (3)
Footer (4)
68 px
960 px
1–
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
2–
1
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
2
3
4
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
3–
4–
57
5. REALISIERUNG
4. KONZEPT
4.5.7. Sitemap
��������
����
��������
��������������
���
���������
�����
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
�������
Studiengang Digital Media
�����������
��������������
�����������
��������
��������
���������
�������������
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
�����
�������������
���
������
����������
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
��������
���������
�������
�������
������������
�������
�������������
����������������������
�
��������
�����������
���������
�������
�����������������
�������
4.6. DVD
4.6.1. Zusätzliches Offlinemedium
Mit der Erstellung einer DVD haben wir ein zusätzliches Offline-Medium produziert, mit dem die Lehrgänge auch ohne Internetanschluss
angesehen werden können. Zwar ist eine DVD in der Abschlussarbeit
nur ein zusätzliches Medium geplant, dennoch erfordert es ein eigenes
Konzept. Damit wird gewährleistet, dass es zum Gesamterscheinungsbild passt, die Bedienbarkeit des Menüs einfach und intuitiv ist und die
Videos ohne zusätzliche Qualitätseinbußen gezeigt werden.
4.6.2. Layout
Das Layout der DVD passt sich an das Gesamterscheinungsbild an.
Dieses besteht aus den Elementen des Webdesigns und dem Layout der
Videos. Damit ist garantiert, dass die Zusammengehörigkeit von DVD,
Videos und Website auch visuell sofort deutlich wird und ein Wiedererkennungswert vorhanden ist.
4.6.3. Menüführung
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Die Menüführung der DVD ist an der Anzahl der Video-Podcasts und
deren logischen Reihenfolge angepasst. So erscheint im Hauptmenü
nach dem Intro eine Liste von Auswahlmöglichkeiten. Hier kann der
Betrachter auswählen, welche Folge er ansehen möchte. Durch die visuelle Strukturierung wird die logische Abfolge der Tutorials zusätzlich
verdeutlicht.
Angedacht ist ebenfalls eine zusätzliche Kapitelauswahl auf der DVD.
Hier kann der Betrachter dann direkt zu den einzelnen Kapiteln innerhalb der Videos springen. Die einzelnen Videos werden nicht alle
hintereinander angespielt. Nach Beendigung der acht Videos wird der
Betrachter zurück ins Hauptmenü geleitet, wo er dann seine weiteren
Schritte auswählen kann.
4. KONZEPT
58
4.6.4. Authoring
Das Authoring selbst wird in DVD Studio Pro 4 erfolgen. Diese Software
ermöglicht uns eine einfache Erstellung der notwendigen Datenstruktur. In der Software können Menüs und Filmcontainer angelegt werden.
Vom Hauptmenü aus kann der Betrachter der DVD dann alle Tutorials
einzeln ansteuern. Pro Episode des Tutorials wird es einen Filmcontainer geben. Das Anlegen des Menüs im selbst definierten Gestaltungsstil ist kein Problem. So können die Menüs in Photoshop angelegt
werden. Hier kann für jeden Buttons drei Ebenen angelegt werden.
Eine Ebene beinhaltet das Aussehen des Buttons im Normalzustand, die
nächste für den ausgewählten und die dritte für aktivierten Zustand.
Diese Datei wird nun mit allen Ebenen im Photoshopformat .psd abgespeichert und in DVD Studio Pro importiert. In DVD Studio erkennt die
Ebenen der Datei. Nun muss noch festgelegt werden, wie die Reihenfolge der Navigation im Menü ist und welche Ebene des Photoshopbildes dazu eingeblendet werden soll.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
4. KONZEPT
59
60
5.1.
VIDEOPRODUKTION
5.1.1.
Drehbücher
Der erste Schritt in der Realisierung der Podcasts war die Erstellung der
Drehbücher für jede einzelne Episode. In diese Drehbücher flossen die
Ergebnisse aus der Recherche zusammen und umfassten neben den
Episoden und deren Kapiteln auch Angaben zu den Einstellungsgrößen
und dem Fokus der jeweiligen Aufnahme. So wurde für jedes Kapitel
festgehalten, welche Schritte dagestellt werden und in welcher Reihenfolge die einzelnen Schritte aufeinander abfolgen.
In die Drehpläne sind auch die Ergebnisse und Anforderungen, die
wir durch die Evaluationen der Vorlesungen erhalten haben, mit
eingeflossen. Basierend auf den einzelnen Schritten haben wir dann
die Einstellungen festgelegt. Dabei kommt zunächst immer erst eine
Fullscreenaufnahme des gesamten Kapitels, gefolgt von den Nahaufnahmen, die wir benötigen, um Sachverhalte und Arbeitsweisen besser
darstellen und erklären zu können.
Zur besseren Orientierung wurde zu Beginn eine Fullscreenaufnahme
aufgezeichnet, die, um im filmischen Jargon zu sprechen, einem „EstaAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
blishing Shot“ entspricht. So bot uns diese Aufnahme die Grundlage für
die Abläufe im Kapitel. Wie schon beschrieben mussten wir die einzelnen Aufnahmen nacheinander anfertigen. In jeder Aufnahme werden
die Inhalte immer etwas verändert aussehen. So kann der Abspielkopf
in der Zeitleiste an einer anderen Position oder der Quellcode und eine
paar Zeilen weiter gescrollt sein. Diese Punkte fallen dem Betrachter
nicht zwingend auf, können aber dennoch vom Inhalt ablenken, da
sie einen Bruch in der filmischen Kontinuität darstellen. So bot uns die
Fullscreenaufnahme neben den Drehbüchern die wichtigste Orientierungshilfe bei der Erstellung der Nahaufnahmen.
5. REALISIERUNG
5. REALISIERUNG
5.1.2. Aufnahme und Aufnahmeschritte
Wie im vorigen Kapitel schon erwähnt, gab es für die Aufnahmen und
deren Schritte klare Vorgaben. Diese basierten vor allem auf den Drehplänen, die wir vorher erstellt hatten. Zunächst setzen wir uns mit den
Vorgabe aus dem Drehplan auseinander und testeten die Aufnahme in
einem Übungsdurchlauf. Dabei achteten wir darauf, uns die einzelnen
Schritte einzuprägen und mögliche Stolpersteine in der Aufnahme
später herauszufinden und zu eleminieren.
Nach dieser Trockenübung wurde die Flashdatei wieder auf den Ausgangspunkt zurückgesetzt. Nun konnte mit der Aufnahme begonnen
werden. Dabei achteten wir auf ein sauberes Arbeiten unter Vermeidung der vorher erwähnten Stolpersteine.
Nach der Aufnahme wurde das Video von Snapz Pro X geschrieben,
was je nach Auflösung und Dauer der Aufnahme bis zu zwei Stunden
dauerte. Dabei erzeugte die Software die Videos und komprimierte sie
gleich mit dem Sorensen Video 3 Codec. Danach erfolgte eine Kontrolle
der Aufnahme. Dabei achteten wir besonders darauf, ob das Dargestellte gut erkennen ist. Manche Videos wiesen Fehler auf oder hatten eine
zu schlechte Bildqualität, was dazu führte, dass die Aufnahme gelöscht
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
und die gesamte Prozedur von vor gestartet wurde.
War die Aufnahme aber zufriedenstellend, wurde sie zusätzlich gesichert und gegebenenfalls auf die Schnittgröße von 640 x 480 Pixel
umgeschrieben. Anschließend wurden die anderen Kapitelteile der
Episode aufgenommen.
5.1.3. Einstellungsgrößen
Für die Aufnahmen gab es mehrere geplante Einstellungsgrößen. Sie
waren alle ein vielfaches der Endgröße von 320 x 240 Pixel (QVGA). So
kamen wir auf insgesamt auf 4 Einstellungen, von denen wir aber letztendlich nur zwei (640 x 480 und 960 x 720 Pixel) nutzten. Die beiden
anderen waren nicht geeignet für die Aufnahmen.
5. REALISIERUNG
61
So konnte bei 1280 x 960 Pixel (4x QVGA) zwar eine große Fläche dargestellt werden, aber die Bestandteile waren kaum mehr zu erkennen.
So war diese Größe selbst für eine Fullscreenaufnahme ungeeignet. Bei
der Auflösung von 320 x 240 (1x QVGA) hingegen konnte man das Dargestellte sehr gut erkennen. Jedoch war der darstellbare Ausschnitt viel
zu klein, was zu vielen Schnitten und daraus resultierend zu Verwirrung
beim Betrachte führen würde. Zudem hätten wir das Video für den
Schnitt vergrößern müssen, was Verluste in der Bildqualität zur Folge
gehabt hätte.
So nutzten wir die Größe von 960 x 640 (3x QVGA) Pixel für die
Fullscreenaufnahmen. Hier konnten wir noch die gesamte Programmoberfläche zeigen und zusätzlich blieben die Elemente erkennbar.
Zwar wirkte die Oberfläche nun etwas gedrängt, was aber weiter nicht
schlimm war, da wir unser erstes Ziel, eine gute Bildergebnis zu erzielen, damit erfüllen konnten.
Für die Nahaufnahmen nutzten wir die Auflösung von 640 x 480 Pixel
(2x QVGA). Hier konnte man das Dargestellte sehr gut erkennen, ohne
einen zu kleinen Bildschirmausschnitt zu sehen. Diese Einstellungsgröße war also, wie die zur Fullscreenaufnahme genutzte, ein Kompromiss.
Sie lieferte uns das beste Ergebnis für unsere Anforderungen.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Ausser den Fullscreenaufnahmen hätten wir zwar noch andere Einstellungsgrößen außer diesen Vielfachen von QVGA nutzen können, doch
hier hätte die Umrechnung in die Grundgrößen (VGA und QVGA) einen
höheren Qualitätsverlust bewirkt.
5.1.4. Einblendungen
Für die Videos haben wir mehrere Arten von Einblendungen erstellt.
Dazu zählen neben den Intros und Outros für die Videos auch Grafiken
für Erklärungen und Visualisierungen, Kapiteltitel und Aufbereitung
von Folien zur allgemeinen Erklärungen der Software Flash.
5. REALISIERUNG
62
Intros, Outros und Kapiteltitel dienen hauptsächlich der Orientierung
des Betrachters. Durch sie kann er erkennen welcher Teil als nächstes
kommt und was darin behandelt wird. Die Outros geben noch allgemeine Informationen zur Abschlussarbeit und sind bei allen Episoden
gleich.
Die Grafiken dienen dazu bestimmte Sachverhalte, die durch eine reine
Audio- oder Videodarstellung zu abstrakt sind, besser zu erklären und
zu visualisieren. Als Beispiele hierfür sind die Erklärung der Rechnung
für den Sprung oder die Darstellung der Nutzung der Zufallszahlen zu
nennen.
Während den Vorlesungen haben wir zum Teil Folien genutzt um
grundsätzliche Dinge über Flash zu erklären. Dabei ging es zum Beispiel um die Einführung in ActionScript oder in die Grundlagen der
Animation. Um diese Inhalte auf einem Bildschirm der Größe 320 x 240
Pixel noch gut zu erkennen, müssen sie speziell Aufbereitet werden.
Dazu gehört es Bestandteile, die gerade behandelt werden, heranzuzoomen, oder durch eine optimale Farb- und Kontrastanpassung eine
Steigerung der Lesbarkeit herbeizuführen.
Allen Einblendungen ist gemeinsam, dass sie dem GesamterscheiAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
nungsbild folgen. Sie bilden somit eine visuelle Einheit der einzelnen
Videos, aber auch der Episoden untereinander.
5.1.5. Schnitt
Der Schnitt folgte den klaren Vorgaben aus der Konzeption. So wurde
darauf geachtet, dass die Schnittgeschwindigkeit nicht zu hoch war, nur
harte Schnitte verwendet wurden und es keine Brüche in der filmischen
Kontinuität durch den Schnitt gab.
Schnitte erfolgen nur zwischen verschiedenen Einstellungsgrößen
oder bei der Einarbeitung von Grafiken oder Visualisierungen. Bei
5. REALISIERUNG
63
diesen Schnitten gab es nur harte Schnitte, die nicht zu schnell auf
einander folgten. Dabei steht ganz klar der Aspekt der Verständlichkeit und Nachvollziehbarkeit durch den Nutzer im Vordergrund. Durch
zu schnelle oder unlogische Schnitte wird der Betrachter verwirrt und
muss mehr darauf achten wo gerade etwas im Film passiert, als auf den
wichtigeren Inhalt der Videos.
Diese Verwirrungen können auch durch Unstimmigkeiten im Video
entstehen. Verschiebt sich zum Beispiel im Actions-Fenster das Script
während des Schnitts, muss sich der Betrachter neu orientieren und
verliert gegebenenfalls den Faden.
5.1.6. Nachvertonung
Auch die Nachvertonung folgte dem Ablauf der durch die Konzeption
vorgegeben war. Den Audioteil, der nach der Videoproduktion aufgenommen wurde, hatten wir immer gemeinsam aufgenommen. Das
heißt wir haben die Videos abspielen lassen und haben abwechselnd
dazu das dargestellte erklärt. Durch diesen Wechsel der Stimmen
können wir die Aufmerksamkeit des Betrachters besser erhalten. Denn
spricht immer nur eine Person, kann dies mit der Zeit ermüdend wirken, da sich eine gewisse Monotonie breit macht.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
5.1.7.
Audiobearbeitung
Die aufgenommenen Audiotracks haben wir anschließend nachbearbeitet. Zunächst haben wir Störgeräusche, wie zum Beispiel ein
Knacken, entfernt. Anschließend wurde das leichte Rauschen das mit
aufgenommen wurde eliminiert. So wurde die Sprache klarer und
besser verständlich. Als letzter Schritt der Nachbearbeitung kam der
De-Esser Filter zum Einsatz. Dieser mildert die scharfen Zischlaute ab,
die besonders beim Anhören mit Kopfhörern sehr störend sein können.
5. REALISIERUNG
64
Um dem Aufgenommenennoch eine gewisse athmosphärische Wirkung einzuhauchen wird im letzten Schritt noch ein dezenter Hall auf
die Audiospur gelegt.
5.1.8. Komposition von Audio und Video
Die Komposition beider Teile erfolgte dann nochmals in Final Cut. Hier
konnten wir dann letzte Anpassungen vornehmen und den Ton nochmals verschieben oder in der Lautstärke anpassen.
Auch die Einblendungen wie Intro, Outro oder Kapiteltitel wurden auditiv unterlegt. Dazu haben wir kurze Jingles in GarageBand erstellt und
den Einblendungen hinzugefügt. Damit wird das Gesamterscheinungsbild und die Zusammengehörigkeit der Episoden und Kapitel zusätzlich
verstärkt.
5.1.9.
Export und Einstellungen
Beim Export der Videos aus Final Cut, legten wir besonders darauf
Wert, dass die Qualität der Videos, auf die wir im gesamten Produktionsprozess geachtet haben, nicht verloren ging. Das bedeutet, die
Export hatte die selben Einstellungen wie alles im bisherigen ProduktiAlexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
onsprozess. So ließen wir die Auflösung bei 640 x 480 Pixel und kodierten das Video mit Sorensen Video 3. Das quadratische Pixelverhältnis
blieb ebenfalls erhalten. Bei den Audio-Einstellungen nutzten wir den
CD-Standard. So wurde der Audioteil bei 44,1 kHz und 16 Bit herausgerechnet. Damit konnten wir sicher sein, dass keiner der Audiostandards
unserer geplanten Medien unterschritten wurde.
5.1.10.
Konvertierung
Das erstellte Video konnten wir nun nutzen um unsere Medien mit den
erforderlichen Videos auszustatten. Jedes Medium hatte ihre eigenen
Einstellungen und Codecs.
5. REALISIERUNG
65
Das erste Videoformat das wir erstellten, war jenes für den Podcast.
Hierfür nutzten wir die Einstellungen in Quicktime und erzeugten so
ein .m4v-Video, das mit dem h.264 Codec geschrieben wurde. Der Audioteil blieb mit seinen Grundeinstellungen erhalten und wurde Stereo
im ACC-Format kodiert. Die Framerate lag bei 25 Bildern pro Sekunde.
Dies unterscheitet zwar die im Video-Podcast möglichen 30 Bilder pro
Sekunde, ist aber dennoch völlig ausreichend und am den PAL-Standard angelehnt.
Als nächstes erstellten wir die Streaming Videos. Dazu nutzen wir Flash
Video vom Typ .flv. Für die Kodierung nutzten wir den bei Flash 8 Professional mitgelieferten Videoencoder. Ursprünglich wollten wir für die
Erstellung die Testversion der Squeeze Compression Suite von Sorensen Media verwenden. Diese erzeugte ein besseres Bild als der mitgelieferte Video-Encoder. Jedoch hatten die erstellten Videos ein großes
Wasserzeichen und sind somit für uns unbrauchbar.
Als Codec für die Streaming Videos nutzten wir den On2 VP6 bei einer
Bildrate von 25 Bildern pro Sekunde und einer Datenrate von 400
Kilobits pro Sekunde. Diese Bitrate war ein Mittelweg zwischen guter
Bildqualität und Streamingfähigkeit der Videos. Auch skalierten wir die
Videos auf eine Größe von 480 x 360 Pixeln, was der Mitte zwischen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
QVGA und VGA entsprach. Denn die Streaming Videos sollten auf jeden
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
kodiert bei einer Datenrate von 96 kBits/sec.
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Fall größer sein als die Podcast, jedoch nicht übermäßig groß werden,
um sie noch gut streamen zu können. Der Audioteil wurde als mp3
Als letztes erstellen wir die für die DVD erforderlichen Videos. Dazu
schrieben wir die Videos auf den PAL-Standard um. Hierfür nutzten wir
wiederum Quicktime und die dort wählbare Exporteinstellung DV-PAL.
So konnten wir uns sicher sein, dass Videos entstehen die eine Bildrate
von 25 Bildern pro Sekunde hatten und der PAL-Auflösung von 720 ×
576 Pixeln ensprachen
5. REALISIERUNG
66
5.1.11. Kapitelmarken
Wie im Kapitel 3.3.8. Chapters beschrieben, ist es nicht möglich in
Video-Podcasts Kapitelmarken zu setzen. Jedoch ist es uns möglich
diese in den anderen beiden Medien zu verwenden. So können wir in
Flash Kapitelmarken programmieren oder den Streaming Videos direkt
als sogenannte CuePoints mit geben. Das ansprechen der CuePoints ist
aber recht kompliziert und funktioniert nicht immer richtig, weshalb
wir die Daten im Script in Feldern abgelegt haben um sie von dort
aufrufen zu können.
Das Setzen von Kapitelmarken bei einer DVD ist einfach und mit der
Software DVD Studio Pro kein Problem. Diese können dann über die
angelegte Kapitelauswahl direkt angesprochen werden.
Bleibt das Problem mit den Kapitelmarken bei den Video-Podcasts. Eine
Möglichkeit wäre es gewesen aus jedem Kapitel eine eigene Episode zu
machen, was aber den inhaltlichen Zusammenhang der Episoden zerstört hätte und auch die Handhabung durch den User wäre durch die
große Anzahl von Videos schlechter. So geben wir die Informationen
über die Website und den RSS-Feed weiter. So können sich die Betrachter über die Startpunkte der einzelnen Kapitel informieren.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
5.2. PODCAST ERSTELLEN
5.2.1. Downloadsite erstellen
Grundsätzlich ist es nicht notwendig, für einen Podcast eine Websiteanzubieten. Es ist nur nötig den RSS-Feed und die dazugehörigen
Dateinen auf einen Webserver zu laden. Dennoch ist es von Vorteil
eine Website zusätzlich anzubieten, besonders in unserem Fall. Neben
den zusätzlichen Informationen und einem Downloadbereich für die
angebotenen Zusatzmaterialen kann hier ein Abonnementlink gesetzt
werden. Dieser ruft dann automatisch iTunes auf und lädt die angebotenen Dateien herunter.
5. REALISIERUNG
67
5.2.2. RSS erstellen
Der wichtigste Teil bei einem Video-Podcast ist neben den eigentlichen
Videos der RSS-Feed. Er muss bestimmten Formatierungen und Tags
folgen. Die wichtigsten dazu sind bereits im Kapitel 3.3.6. RSS-Feed
beschrieben. Für die Erstellung des RSS-Feeds gibt es spezielle Software. Um jedoch nachvollziehen zu können, was genau im Feed steht und
wie er formatiert ist, haben wir unseren Feed selbst geschrieben. Einen
Auszug aus unserem RSS-Feed ist im Anhang dieser Dokumentation zu
finden.
5.2.3. Verknüpfung von Videos und RSS
Die Verknüpfung der Videos und des RSS-Feeds erfolgt über zwei Tags
im Feed. Darin wird angegeben wo sich die Datei zum Download befindet. Dieser <enclosure>-Tag besteht aus drei Teilen. Der erste Teil gibt
die URL zur Datei an, wo diese zum Download bereit steht. Der zweite Teil ist eine Zahl und gibt die Dateigröße an. Diese Größe muss in
Bytes angegeben werden. Der dritte Teil beschreibt die Art des VideoPodcast und wie sie geschrieben wurde. In unserem Fall ist die Angabe:
video/x-m4v und bedeutet, dass es sich um ein Video im .m4v Format
handelt.
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Neben dem <enclosure>- gibt es noch <guid>-Tag. Dieser besteht nur
aus der Angabe einer URL zum Dateidownload. Jedoch unterscheidet
sich die URL von der im <enclosure>-Tag. Im <guid>-Tag muss eine URL
zu einem Archiv sein, von wo die Datei downgeloaded werden kann,
falls es mit der anderen Angabe nicht funktioniert. So muss der Podcast
zweimal auf einem Server abgelegt werden.
5.2.4. Anmeldung bei iTunes
Um einen Podcast anzumelden müssen mehrere Schritte erfolgen, die
auf der Homepage von Apple angegeben sind. So muss zunächst die
erste Episode in einem der unterstützten Formate angefertigt werden.
5. REALISIERUNG
68
In unserem Fall waren dies Videos im m4v-Format. Diese Episoden
werden dann als nächstes auf einen öffentlich zugänglichen Webserver
abgelegt. Der nächste Schritt ist das Erstellen des RSS-Feeds. Dieser
muss mit der RSS 2.0 Spezifikation übereinstimmen, die erforderlichen
iTunes RSS-Tags enthalten und einen Verweis auf die Episode haben. Ist
dieser Teil in den RSS-Feed implementiert, kann auch dieser auf dem
Webserver abgelegt werden. Die URL zu diesem RSS-Feed wird dann
an iTunes übermittelt, welches dann den Podcast in ihr Angebot mit
übernimmt.
5.3.
DVD
5.3.1
Erstellung
Die Erstellung der DVD mit Hilfe von DVD Studio Pro ist recht einfach.
Zunächst wurden die einzelnen Elemente wie Videospuren und Menüs
angelegt. Für die einzelnen Episoden wurden je eine Videospur angelegt. Zudem erstellten wir eine Videospur für das Intro. Das Anlegen
und Verknüpfen der Menüs war wesentlich komplexer. Es gab neben
dem Hauptmenü auch Menüs für die Kapitelauswahl und das Impressum. All diese Menüs mussten untereinander und zu den jeweiligen
Alexander Steinhart
Rudolfstraße 8
88630 Pfullendorf
Matrikelnummer 36 153
Videos richtig verknüpft werden.
Marcus Merz
König-Wilhelm-Straße 3
89073 Ulm
Matrikelnummer 36 158
konnten wir die Videos in die Videospuren importieren. Dazu wurden
Betreuung
Professor Silko M. Kruse
Wintersemester 2006 / 2007
12. Januar 2007
Hochschule Ulm
Fachbereich Elektrotechnik und
Informationstechnik
Studiengang Digital Media
Nachdem die logische Struktur der DVD angelegt und überprüft war,
sie zuvor auf das benötigte Format umgeschrieben. Nach einem weiteren Test erstellten wir die DVD durch die Software und konnten sie
brennen.
5. REALISIERUNG
69
70
6.1.
QUELLEN
Literatur
• Spiele programmieren mit Flash MX
Isolde Kommer, Tilly Mersin
Hanser Verlag, 2003
ISBN: 3-446-22442-4
• ActionScript Flash-MX-Programmierung
Norbert Busche
bhv, 2003
ISBN: 3-82667-239-9
• Einstieg in Flash 8
Tobias Gräning
Galileo Design, 2006
ISBN: 3-89842-757-9
• ActionScript für Flash MX
Colin Moock
O’Reilly, 2004
ISBN: 3-89721-259-5
• ActionScript. Das Praxisbuch. Studienausgabe
Matthias Kannengiesser
Franzis Verlag, 2005
ISBN: 3-77236-645-7
• The Animator’s Survival Kit
Richard Williams
Faber & Faber, 2002
ISBN: 0-57120-228-4
6. ANHANG
6. ANHANG
Internet
• http://www.flashforum.de
(Forum rund um Flash)
• http://www.podster.de (Podcast-Portal)
• http://www.apple.de (Homepage von Apple )
• http://student.ikt.hs-ulm.de/kruse
(Vorlesungsdaten des betreuenden Professors Silko M. Kruse)
• http://www.video-animation.com/flash_01.shtml
(Flash-Tutorials als Video)
• http://www.elc.unizh.ch/veranstaltungen/vkalender/archiv/
eltopicpodcast.html
(Abhandlung zum Thema, Podcast in der universitären Lehre)
• http://de.wikipedia.org/wiki/Enhanced_Podcast
(Beschreibung für die erweiterten Funktionen eines Podcasts)
• http://www.voxmedia.org/wiki/PodcastChapterTool
(Kapitel setzen in einem Video-Podcast)
• http://www.makezine.com/blog/archive/2005/07/
how_to_make_enh.html
• http://blogs.law.harvard.edu/tech/directory/5/feeds
(Kapitel setzen in einem Quicktime-Movie)
• http://www.apple.com/de/itunes/store/
podcaststechspecs.html (Spezifikationen des Apple iPod)
• http://www.apple.com/de/dotmac/
(Dotmac-Accounts, für die Synchronisierung mit dem lokalen Mac)
• http://wwwra.informatik.uni-rostock.de/aule2006/sites/
about/aule2006_markus_ketterl.pdf
(Präsentation zum Thema Podcasts in der Lehre)
• http://convergence.journalism.missouri.edu/4804/
enhancedpodcast.html (Kapitelmarken in ein Video integrieren)
• http://www.amazon.com/gp/bestsellers/electronics/
ref=pd_ts_h/102-7992411-9627369
(Verkauftstatistik Elektronikgeräte USA von amazon.com)
• http://essen.ruhrpott-kingdom.de/index.php/2006/01/11/
apple-keynote-2006/ (Artikel über Apple-Keynote 2006)
• http://www.galileodesign.de/openbook/actionscript/
actionscript_1_02_000.htm (Ursprünge des ActionScript)
6. ANHANG
71
Fernsehen
• neues.spezial: Blogger & Podcaster
Sendung am 5. November 2006, 3sat
Die Medienrevolution im Netz. Es begann Mitte der 90ziger
Jahre mit Online-Tagebüchern, den so genannten Weblogs.
Internet-Nutzer schrieben periodische Einträge über ihr eigenes
Leben auf und veröffentlichten sie im globalen Internet. Im
Jahre 2006 gibt es rund 47.2 Millionen Weblogs, Tendenz
steigend. Von technikorientier ten Weblogs, über Kunst und
Philosophie, bis zu Kochrezepten, das Themenspektrum von
Weblogs ist unendlich breit. Moderne Computertechnik machte
es mit der Zeit möglich, dass die Weblogs um den audiovisuellen Faktor erweitert wurden. Hundertausende von
Menschen verbreiten täglich ihre kreativen Audio- und VideoPodcasts ins Internet. Diese elektronische Form der freien
Meinungs-Äusserung findet nicht nur sehr viele private
Empfänger. Professionelle Medienschaffende sehen diese
Entwicklung mittlerweile als eine echte Medien-Revolution an.
Neues möchte dieser Entwicklung Rechnung tragen, und aus
verschiedenen Blickwinkeln auf die Blogger und Podcaster
werfen.
http://www.3sat.de/neues/sendungen/magazin/99523/
index.html
6. ANHANG
72
6.2. DREHBÜCHER
��������� �
�
��������
����������
�������������
��������������������������������������������������������������������
��������������������
������������������
��
��������������
����������
��������
�������������������������������������������
��������������������
������������������������
���������������������
�������������������������
���������������
�����������������������
��������������������������
��
����������
���������
�������
������������
��������������������������
�����������
���������������������
������������
��������������������
���������������
��������������������������
��������������������������������
��������������������������
������������������������������������
������������������������������������
��
��������
����������
��������������
��������������
��������������������������
��������������������������
�
�������������������������
�
������������
���������������������������������
�
��������������
�
�������������������������������
������������������������������������������
�������������������������������
��������������������
���������������������������
���������������
�����������������������������
�����������
������������������������������
��
������
����������
��������������
��������������
������������������
����������������������
���������������������
�����������������������������������
��������������������������������
�������������������������������������
�������������������������������������
���������������������
�������������������������������������������
���������������������������������������������������
��������������������������
���������������������
������������������������
���������������������
���������������������������
���������������������������������������������������
�������
��������������������������
���������������������
��������������������
���������������������������
���������������
�����������������������������
�����������
������������������������������
��������������������������
6. ANHANG
73
��������� �
�
��������
����������
�������������
����������������������������������������������������������������������
��������������������
������������������
��
������������
������
�����������������
������������������
���������������������
������������������������������
���������������������������
����������������
������������������������������������������������
������������
����������������������������������
�����
���������������������������
��
���������������
�����������������������������
���������������������������
������������������������������
��������������������
�����������������������
�����������������������������
�������������������������������������������
����������������������������������
����������������������������������������
�������������������������������������������
��������������������
�����������������������������������
��������������������
���������������������������
��������
��
������������������
��������������
�����
�����������������������������������������
����������������������
������������������������������������
�����������������������������������������
����������������
������������������
��������������
��������������������������
������������������������������������������
��������������������
���������������������������
����������������
����������������������������
����������������������������������
6. ANHANG
74
��������� �
�
��������
����������
�������������
6. ANHANG
75
�������������
��������������������
������������������
��
��������������
��������������������������������������������������
�������������������
���������
��������������������
��������������������
�������������������������������
��������������������������
������������������������
��
���������������
�����������
��������������
����������
��������������
�����������������������������������������������
����������������������������������������
�������������������������������������
����������������������
����������������������
��������������������������������
��������������������������������������������
����������������������������������
��������������������
������������������������
����������������
��
�������������
��������������
����
�������������������
�������������������������������������������������
��������
����������������������������������������
����������������������������������������������
������
���������������������������
��������������
������������������������������������������������
����
���������������������������������������������������
����������������
������������������������������������������
���������������������������������
��������������������
��������������������
�������������������������������
�������������������������
������������������������
����������������
6.3.
SCRIPT
Auf den folgenden Seiten finden sie das gesamte Script zum Spiel.
stop();
// ---------------------------------------------// Deklarations- und Intitialisierungbereich
// ----------------------------------------------
// Figur Grundposition
position_x = 400;
position_y = 400;
// Geschwindigkeiten und Größe der Figur
speed = 5;
speed_max = speed*3;
groesse = 15;
xpos_min = 10;
xpos_max = 800 - xpos_min;
ypos_min = 0;
ypos_max = 500;
// Springen
sprungkraft = 0;
space_pressed = false;
max_sprung = 20;
gravitation = 1;
nullpunkt = position_y;
absoluter_nullpunkt = nullpunkt;
t_springen = 20;
sprung_einleiten = false;
figur_springt = false;
absprung_bl = false;
fallen_bl = false;
6. ANHANG
76
absprung_bl = false;
x_faktor = 1;
b_box_verschiebung = 6;
anzahl_ebenen = 0;
ebenennummer = -1;
auf_ebene = new Array;
x_bereich = new Array;
plattform = new Array;
while(this[“ebene_”+anzahl_ebenen] != undefined){
auf_ebene[anzahl_ebenen] = false;
x_bereich[anzahl_ebenen] = false;
plattform[anzahl_ebenen] = new Array;
plattform[anzahl_ebenen][0] = this[“ebene_”+
anzahl_ebenen]._x;
plattform[anzahl_ebenen][1] = this[“ebene_”+
anzahl_ebenen]._y;
plattform[anzahl_ebenen][2] = this[“ebene_”+
anzahl_ebenen]._width;
}
// Textfeld um die Sprungkraft auszugeben
createTextField(“sprung_hoehe”, 10, 20, 20, 20, 20);
sprung_hoehe.text = sprungkraft;
// Punktezaehler und Fallobjekte
punktestand = 0;
createTextField(“punktezaehler”, 5, 50, 20, 40, 20);
punktezaehler.text = punktestand;
max_objekte = 10;
layer_counter = 100;
punkte = 10;
punkteabzug = 2;
bereich_schlecht = 0.1;
6. ANHANG
77
bereich_gut = 0.07;
grenzwert = 7;
zaehler_gut = 0;
zaehler_schlecht = 7;
for(i = 0; i < max_objekte; i++){
if(i < grenzwert){
attachMovie(“ding_1”, “ding”+i, layer_counter);
this[“ding”+i].points = punkte;
}
else{
attachMovie(“ding_2”, “ding”+i, layer_counter);
this[“ding”+i].points = -punkte;
}
this[“ding”+i].treffer = false;
this[“ding”+i].aktiv = false;
this[“ding”+i].y_verschiebung = 5;
this[“ding”+i]._x = (i*25);
this[“ding”+i]._y = -50;
layer_counter++;
}
// Boolsche Variable zum Steuern des Movieclips
inBewegung = “stehen”;
geduckt = false;
// Figur auf Bühne laden, positionieren und skalieren
attachMovie(“maennchen”, “figur”, 25);
figur._x = position_x;
figur._y = position_y;
figur._xscale = groesse;
figur._yscale = groesse;
// Ein gegner kommt hinzu
attachMovie(“gegner”, “der_gegner”, 45);
6. ANHANG
78
der_gegner._x = 100;
der_gegner._y = 100;
traegheit = 1;
x_differenz = figur._x - der_gegner._x;
y_differenz = figur._y - der_gegner._y;
y_traegheit = 50;
differenz_traegheit = 500;
x_gegner_geschwindigkeit = 0;
gegner_bechleunigung = 0.25;
gegner_angriff = false;
angriffshaltung = 100;
gesamt_differenz = Math.sqrt(Math.pow((figur._x der_gegner._x), 2) + Math.pow((figur._y der_gegner._y), 2));
attachMovie(“projektil”, “geschoss”, 44);
geschoss._x = 0;
geschoss._y = -100;
geschoss_winkel = 0;
geschoss_abgefeuert = false;
geschoss_speed = 3;
// ---------------------------------------------// Steuerungsbereich
// ----------------------------------------------
geschoss_flug = function(x_diff, y_diff){
x_teiler = Math.abs(x_diff);
y_teiler = Math.abs(y_diff);
teiler = Math.sqrt(Math.pow(x_diff,2) + Math.pow
(y_diff, 2));
x_anteil = x_diff/teiler;
y_anteil = y_diff/teiler;
6. ANHANG
79
geschoss._x += x_anteil*geschoss_speed;
geschoss._y += y_anteil*geschoss_speed;
if(geschoss.hitTest(figur)){
punktestand -= punkteabzug;
punktezaehler.text = punktestand;
}
if(geschoss._x < xpos_min || geschoss._x > xpos_max
|| geschoss._y < ypos_min || geschoss._y > ypos_max
|| geschoss.hitTest(figur)){
geschoss._x = 0;
geschoss._y = -100;
geschoss_abgefeuert = false;
clearInterval(intervalID_geschoss);
}
}
verfolgung = function(){
if(figur._x < der_gegner._x){
x_gegner_geschwindigkeit -= gegner_bechleunigung;
der_gegner._xscale = 100;
}
else{
x_gegner_geschwindigkeit += gegner_bechleunigung;
der_gegner._xscale = -100;
}
x_differenz = (figur._x - der_gegner._x);
if(x_gegner_geschwindigkeit/x_differenz < 0){
x_gegner_geschwindigkeit += x_differenz/
differenz_traegheit;
}
6. ANHANG
80
y_differenz = figur._y - der_gegner._y;
der_gegner._x += x_gegner_geschwindigkeit;
der_gegner._y += y_differenz/y_traegheit;
gesamt_differenz = Math.sqrt(Math.pow(
(x_differenz), 2) + Math.pow((y_differenz), 2));
if(gesamt_differenz < 250 && gesamt_differenz > 100
&& !geschoss_abgefeuert){
geschoss._x = der_gegner._x;
geschoss._y = der_gegner._y;
geschoss_winkel = Math.atan2(y_differenz,
x_differenz) * 180 / Math.PI;
geschoss._rotation = geschoss_winkel;
geschoss_abgefeuert = true;
intervalID_geschoss = setInterval(geschoss_flug, 25,
x_differenz, y_differenz);
}
if(gesamt_differenz < angriffshaltung &&
!gegner_angriff){
gegner_angriff = true;
der_gegner.gotoAndPlay(“angriff”);
}
if(gegner_angriff && gesamt_differenz >
angriffshaltung){
gegner_angriff = false;
der_gegner.gotoAndPlay(“rueckzug”);
}
if(figur.hitTest(der_gegner)){
punktestand -= punkteabzug;
punktezaehler.text = punktestand;
}
}
6. ANHANG
81
// Funktion zum steuern der MC_Sequenzen
sequenz = function(modus){
if (modus != inBewegung) {
figur.gotoAndPlay(modus);
inBewegung = modus;
}
}
springen = function(){
space_pressed = false;
if(sprungkraft > 0 && !absprung_bl){
absprung_bl = true;
sequenz(“absprung”);
}
if(sprungkraft <= 0 && !fallen_bl){
fallen_bl = true;
sequenz(“fallen”);
}
// vorausberechnung
y_pos_figur = figur._y;
y_bewegung = sprungkraft;
y_pos_figur -= y_bewegung*2 - gravitation*3;
if(y_pos_figur >= nullpunkt && !landen_bl){
landen_bl = true;
sequenz(“landen”);
}
x_faktor = 1 + sprungkraft/(max_sprung*3);
sprungkraft -= gravitation;
figur._y -= sprungkraft;
6. ANHANG
82
if(figur._y >= nullpunkt){
auf_ebene[ebenennummer] = false;
x_bereich[ebenennummer] = false;
x_faktor = 1;
absprung_bl = false;
fallen_bl = false;
landen_bl = false;
figur_springt = false;
figur._y = nullpunkt;
sprungkraft = 0;
sprung_hoehe.text = sprungkraft;
clearInterval(intervalID_springen);
}
}
// Kollisionsabfrage
kollision = function(){
b_box = new Object;
b_box = figur.getBounds(this);
for(i = 0; i < anzahl_ebenen; i++){
if((b_box.xMax > plattform[i][0]+b_box_verschiebung)
&& (b_box.xMin < (plattform[i][0] +
plattform[i][2] -b_box_verschiebung))){
x_bereich[i] = true;
if(b_box.yMax < plattform[i][1] && b_box.yMax >
plattform[i][1] -65){
nullpunkt = plattform[i][1] - 65;
ebenennummer = i;
if(figur._y == (plattform[i][1] - 65)){
auf_ebene[i] = true;
}
}
}
6. ANHANG
83
else{
x_bereich[i] = false;
if(auf_ebene[ebenennummer] &&
!x_bereich[ebenennummer]){
nullpunkt = absoluter_nullpunkt;
auf_ebene[ebenennummer] = false;
x_bereich[ebenennummer] = false;
ebenennummer = -1;
if(!figur_springt){
sprungkraft = 0;
figur_springt = true;
intervalID_springen = setInterval(springen,
t_springen);
}
}
}
}
}
// Verschiebung und Ausrichtung der Figur (x-Richtung) -------------------------------x_bewegung = function(ausrichtung, bewegung){
figur._xscale = ausrichtung;
figur._x += bewegung *x_faktor;
if(figur._x < xpos_min || figur._x > xpos_max){
figur._x -= bewegung;
}
}
6. ANHANG
84
// onEnterFrame Funktion zum Abfragen der gedrückten
onEnterFrame = function(){
kollision();
verfolgung();
if(Key.isDown(Key.DOWN) && !geduckt &&
!figur_springt){
geduckt = true;
sequenz(“ducken”);
}
if(!Key.isDown(Key.DOWN) && geduckt &&
!figur_springt){
geduckt = false;
sequenz(“aufstehen”);
}
// fürs laufen
if(Key.isDown(Key.CONTROL)){
if(Key.isDown(Key.RIGHT) && Key.isDown(Key.LEFT) &&
!figur_springt){
inBewegung = “keineBewegung”;
figur.gotoAndStop(“stehen”);
}
else{
if(Key.isDown(Key.LEFT) && !geduckt){
x_bewegung(-groesse, -speed_max);
if(!figur_springt){
sequenz(“rennen”);
}
}
6. ANHANG
85
if(Key.isDown(Key.RIGHT) && !geduckt){
x_bewegung(groesse, speed_max);
if(!figur_springt){
sequenz(“rennen”);
}
}
}
}
else{
if(Key.isDown(Key.LEFT) && !geduckt){
x_bewegung(-groesse, -speed);
if(!figur_springt){
sequenz(“gehen”);
}
}
if(Key.isDown(Key.RIGHT) && !geduckt){
x_bewegung(groesse, speed);
if(!figur_springt){
sequenz(“gehen”);
}
}
}
if((!Key.isDown(Key.RIGHT) && !Key.isDown(Key.LEFT)
|| Key.isDown(Key.RIGHT) && Key.isDown(Key.LEFT))
&& !figur_springt && !geduckt){
inBewegung = “keineBewegung”;
figur.gotoAndStop(“stehen”);
}
// fürs springen
if(Key.isDown(Key.SPACE) && !figur_springt){
space_pressed = true;
if (sprungkraft < max_sprung){
6. ANHANG
86
sprungkraft++;
sprung_hoehe.text = sprungkraft;
}
}
if(!Key.isDown(Key.SPACE)&& space_pressed &&
!geduckt){
space_pressed = false;
figur_springt = true;
intervalID_springen = setInterval(springen,
t_springen);
}
// Der Teil für die fallenden Dinger
zufallszahl = Math.random();
if(zufallszahl < bereich_gut &&
!this[“ding”+zaehler_gut].aktiv){
this[“ding”+zaehler_gut]._x = zufallszahl/0.07*
xpos_max;
this[“ding”+zaehler_gut].aktiv = true;
zaehler_gut++;
if(zaehler_gut == grenzwert){
zaehler_gut = 0;
}
}
if(zufallszahl > bereich_gut && zufallszahl <
bereich_schlecht &&
!this[“ding”+zaehler_schlecht].aktiv){
this[“ding”+zaehler_schlecht]._x =
(zufallszahl-0.07)*xpos_max*33;
this[“ding”+zaehler_schlecht].aktiv = true;
zaehler_schlecht++;
if(zaehler_schlecht == 10){
zaehler_schlecht = 7;
6. ANHANG
87
88
6. ANHANG
}
}
for(i = 0; i < max_objekte; i++){
if(this[“ding”+i].aktiv){
this[“ding”+i].y_verschiebung += gravitation;
this[“ding”+i]._y += this[“ding”+i].y_verschiebung;
if(this[“ding”+i].hitTest(figur) &&
!this[“ding”+i].treffer){
this[“ding”+i].treffer = true;
this[“ding”+i]._visible = false;
punktestand += this[“ding”+i].points;
punktezaehler.text = punktestand;
}
if(this[“ding”+i]._y > ypos_max+50){
this[“ding”+i].aktiv = false;
this[“ding”+i].treffer = false;
this[“ding”+i]._visible = true;
this[“ding”+i].y_verschiebung = 5;
this[“ding”+i]._x = (i*25);
this[“ding”+i]._y = -50;
}
}
}
}
6.4.
RSS-FEED
<?xml version=”1.0” encoding=”utf-8”?>
<rss xmlns:itunes=”http://www.itunes.com/dtds/podcast1.0.dtd” version=”2.0”>
<channel>
<title>Flash Tutorials für Einsteiger</title>
<link>http://www.steinmerz.de</link>
<language>de-de</language>
<description>Flash ist ein immer wichtigeres Autorenwerkzeug. Neben Webseiten können auch komplexe Applikationen erstellt werden. In diesem Podcast lernen sie wie ein
Junp’n’Run-Spiel erstellt wird. Entstanden ist dieser Podcast als Abschlussarbeit zum Bachelor of Arts an der Hochschule Ulm, Betreuer: Prof. Silko M. Kruse</description>
<itunes:subtitle>Flash Tutorials für Einsteiger. In
acht Schritteitten zur Erstellung eines Jump’n’Run-Spiels</
itunes:subtitle>
<itunes:summary>Flash ist ein immer wichtigeres Autorenwerkzeug. Neben Webseiten können auch komplexe Applikationen erstellt werden. In diesem Podcast lernen sie wie ein
Junp’n’Run-Spiel erstellt wird. Entstanden ist dieser Podcast als Abschlussarbeit zum Bachelor of Arts an der Hochschule Ulm, Betreuer: Prof. Silko M. Kruse</itunes:summary>
<pubDate>Wed, 03 Jan 2007 15:16:21 +0100</pubDate>
<lastBuildDate>Wed, 03 Jan 2007 15:16:21 +0100</lastBuildDate>
<itunes:author>Alexander Steinhart &amp; Marcus Merz</
itunes:author>
<itunes:keywords>Flash, Tutorial, Einsteiger,
Jump&apos;n&apos;Run, Spiel, Game, ActionScript, Animation</
itunes:keywords>
6. ANHANG
89
<itunes:explicit>clean</itunes:explicit>
<itunes:image href=”http://www.steinmerz.de/steinmerz_
logo_invert02.png”/>
<itunes:owner>
<itunes:name>Alexander Steinhart &amp; Marcus Merz</
itunes:name>
<itunes:email>[email protected]</itunes:email>
</itunes:owner>
<itunes:block>no</itunes:block>
<itunes:category text=”Technology”>
<itunes:category text=”Software How-To”/>
</itunes:category>
<itunes:category text=”Education”>
<itunes:category text=”Educational Technology”/>
<itunes:category text=”Training”/>
</itunes:category>
<!-- Podcast 4 -->
<item>
<title>Import einer erstellten Animation</title>
<itunes:author>Alexander Steinhart &amp; Marcus
Merz</itunes:author>
<itunes:subtitle>Import der in Episode 2 erstellten Animation in ActionScript</itunes:subtitle>
<itunes:summary>Import ist nicht gleich Import.
In dieser Episode wird beschrieben, auf was man achten muss,
wenn man eine extern erstellte Flashanimation in Flash importieren möchte. (Kapitel 1: Figur importiern 00:34, Kapitel 2: Labels einfügen 02:49, Kapitel 3: Figur auf die Bühne
legen 06:57)</itunes:summary>
6. ANHANG
90
<enclosure url=”http://www.dm.hs-ulm.de/showcase/steinmerz/x_podcasts/testcast.m4v” length=”20185820”
type=”video/x-m4v” />
<guid>http://www.dm.hs-ulm.de/showcase/steinmerz/x_archiv/testcast.m4v</guid>
<pubDate>Fri, 29 Dec 2006 19:00:00 GMT</pubDate>
<itunes:explicit>no</itunes:explicit>
<itunes:duration>10:09</itunes:duration>
<itunes:keywords>Flash, Tutorial, Spiel,
Jump’n’Run, Import, swf, importieren, Animation</itunes:
keywords>
</item>
</channel>
</rss>
6. ANHANG
91
6.5.
Beispiel Gehen
Beispiel Rennen
FIGUR MIT ZWIEBELSCHALEN
6. ANHANG
92
6. ANHANG
93
Beispiel Absprung
Beispiel Fallen
6. ANHANG
94
Beispiel Landen
6.6.
SCREENSHOTS GAME
6. ANHANG
95
6. ANHANG
96
6.7.
SOFTWARE
Für die Erstellung der dieser Abschlussarbeite genutzte Software:
• Adobe Acrobat 7 Professional
• Adobe After Effects 7
• Adobe Audition 1.5
• Adobe GoLive CS
• Adobe Illustrator CS
• Adobe InDesign CS
• Adobe Photoshop CS
• Adobe Premiere Pro 1.5
• Ambrosia Snapz Pro X 2
• Apple DVD Studio Pro 4
• Apple Final Cut Pro
• Apple GarageBand 3
• Apple IMovie 6
• Apple iTunes 7
• Apple IWeb 1
• Apple Quicktime 7
• canopus Twin Commander
• ChapterTool Beta
• ChapterToolMe
• Macromedia Dreamweaver MX 2004
• Macromedia Flash 8 Professional
• Macromedia Flash MX 2004 Professional
• Macromedia Freehand MX
• Microsoft Excel
• Microsoft Word
• Sorensen Squeeze 4.5 Compression Suite (Trial Version)
• TheCodingMonkeys SubEthaEdit 2
• VideoLanTeam VLC 0.8.5
•…
6. ANHANG
97
6.8.
HARDWARE
Für die Erstellung der dieser Abschlussarbeite genutzte Hardware:
• 1 iMac Mac OS X (10.4)
2 GHz Intel Core Duo, 1 GB DDR2 SDRAM
• 1 PowerPC G4 OS X(10.4)
733 MHz, 512 MB RAM
• 1 PC Windows XP Professional
Intel Pentium 4 3 GHz, 1 GB RAM
• 2 PC Windows XP Professional
AMD Athlon 1,66 GHz, 256 MB RAM
• iPod video (5.Generation) 30 GB
• Samson Audio CO1U USB Condenser Microphone
• canopus TwinPact 100
• Sony GV-D1000 miniDV-Walkman
6. ANHANG
98
99
WEBSITE
6. ANHANG
6.9.
Introseite html
Preloader Flashseite
Die Webseite zur Abschlussarbeit finden sie unter:
http://www.steinmerz.de
http://www.dm.hs-ulm.de/showcase/steinmerz/
6. ANHANG
100
Introseite Flash
Downloadbereich
6. ANHANG
101
Kontaktformular
Videolektion
102
6. ANHANG
6.10. MENÜFÜHRUNG DVD
INTRO
HAUPTMENÜ
IMPRESSUM
K APITELWAHL 01
K APITELWAHL 02
K APITELWAHL 03
K APITELWAHL 0 4
K APITELWAHL 05
K APITELWAHL 0 6
K APITELWAHL 07
K APITELWAHL 0 8
EPIS ODE 01
EPIS ODE 02
EPIS ODE 03
EPIS ODE 0 4
EPIS ODE 05
EPIS ODE 0 6
EPIS ODE 07
EPIS ODE 0 8
6.11. TECHNISCHE DATEN IPOD (AUSSCHNITT)
Abmessungen, Gewicht und Kapazität (30 GB Modell)
• Höhe / Breite / Tiefe: 103,5 / 61,8 / 11 (mm)
• Gewicht: 136 g
• Platz für bis zu 7.500Songs im 128 KBit/Sek. AAC-Format
• Platz für bis zu 40 Stunden Videomaterial
Abmessungen, Gewicht und Kapazität (80 GB Modell)
• Höhe / Breite / Tiefe: 103,5 / 61,8 / 14 (mm)
• Gewicht: 157 g
• Platz für bis zu 20.000 Songs im 128 KBit/Sek. AAC-Format
• Platz für bis zu 100 Stunden Videomaterial
Display
• 2,5” QVGA-Transflektiv-LCD (6,35 cm Diagonale)
• über 65.000 Farben,
• weiße Hintergrundbeleuchtung
• Auflösung von 320 x 240 Pixeln,
• Punktabstand 0,156 mm
Audio
• Frequenzbereich: 20 Hz bis 20.000 Hz
• Unterstützte Audioformate: AAC (16 bis 320 KBit/Sek.),
Protected AAC (aus dem iTunes Store), MP3 (16 bis 320 KBit/Sek.),
MP3 VBR, Audible (Formate 2, 3 und 4), Apple Lossless, AIFF, WAV
Video
Unterstützte Videoformate:
• H.264 Video, bis zu 1,5 MBit/Sek., 640 x 480 Pixel, 30 Bilder pro Sek.,
Baseline Low-Complexity Profile mit AAC-LC Audio bis zu 160 KBit/
Sek., 48 kHz, Stereo-Audio in den Formaten .m4v, .mp4 und .mov;
6. ANHANG
103
• H.264 Video, bis zu 768 KBit/Sek., 320 x 240 Pixel, 30 Bilder pro Sek.,
Baseline Profile bis zu Level 1.3 mit AAC-LC Audio bis zu 160 KBit/Sek.,
48 kHz, Stereo-Audio in den Formaten .m4v, .mp4 und .mov;
• MPEG-4 Video, bis zu 2,5 MBit/Sek., 640 x 480 Pixel, 30 Bilder pro Sek.,
Simple Profile mit AAC-LC Audio bis zu 160 KBit/Sek., 48 kHz, StereoAudio in den Formaten .m4v, .mp4 und .mov
Systemvoraussetzungen für Mac
Mac mit USB 2.0 Anschluss, min. Mac OS X 10.3.9, min. iTunes 7
Systemvoraussetzungen für Windows
PC mit USB 2.0 Anschluss, min. Windows 2000 (SP4) od. min Windows
XP Home / Professional (SP2), min. iTunes 7
Eingang und Ausgang
Dock-Anschluss, 3,5 mm Stereo-Kopfhörer-Minianschluss
Dock-Anschluss, Audio- und Composite-Videoausgang, S-Video-Ausgang
Stromversorgung und Batterie
Integrierte wiederaufladbare Lithium-Ionen-Batterie
Wiedergabedauer (30 GB Modell)
Musikwiedergabe: bis zu 14 Std. bei voller Ladung
Fotodiashows mit Musik: bis zu 4 Std. bei voller Ladung
Videowiedergabe: bis zu 3,5 Std. bei voller Ladung
Wiedergabedauer (80 GB Modell)
Musikwiedergabe: bis zu 20 Std. bei voller Ladung
Fotodiashows mit Musik: bis zu 6 Std. bei voller Ladung
Videowiedergabe: bis zu 6,5 Std. bei voller Ladung
6. ANHANG
104
6.12. ����������������������
FRAGEBOGEN EVALUATION
Dieser Evaluationsbogen wurde nach jeder Lektion
am Ende des Tutorials ausgeteilt und anschließend
ausgewertet.
�����������������������������
�
�
������������������������������������������������������
��������������������������������������������������������������������������������
�
�
��������������������������������������������
��������������������������������������������������������������������������������������
�
�
�����������������������������������������
����������������������������������������������������������������������
�
�
�����������������������������������������������������������������
������������������������������������������������������������������������������
�
�
�����������������������������������
����������������������������������������������������������������������
����������������
�
�
��������������������������������
������������������������������������������������������������������������������
�
�
�������������������������������������
����������������������������������������������������������������������������
�
�
�������������������������������
������������������������������������������������������������������������
�
�
�������������������������������������������������������������������
������������������������������������������������������������
�
������������
�
�
�������������������������������������������
�������������������������������������������������������������
�
�����������������������
�
�
�������������������������������������������
���������������������������������������������������������������
�
�����������������������������������������������
�������������������������������������������������������������������������������������
6. ANHANG
105
106
Dieser Fragebogen wurde nach der letzten Lektion
ausgegeben und ausgewertet um einen Gesamteindruck über den Verlauf des Tutorials erhalten
zu können
�����������������������������
�
�
������������������������������������������������������
��������������������������������������������������������������������������������
�
�
�����������������������������������������������������������������������
��������������������������������������������������������������������������������������
�
�
�������������������������������������������������������������������
����������������������������������������������������������������������
�
�
�������������������������������������������������������������������
������������������������������������������������������������������������������
�
�
������������������������������������
����������������������������������������������������������������������
����������������
�
�
��������������������������������
������������������������������������������������������������������������������
�
�
�������������������������������������
����������������������������������������������������������������������������
�
�
��������������������������������
������������������������������������������������������������������������
�
�
��������������������������������������������������������������������
������������������������������������������������������������
�
������������
�
�
�������������������������������������������
�������������������������������������������������������������
�
�����������������������
�
�
�
�������������������������������������������
������������������������������������������������������������������
������������������������������������������������������������������
�
�����������������������������������������������
�������������������������������������������������������������������������������������
6. ANHANG
���������������������������������������
LE = Lektion
6.13.
EVALUATIONSERGEBNISSE
Ist die Darbietung der Inhalte insgesamt verständlich?
1,00 verständlich
6,00 nicht verständlich
Sind die einzelnen Schritte nachvollziebar?
1,00 nachvollziehbar
6,00 nicht nachvollziehbar
6. ANHANG
107
LE = Lektion
Ist das Tempo zu schnell oder zu langsam?
1,00 zu schnell
6,00 zu langsam
Ist die Art der Vermittlung überzeugend, dem Inhalt entsprechend?
1,00 überzeugend
6,00 nicht überzeugend
6. ANHANG
108
LE = Lektion
Sind die Inhalte logisch aufgebaut?
1,00 logisch
6,00 nicht logisch
Ist der Theorieteil ausreichend?
1,00 ausreichend
6,00 nicht ausreichend
6. ANHANG
109
LE = Lektion
Ist der praktische Teil verständlich?
1,00 verständlich
6,00 nicht verständlich
Sind beide Bereiche ausgewogen?
1,00 ausgewogen
6,00 unausgewogen
6. ANHANG
110
LE = Lektion
Wie schätzen sie die Nutzbarkeit des Themenabschnittes für sie ein?
1,00 hoch
6,00 gering
Wie bewerten sie den Themenblock insgesamt?
1,00 gut
6,00 schlecht
6. ANHANG
111