Kay Wiegand, Jörg Schüler, Karl Baase


HandsOn -Herd mit Backofen-

MG2 FlashProjekt 2005/06


Screen Ausstellungshalle 1 [link 01]

Screen Ausstellungshalle 1

Inhalt

  • › kurze Projektdokumentation [PDF | 332 KB ] [link 02]

Inhaltliche Beschreibung

1. Unsere Aufgabe:
-------------------------------------

Erarbeiten Sie für einen Herd mit Backofen eine interaktive Animation, mit der die Funktionsweise erklärt werden kann. Dabei soll nicht nur ein einfacher Funktionsablauf gezeigt werden – vielmehr soll der Benutzer unterschiedliche Funktionen erproben und sich die Bedienung virtuell erarbeiten können.



2. Projektumfang:
-------------------------------------

-Preloader

-Intro: Aufbau der Applikation durch Erscheinen der verschiedenen Elemente.

-Ausstellungshalle: Bewegliches 3D-Objekt, welches per Mouseover Kurzinformationen und Detailansichten zur Verfügung stellt.

-Aufgaben für Herd: Mit Hilfe einer Anleitung sollen per Drag & Drop zwei Essen (Spiegelei, Nudeln) zubereitet werden.

-Aufgaben für Backofen: Mit Hilfe einer Anleitung sollen per Drag & Drop zwei Essen (Hähnchen, Pizza) zubereitet werden.
-Navigation: Die Navigation ermöglicht jederzeit den Wechsel in andere Bereiche der Applikation und zusätzlich den Aufruf von Kontaktinformationen und rechtlichen Hinweisen. Auch die Einstellungen für den Sound sind hier zu finden.

-Soundsteuerung: Der Ablauf der Animationen wird durch Soundeffekte unterstützt und eingeblendete Texte werden durch einen Sprecher akustisch wiedergegeben. Steuerungselemente für den Sound befinden sich in der Navigation.



3. Programmiertechnische Entwicklung:
-------------------------------------

Zum größten Teil ist die Applikation ausschließlich mit AS (ActionScript) erstellt. Nur in Ausnahmefällen und dort, wo es aus dem zeitlichen Gesichtspunkt Sinn machte, wurde zeitleistenorientiert gearbeitet. Die final Applikation besteht hauptsächlich aus einer mainStage-Datei, die das Gerüst der Anwendung darstellt. Die gesamte Navigation ist objektorientiert erstellt und wird zur Laufzeit in die mainStage geladen. Die einzelnen Drag & Drop Aufgaben sind separate, überwiegend objektorientiert, Flash-Dateien und werden ebenfalls zur Laufzeit hinzugeladen. Die Ansprechpartner für den Programmcode sind hauptsächlich Kay Wiegand und Jörg Schüler für die mainStage, Jörg Schüler für die Navigation und Karl Baase für die Drag & Drop Aufgaben. Die Texte werden aus externen XML-files geladen, um eventuelle Änderungen schneller und effektiver zu realisieren.

Zu erwähnen ist, dass das gesamte Projekt mittlerweile einen Umfang von ca. 3000 - 4500 Code-Zeilen aufweist. Hinzu kommen noch zahlreiche zeitleistenorientierte Movieclips in der mainStage.

Kontext

Hochschule / Fachbereich

Fachhochschule Giessen Friedberg - University of Applied Sciences
IEM - Informationstechnik-Elektrotechnik-Mechatronik

URL der Hochschule

» http://www.fh-giessen-friedberg.de [link 03]

Betreuer des Projekts

Professor Rainer Bernd Voges

Kommentar des Betreuers

Kay Wiegant reicht für seine Arbeitsgruppe eine sehr aufwändige Arbeit ein, in der sich die Gruppe mit der Möglichkeit auseinandersetzt, die Grundfunktionen eines elektrischen Küchenherdes durch ein virtuelles 'Hands-On' darzustellen.
Die Eingangsüberlegung – eine im Übrigen sehr gelungene didaktische Reduktion – setzte sich zunächst mit dem Umfang der darzustellenden Funktionen auseinander und begrenzte diese auf jene Funktionen, die offensichtlich immer im Vordergrund stehen werden: Erwärmen von einfachen Speisen auf einer Kochplatte oder/und Backen ebenso einfacher wie plakativer Gerichte im Backofen.
Die Bedienelemente sind nicht fotografisch abgebildete Standartelemente eines Herd-Produzenten, sonders komplette Eigenentwicklungen von Herrn Wiegant. Bei näherem Vergleich fällt auf, dass nur die wirklich wichtigen grafischen Elemente hier so zusammengefügt sind, dass ein entsprechend hoher Wiedererkennungseffekt einsetzt. Die Flash-Animation bleibt plausibel, die Transferleistung des Betrachters zur Realität ist jederzeit sichergestellt. Das ist eine beachtliche Leistung des Autorenteams!
Bemerkenswert am Rande ist in diesem Zusammenhang die besonders gelungene Formgebung der Drehregler und der Backofenklappe. Damit könnte K. Wiegant auch Designpreise erringen …
Die schwierige Umsetzung eines Zeitverlaufs gelingt hier mit einer Art Fieberthermometer am Bildrand, mit dem jederzeit der Fortschritt des Garprozesses visualisiert wird.
Der Funktionsumfang dieser kleinen Animation geht weit über ein einfaches 'Hand-On' hinaus. Erwartet man zunächst nur die Abbildung eines linearen Prozesses, so sind hier vier und mehr komplette 'Storys' abrufbar und ineinander verschachtelt. Sie funktionieren alle perfekt, vom Aufsetzen des Kochgeschirrs bis zur Fehlermeldung. Eine solche Zusammenziehung mehrerer Funktionen in einer Animation muss auch deshalb besonders gewürdigt werden, weil sie in der Aufgabenstellung geforderten Flash-Animation nur sehr schwer zu realisieren ist. Die erforderlichen zahllosen Ebenen sind dabei ein enormer Aufwand.
Die Animation ist darüber hinaus sehr anregend gestaltet, zeigt deutlich, welch hohe Affinität kay Wiegant zu Industriedesign und Internetgestaltung in seinem Studium entwickelt hat.

Seminar / Kurzbeschreibung

Aufgabenstellung:
"HAND-ON"!
Immer mehr Museen und Ausstellung binden Besucher aktiv in die Erklärung ihrer Präsentation ein. Lernen durch aktives Tun - Nähe und Interesse schaffen durch eigenes Handeln am Objekt.
Weltweit ist dieser Trend sichtbar, immer mehr Museen begreifen den spielerischen Umgang als effektiven eigengesteuerten Vermittlungsprozess.
Dabei kommt neben den primären "HAND-ON"-Objekten - bei denen der Besucher z.B. einen pysikalischen Versuch selbst nachstellt - den begleitenden Animationen immer größere Bedeutung zu.
Auch das ist ein mögliches späteres Betätigungsfeld für Medieninformatiker! "HAND-ON" - unser Leitthema im Wintersemester 2005!
Anforderungen:
Ihre Idee, vorgestellt in einer schlüssigen Präsentation.
Ihren Weg zur gestalterischen Umsetzung, dargestellt durch Skribble oder Skizzen.
Stimmige Typografie, eingehaltene gestalterische Grundlagen, Bildaufteilung, Bildwirkung, Nutzung der Farbräume, des Kontrastes und der Größenwirkung.
Mitarbeit und Engagement in den Veranstaltungen, besonders in den wöchentlichen Bewertungs- und Verbesserungsrunden.
Sichtbare "Performance" der Arbeit und ausführliche Abschlussdokumentation als Papier-
und E-Version.
Bewertungskriterien:
tragfähige Idee, schlüssige Konzeption, umfangreiches Skribble, vollständiges Storyboard, exakte Beschreibung der Zielgruppe, genaue Kenntnis des Einsatzbereiches, gestalterische Begründung.
Film / Animation, Länge von min. 30, max. 120 Sek. bevorzugtes Datenformat flash (.swf).
termingerechte Fertigstellung der Hands-On-Präsentation incl. Storyboard und Konzeptunterlagen auf CD.
Stellung in der Ausbildung
Die Studierenden im fünften Semester Medieninformatik an der Fachhochschule Gießen-Friedberg erhalten im Fach Mediengestaltung II erstmalig im fünften Semesters ihres Studiums die Möglichkeit, eine freie Projektarbeit zu erproben. Dazu arbeiten sie in Gruppen mit maximal fünf Teilnehmern in einem Stundenumfang von vier SWS, was eine effektive Bearbeitungszeit von etwa fünf Zeitstunden pro Woche erwarten lässt. Diese Voraussetzungen sind wichtig für den Vergleich mit anderen Arbeiten, die etwa als Abschlussarbeiten oder mehrjährige Studienarbeiten mit höherem SWS-Einsatz zu Stande gekommen sind.

  • › digital sparks 2006 [link 04]
  • › Flash-Demo [7 MB ] [link 05]
  • › Screen Ausstellungshalle 2 [JPEG | 38 KB ] [link 06]
  • › Screen Ausstellungshalle 3 [JPEG | 42 KB ] [link 07]
  • › Screen Drag&Drop Aufgabe Backofen [JPEG | 48 KB ] [link 08]
  • › Screen Drag&Drop Aufgabe Herd [JPEG | 72 KB ] [link 09]
  • › Projektdatei Offline gepackt mit Source [27 MB ] [link 10]
  • › kurze Projektdokumentation [PDF | 332 KB ] [link 11]