der hess

Eine kleine Sammlung von sehr guten Helferlein Klassen und umfangreicheren Klassenbibs für das Lösen grösserer Flashproblemen

Allgemein:

• as2lib.org :AS 2 -verbessertes Event- und Error-Handling uvm.
• Pixlib :AS 2 - Logging, Data Preloading uvm.
• senocular.com :AS 1-3 - Utility-, Drawing und GUI Klassen uvm.
• Data Structures :AS 3 - Datenstruktur Bibliothek
• PaperVision 3D :AS2 und 3 - Flash 3d Bibliothek
• flashsandy.org :AS 2-3 - Flash 3d API
• motor2 :AS3 - Flash Physik Engine für Games und sonstiges
• APE :AS3 - Flash 2D Physik Engine für Games

Filter und Animation:

• Image Processing Bibliothek :AS 3 - Bildbearbeitungsklassen
• popforge :AS 3 - Audiofilter und -bearbeitungs Framework und noch andere sehr brauchbare Dinge
• flash-fmp.de :AS 1 und 2- Filter Managing Prototyp Klassen
• Twease :AS2- datenschlanke Tweening Engine für Werbebanner und Komponenten
• Fuse AS Animations- und Filter Bibliothek
• robertpenner.com :AS1 und 2 - Easing Animations Klassen für Abbremsen und Beschleunigung
• Animation Package :AS 2 und 3 - Animations Bibliothek
• tweener :AS2 und 3 - Bibliothek für Tweenings

Interaktionsklassen:

• aswing.org :AS 2 und 3 - Bibliothek für RIA GUIs
• Yahoo! ASTRA :AS3 - Bibliothek für RIA GUIs
• betriebsraum.de :AS 2 -Klassen für Menüleisten, Statusboxen, Browser- Usability usw.
• flare :AS3 - API für interaktive Informationsvisualisierung

Datenkommunikation:

• wiiflash.org :AS3- API für Wiimote und FLash
• swxformat.org :AS2- Datenformat API für eine Art Flashremoting mit PHP (besonders gut geeignet für Mobile Endgeräte - Flash Lite)
• amfphp.org :AS2- Flash Remoting API mit PHP
• AMF.NET :AS2- Flash Remoting API mit .NET
• Flashinterface :AS 2 und 3 - Kommunikation zwischen der AS Virtual Machine 1 und 2
• Xpath4as2 :AS2 - Bibliothek für X-Path Funktionalität
• Fzip :AS3- Klasse für Zip Daten Bearbeitung
• SMTP Mailing :AS3- Klasse für Email-Funktionalität
• JPEGencoder :AS3 - Speichern von .jpgs nur mittels Flash
• PNGencoder :AS3 - Speichern von .pngs nur mittels Flash

Generell findet man immer wieder sehr interessante Projekte auf der osflash.org Seite, sowie auf der Seite actionscriptclasses.com gibt es desöfteren einen kleineren Helferlein ;-).

-- UPDATE 27.09.2007 --
Auf Google Code Project kann man eine ausführliche Auflistung vieler ActionScripts APIs und Bibs bekommen, ähnlich wie bei OSFlash. Dank an dieser Stelle an Simon Schweizer, der mich darauf aufmerskam gemacht hat!

Sowie in der objektorientierten Programmierung gibt es auch im Interaktionsdesign für immer wieder auftretende Prozesse sogenannte Design Patterns. Diese Patterns beschreiben für bestimmte Prozesse eine oder mehrere passende Musterlösungen. Diese Musterlösungen können bei komplexeren Interaktionsprozessen miteinander kombiniert werden. Auf welie.com gibt es eine sehr gute Übersicht der Usability Design Patterns für den Bereich Web, Desktop-Anwendungen usw. Schaut mal rein, wenn ihr die Usability eurer Seite verbessern oder ein Usability Problem lösen wollt. Bei Problemen mit Fachbegriffen im Interaktionsdesign hilft euch die Interaktiondesign Enzyklopädie von Interaction-Design.org weiter. Damit aber nicht genug mit der Informationsflut, denn weitere Infos zum Thema Mensch-Maschinen Kommunikation gibt es noch in einem speziellen HCI-Mag der ACM-Crew 😉

Eine Art von Usabililty ist auch im non-interactiven Grafikbereich vorhanden. Kennt ihr es, wenn ihr ein Buch lest und auf eine Skizze verwiesen wird, die zwei Seiten vorher war. Oder wenn man auf seinen Bildschirm sehr viele aneinander gereihte Wörter lesen muss. Was ich aber viel schlimmer finde, sind schlecht aufbereitete Grafiken, die einem einen komplexen Sachverhalt erklären sollen. In unserer heutigen Fülle an Daten reichen einfach die bewährten Graphenmodelle zur Repräsentierung nicht mehr aus. Genau um diese Problematik kümmert sich der immer mehr aufblühende Informationsdesign Bereich. Denn gerade die Hauptaufgabe eines Informationsdesigner ist es komplizierte Sachverhalte in einem einfachen visuellen Kontext zu repräsentieren. In dieser Sache kann ich euch die Seite infosthetics.com sehr empfehlen. Manche experimentalen Visualisierungstechniken im Informationsdesign erinnern mich doch sehr an einige Experimente aus der Processing Szene. Hm, da gibt es doch bestimmt einen Zusammenhang...

-- UPDATE 14.04.2007 --
Ich hab einen schönen Bericht zum Thema Schönheit der Datenvisualisierung gefunden mit ein paar sehr interessanten Links.

-- UPDATE 24.01.2008 --
Die Seite UI-patterns.com liefert eine nette Übersicht über User Interface Design Patterns und bietet darüber hinaus noch mehr Infos (ein Wiki usw.) zum Thema User Interface an.

-- UPDATE 12.9.2008 --
Die Uni Basel hat ein Portal mit dem Namen interaction-patterns.org veröffentlicht. Sieht auf den ersten Blick ganz nett aus. Hoffe es entwickelt sich noch weiter!

Wer kennt es nicht, ein Kunde möchte auf seiner Homepage eine Anfahrtskizze zu seiner Firma haben. Weil aber das Nachzeichnen der Strasse von einer eingescannten Karte so unglaublich aufregend ist, gibt es jetzt eine neue Möglichkeit die Anfahrtskizze wirklich aufregend zu gestalten. So kann man jetzt z.B. die Karten von Google Maps auf seiner Homepage einbinden und dort die verschiedenen Anfahrtswege mit Hilfe der Google Maps API markieren. Diese Makierungen können wiederum mit kleinen Texte versehen werden, die dem Kunden die Anfahrt zur Firma immens erleichten können. Jetzt hat man aber nicht nur eine Karte mit einer Anfahrtsskizze und zusätzlichen Infos, nein, der Webbesucher kann jetzt sogar mit der Karte interagieren (rauszoomen, Karte verschieben, auf Hotpoints klicken usw.). Durch das Eingreifen in die Kartendarstellung kann sich der Website Besucher viel besser orientieren und bekommt dadurch einen wichtigen Informationsmehrwert gegenüber der üblichen Anfahrtsskizze geliefert. An diesem Beispiel kann man gut sehen, dass die neuen Web-APIs auf jeden Fall sinnvoll zu gebrauchen sind und nicht nur als Spielerei abgetan werden können. Deshalb sind diese WEB-APIs, Web-Services und Mash-Ups die absoluten Leckereien für den Web-Development Bereich, denn man kann mit wenig Aufwand grosse Funktionalität (und auch Content) liefern, wie sie vor 3-5 Jahren noch nicht möglich waren. Einen Zugriff auf diese WEB-APIs erhält man meistens über diverse JavaScript- und Ajax Klassen. Desweiteren unterstützen die meisten serviceanbieter noch die üblichen Web-Service Standards WSDL und SOAP (Web-Services kann man sich als entfernte Methoden Aufrufe mit Hilfe von XML verstehen) . Bei den großen Playern im Webbereich gehören solche Web-APIs und Web-Services mittlerweile schon zum Standard. Hier eine kleine Auflistung der API und Web-Service Bereiche der grossen Web-Player:

• Google APIs (z.B. Google Ajax API)
• Yahoo APIs (Yahoo Maps / Yahoo Flash API / Yahoo PHP API)
• Ebay API
• Amazon API
• Map24 API

Besonders im WEB 2.0 Bereich gehören die APIs zum guten Ruf bzw. zum Pflichtprogramm. Deshalb hier einige APIs der großen Web 2.0 Player

• YouTube API
• Flickr API
• del.icio.us
• facebook

Die Liste müsste jetzt eigentlich noch viel viel weiter gehen, aber zum Glück gibt es schon Websiten, die das mit Bravour erledigt haben. Auf den folgenden 3 Portalen solltet ihr euren gesuchten Service finden.

• xmethods.net (Auflistung von Web-Services)
• mashupfeed.com (Auflistung von Mash-Ups)
• programmableweb.com (Auflistung von Web-APIs)

Wie mit Allem hören sich auch hier die Leckereien auf dem ersten Blick super an. Doch damit der Schuss nicht nach hinten losgeht, gibt es vor der Verwendung solcher Services einige Dinge zu beachten. Die Nutzungsbedingungen werden in der Regel immer schnell (ohne Lesen 😉 ) akzeptiert, doch in unserem Fall, sollte man sich diese gut anschauen. Denn bei einem Verstoss gegen die Nutzungsbedingungen könnte es schnell zu einer (gerichtlichen) Abmahnung kommen, das kann im schlimmsten Fall eine schöne Geldsrafe sein, was wiederum das Projektbudget belastet. Ein weiterer Punkt ist die Seriösität des Serviceanbieters. Ein seriöser Serviceanbieter liefert auf jeden Fall immer valide Daten, seine Services sind zu jeder Zeit verfügbar und er liefert einen guten Support (Dokumentation) seiner Services. Der Support sollte unter anderem unbedingt dem Website-Developer bei Änderungen des jeweiligen Services benachrichtigen. Denn eine Veränderung des Services (oder API) kann eine Änderung des Programmcodes innerhalb der Website erzwingen. All diese Punkte sollte der Website-Developer unbedingt bei einer Einbindung solcher Services in seiner Website Produktion beachten. Tut er/sie das, dann sollte ein einwandfreier Betrieb der nextGeneration Website kein Problem mehr sein.

-- UPDATE 26.03.2007 --
Ein super Beispiel für den Einsatz von Webservices ist die Web-Anwendung netvibes.com. Desweiteren kann ich euch noch ein PHP und WebService Tutorial empfehlen, sowie den Online Artikel XML-RPC und PHP vom XML Magazin.

-- UPDATE 9.05.2007 --
Ich bin mal wieder auf interessante Links gestossen. Auf webservicex.net sind einige nützliche Web Services aufgezählt, wie z.B. validieren einer Kreditkartenummer oder Einheitenumrechner. Wenn es euch an Content fehlt, könnten evtl. der xml-feed.de und / oder der rss-scout.de weiterhelfen.

Ich hab es in meinem Blogeintrag Täglich Brot des Web Developers schon leicht angedeutet, dass sich ein Wandel im Web-Development Bereich andeutet. Die immer grösser werdende Zahl an Webframeworks, Web-Librarys, Web Services / Web-APIS und Mash-Ups sprechen für sich. Jedoch war ich vor einigen Tagen noch ein bissl skeptisch, als ich mich mit Studienkollegen über diesen bevorstehenden Wandel unterhalten habe. Diese Skepsis verschwand aber zum grossen Teil durch das Erscheinen der Nachricht, dass der Friends of ED Verlag demnächst ein Buch veröffenltichen wird mit dem Titel Web Development Solutions: Ajax, APIs, Libraries, and Hosted Services Made Easy. Diese Bucherscheinung spricht wiederum für die Aufsplittung der Web-Developer Gemeinde in Web-Framework-, Web-Service-, Mash-UP Developer und in Website-Developer. Die eine Gruppe (die Programmierer) sieht das Web als technische Herausforderung und will alles Mögliche machbar machen. Die andere Gruppe (Website-Developer) nutzt die daraus entstehenden Techniken um ihre kreativen Visionen umzusetzen.

Die Gruppe der Website Developer wird sich meiner Meinung nach in Zukunft aus Webdesignern und den grafischen Programmierern (z.B. Medieninformatiker, Fachinformatiker usw.) zusammensetzen. Sie haben ausreichend Programmier-Know-How um die Frameworks, Web-APIs und Mash-Ups anzuwenden. Diese Ansicht mag auf dem ersten Blick wie eine Degradierung innerhalb der Web-Developer Gemeinde aussehen (weil sie vielleicht nicht so gut programmieren können, wie die andere Gruppe). Aber dem ist nicht so! Denn diese Gruppe wird in Zukunft mehr Zeit für das Grafische und Interaktive Design einer Website haben, was wiederum den Designprozess (besteht unterem anderm auch aus dem kreativen Zusammenspiel der verschiedenen Technologien) von Websiten weiter voran treiben wird. Von diesem Designprozess wird in Zukunft der Erfolg einer Website massgeblich abhängen. Also schlussendlich überhaupt keine Degradierung(!), sondern mehr Freiheit und Zeit für Qualitätsdesign!

Die andere Gruppe (Web-Framework-, Web-Service- und Mash-UP Developer) werden Zuwachs aus dem Bereich Software Entwicklung und Produktionbekommen. Denn die Entwicklung komplizierter Webanwendungen (wie z.B. Google Maps) und WebFrameworks erfordert sehr gute Kenntnisse in den Bereichen Programmierung, Netzwerktechnik / Netzwerkprotokolle und Softwarearchitektur. Für diese Gruppe ist objektorientierte Programmierung und Design Patterns auch keine Krankheit, sondern das perfekte Tool für die Erstellung skalierbarer und erweiterbarer Anwendungen/Frameworks. Daher denke ich, das ein Teil der Allgemeinen Informatiker, Computer Networking Programmierer und Medieninformatiker (GUI Programmierung) für diese Aufgaben genau die Richtigen sind.

Im Allgemeinen kann man es so sehen, die Einen stellen Tools zu Verfügung und die anderen nutzen diese. Die einen haben haben Spass am Kreativen Prozess, die anderen wollen das allerbeste aus einer bestehenden Technik rausholen. Auf jeden Fall werden diese beiden verschiedenen Motivationen das Web in Zukunft einen großen Schritt weiterbringen, denn sie ergänzen sich nahezu perfekt. Es besteht jetzt nur noch die Frage, zu welcher Gruppe man selbst gehört...

... Vielleicht geben euch die 37 Fragen, die ein Web-Developer beantworten können sollte von design.principles eine kleine Hilfestellung 😉

Im Rahmen meiner Fachschaftstätigkeit wurde ich beauftragt eine Liste von Zeitschriften zu erstellen, die den kompletten Anwendungsbereich eines Medieninformatiker und Online Medianer abdeckt. Da diese Auflistung für den ein oder anderen interessant sein könnte, möchte ich sie keinen vorenthalten. Für den Bereich Werbung, Design, Animation und Post Production gehen an den Start die deutschen Zeitschriften Digital Production (hauptsächlich 3D und Post Production) und die PAGE (Werbung, Design und ein bissl Medienproduktion). Aus dem englischen Raum kommen die nicht ganz so billigen Zeitschriften Computer Arts Project, Computer Arts und 3D World in Frage. Den fließenden Übergang vom designlastigen zum programmierlastigen bildet das deutsche RIA und Multimedia Entwicklungsmag Visual X, das sich stark mit der grafischen (Web)Programmierung beschäftigt. Nun wo wir jetzt beim Programmieren angelangt sind gibt es einige sehr gute technologiebasierte Mags, deren Titel so aussagekräftig sind, dass sie keine nähere Erläuterung benötigen.

• Entwickler Magazin (Allgemein und Webentwicklung)
• Java Magazin (Java Frameworks und Web-Anwendungen)
• Eclipse Magazin (unter anderem PlugIn Programmierung)
• XML & Webservice Magazin
• PHP Magazin
• Internet Professional (Allgemeines zum Web)

Und zu guter Letzt für die Game Developer unter uns das amerikanische Game Developer Magazine, das den Wissensdurst rund um die Spiele Entwicklung ein bissl stillen sollte.
Wem das noch nicht genug ist und sich noch ein bissl Insparation holen will (oder um einfach von dem fachspezifischen Gedankengut mal wegzukommen), sollte sich hin und wieder einige Magazine, wie z.B. die Art (für Design), den Kameramann und die Schnitt für den Filmbereich oder Brand eins (fürs Management), zu Gemüte führen.

Ich denke die erwähnten Magazine decken den Digitalen Medien Markt bis auf den Mobilen Bereich ziemlich gut ab. Leider kenne ich mich im mobilen Bereich nicht sehr gut aus und habe somit leider kein brauchbares Magazine für den Mobile Developer gefunden. Falls einer von euch ein gutes Mag kennt, bitte schreibt mich an. Ich bin für jeden Tipp dankbar. Vielen Dank!

-- UPDATE 22.07.2007 --
Neulich bei meinem Streifzug bin ich über zwei neue Zeitschriften gestossen, die für den Media Producer sehr interessant sind. Die Zeitschrift Medienwirtschaft für Managementthemen in den Medien und die Zeitschrift Form f¨r den Designbereich.

-- UPDATE 2.06.2008 --
Mir sind zwei weitere Zeitschriften über den Weg gelaufen, die in Sachen Interaktion sehr interessant sein könnten:
Make Magazine
ACM Interaction

Ja jetzt ist der letzte Blogeintrag schon fast 3 Wochen her. Grund daf&uumlr war ne tolle Erkältungs-Grippe und ein bissl Magenkram. Das hat mich ganz schön umgehauen, aber jetzt bin ich wieder fit und hab die letzten 2 Wochen dafür genutzt um derhess.de bissl mehr dem Web 2.0 Flavour anzupassen. Vielleicht hats der ein oder andere schon bemerkt. Die Blog und Newseinträge gibt es nun auch als RSS FEED.

derhess.de Blog-RSS Feed
derhess.de News-RSS Feed

Weiter hinzukommen ist die eigentlich obligatorische Kommentarfunktion für meinem Blog. Ich freu mich über jedes Feedback! 🙂

Desweitern habe ich auf meine Videos positives Feedback bekommen (Yeahh!), nur wurde die fehlende Steuerung der Videos bemängelt. Und ich muss zugeben zurecht! Deswegen gibt es jetzt eine Steuerung der Videos. Diese erscheint wenn ihr mit der Maus über das Videobild fahrt oder ihr benutzt einfach mit Rechtsklick der Maus das Kontextmenü.

Der Demobereich ist in den Sparten Programmierung und Flashprogrammierung um jeweils einem Item reicher geworden. Einmal ein Java 3D Spiel, welches im Rahmen meines Studiums entstanden ist und eine Anlehnung an Whack the Worm sein soll. Ganz so zufrieden bin ich mit dem Ergebnis nicht wirklich, aber was solls, hauptsache es macht Spass. Im Flashbereich habe ich meinen Flash Video XML Player hochgeladen. Die FLV-File Verwaltung erfolgt wie der Player es schon sagt über das XML-Format. Wenn ihr Lust habt schauts euch mal an, vielleicht taugst euch ja was.
In den nächsten Tagen werde ich dann auch mal wieder einen brauchbaren Blogeintrag schreiben, bis denne!

Mittlerweile werden die Anforderungen an einem Web-Developer immer höher. Denn bei dem einen Auftrag soll etwas für den Endkunde erstellt werden und das andere Mal eine aufwendige Web-Anwendung. Öfters muss man dann schon mal gelöste Probleme bearbeiten, die man aber vorher nicht ganz so gut auf Wiederverwendbarkeit optimiert hat. Und genau an diesem Punkt ist bei mir persönlich der Frust am grössten. Warum soll man sich nochmal mit schon gelösten Problem rumschlagen, fast totale Zeitverschwendung. Aber zum Glück gibt es ehrgeizige und nette Leute da draussen im Web, die sich an die Befriedigung der unterschiedlichsten Bedürfnisse der Web-Developer heran gewagt haben. Herausgekommen sind einige Web-Libraries zu den verschiedensten Web-Technlogien (wie z.B. JavaScript, PHP usw.). Auf cameronolthuis.com gibt es eine sehr gute Aufzählung der TOP 10 Web-Libraries (dazu gehören z.B. die PHP PEAR Library, Moo.fx, Dynamic Drive CSS Library usw.), der ich nichts mehr hinzufügen kann, ausser der Ajax Framework Übersicht von ajax-info.de. Persönlich denke ich, wird sich eine Einarbeitung in die diversen Web-Frameworks auf lange Sicht auf jeden Fall lohnen, da diese den technischen Produktionsablauf erheblich unterstützen können. Auch wenn es Anfangs durch den Mehraufwand (Einarbeitung in das Framework) nicht sofort erkennbar wird.
Allerdings sollte man noch die Nutzungsbedingungen der Frameworks sehr gut kennen um nicht im Nachhinein teure Strafen für Nutzungsverstösse zahlen zu müssen. (Und es wäre auch noch sehr schade um die investierte Zeit für die Einarbeitung).

Für kleinere Probleme benötige man jedoch keine großen Web-Frameworks, sondern nur eine Plattform, die einem schnell die gesuchte Information anbietet oder einem einfach nur an die gewünschte Information im Web weiterleitet. Eine mögliche Hilfestellung dafür bietet die gotapi.com Seite. Das Team von gotapi.com hat sich zum Ziel gesetzt, soviele Dokumentation von Web-Frameworks auf ihr Seite zu vereinen wie möglich. Herausgekommen ist ein Monsternachschlagewerk für Web-Frameworks. Wird man in den Dokumentationen nicht fündig und die Suche nach den kleinen Kniffen geht weiter, dann kann ich euch das webbasierte Webdeveloper Handbook 2.0 von alvit.de empfehlen. Eine super Linkliste mit den besten Blogs und Portalen zum Thema Web-Development. Ich denke mit diesen 2 Links kommt auf jeden Fall bei der Lösungssuche weiter.

Das Design spielt auch bei uns Web-Developer eine nicht unwichtige Rolle und da ich mir persönlich nach dem Programmieren damit manchmal ein bissl schwer tue, haben sich bei mir 3 Web-Tools als Hilfestellung bewährt. Zum Einen verwende ich für das Abstimmen der Website Farben den ColorBlender als Inspirationshilfe. Denn der ColorBlender kann aus vorgebenen Farben eine 6farbige Farbpalette generieren, die sich dann auch noch in Photoshop oder als HTML Code exportieren lassen. Ein super Tool für die harmonische Farbgestaltung einer Website.
Das Typografie Problem im Web umgehe ich meistens mit den Typetester Tool von Marco Dugonjic. Bei diesem Tool kann man die meist genutzten Fonts im Web mit Hilfe von DropDown-Menüs formatieren. Diese Formatierungseinstellungen werden dann in verschiedenen Kombinationen angezeigt. Ist das gewünschte Ergebnis erreicht, können diese Font-Einstellungen als CSS-Code abgespeichert werden und für die eigene Website verwendet werden.
Zum Überprüfen von Website-Layouts verwende ich unter anderem das Tool Feng Gui (danke an Kjell für den Tipp!). Dieses Tool analysiert das Website-Layout nach Hotpoints unserer visuellen Aufmerksamkeit. Als Orientierungshilfe in Sachen Layout ist das Ergebnis sehr hilfreich.

Ich denke das reicht fasst aus als tägliches Brot eines Web Developers, die Leckereien gibt es ein anderes Mal 😉

-- UPDATE 7.06.2007 --
Ein nettes CSS Framework mit dem Kürzel YAMLsoll den Web-Designer beim Erstellen von mehrspaltigen Layouts unterstützen. Desweiteren gibt es auch schon Erweiterungen für die CMS-Systeme TYPO 3, Joomla, Papoo CMS usw., auch die Blogengine WordPress sowie die OnlineShopEngine xt-Commerce unterstützen YAML

-- UPDATE 24.05.2008 --
Eine nette Auflistung von 30 Websiten, die man als Web Developer kennen sollte.

Lange Zeit konnte man bei Flash nur auf die Interaktionsmöglichkeiten mit der Maus und der Tastatur zugreifen. Jetzt wo Flash bzw. ActionScript immer erwachsener wird, kommen ganz neue Interaktionsmöglichkeiten dazu, die dem Flashentwickler in Hinsicht auf das Interaction Design ganz neue Möglichkeiten bieten.

So kann man z.B. über ActionScript einige Sensoren (für Bewegung, Wärme usw.) ansprechen und auf deren gelieferten Werte reagieren. Makingthings.com und arduino.cc bieten diese Sensoren Baukästen mit dazugehörigen Treibern/APIs an. Beide Anwender benutzen das gleiche Hardwareprinzip. Es gibt eine Hauptplatine - ähnlich einem Motherboard - auf der dann die diversen Sensoren drauf gesteckt werden können. Die Daten werden dann von der Hauptplatine per USB an den Rechner geliefert. Durch die mitgelieferten APIs und Treiber können die Daten relativ einfach abgefangen und verarbeitet werden. Damit der Einstieg dann weiterhin so einfach wie möglich ist, bietet makingthings.com einen sehr guten Tutorialbereich an, in dem sicher fast all eure anfänglichen Fragen beantwortet werden können.

Desweitern hat es Thibault Timbert von bytearray.org geschafft Motion Capture Daten in Flash einzulesen und diese im 3D Raum sinnvoll zu visualisieren. Von dem Ergebnis war ich super überrascht, da ich bisher dachte, das wäre nur mit teuren 3D-Animationsprogrammen (wie z.B. Maya, Softimage usw.) möglich. Ich bin mal gespannt welche neuen Anwendungsgebiete sich daraus ergeben.

Für die bisher vorgestellten Möglichkeiten muss man jedoch ein bissl tiefer in die Tasche greifen und da man das nicht von jedem verlangen kann, kommen wir jetzt zu etwas einfachern und schon bekannten Interaktionstechniken der Spielekonsolen. Flash Spiele können seit jüngster Zeit mit den bekannten Kontroller der Playstation und der Wii-Konsole gesteuert werden. Joa Ebert entwickelte erfolgreich eine Kommunikation zwischen Flash und dem Wii-Controller mit Hilfe eines Socket Servers. In seinem Blog könnt ihr mehr über sein Vorgehen lesen. Auch Thibault Timbert war in dieser Richtung aktiv und entwickelte in ActionScript 3 eine Kommunikation zwischen einem analogen Gamecontroller und der Flash Technologie. Mit welchen Mitteln er diese Kommunikation erfolgreich entwickelte, könnt ihr auch in diese Fall wieder in seinem Blog nachlesen.

Zum Ende dieses Blogeintrages möchte ich euch noch auf die bildbasierte Interaktion per Webcam aufmerksam machen. In meinem Blog habe ich über dieses Thema schon einige Einträge verfasst. Deshalb hier nur 2 Verweise auf die wichtigsten Blogeinträgen:
Grundsätzliches zu Webcam Games und die kleine Linksammlung zur Webcam Interaktion.

-- UPDATE 21.03.2007 --
Die Seite wiiflash.org widmet sich ganz dem Thema des Wii Controllers in Kombination mit der Flash Technologie

-- UPDATE 16.02.2008 --
Für die Entwicklung von hardware- bzw. sensorenbasierten Interaktion hat der O Reilly Verlag ein interessantes Buch mit dem Titel Making Things Talk: Practical Methods for Connecting Physical Objects herausgebracht. Ich denke das könnte für angehende Interface und Interaction Designer ein sehr interessantes Buch sein...

-- UPDATE 31.03.2008 --
Bin letztens auf die Homepage von Phidgets gestossen. Phidgets bietet Lösungen für USB Sensing und Controlling an, die kompatibel mit ActionScript 3 sind. So kann man jetzt dank Phidget mit RFID-Sensoren arbeiten. ein Blick auf deren Homepage lohnt sich daher auf jeden Fall.

Vorab eine Einführung in die Flash Game Programmierung wäre hier allein aus Platzgründen falsch platziert, deswegen gibt es eine kleine Übersicht, die den Anfänger und den Fortgeschritten Flash Game Developer unter euch helfen soll, seine technischen und umsetzungslastigen Probleme zu lösen. Die genauso wichtige Konzeption (Storyentwicklung, Dramaturgie usw.) von Flash Games lasse ich hier erstmal wegen Mangel an guten Quellen aussen vor. Jetzt aber los...

Ein sehr gutes Tile based Tutorial und perfekt für den Einstieg in die Flash Game Programmierung gibt es von Tonypa. Das Tutorial beschäftigt sich mit dem Aufbau einer Map, Kollisionserkennung, Isometrie und vieles mehr. Wer es dann noch weiter treiben möchte, kommt bei dem Vektoren Tutorial von Tonypa voll auf seine Kosten. Für speziellere Einzelprobleme gibt es auf Flashkit.com massig Games Tutorials, jedoch ist die Seite bissl lahm und unüübersichtlich gestaltet. Die Masse an Tutorials macht das aber wieder gut.

Flash Game Programmierung ist mittlerweile sogar so beliebt, dass es schon extra Entwickler-Portale dafür gibt. Ich kann euch die Portale OutsideOfSociety und das Portal gotoandplay.it bestens empfehlen. Beide Portale bieten Tutorials, Artikel (zum Beispiel zum Thema Game Design-Patterns) und Spielereviews an. gotoandplay.it widmet sich dagegen noch dem Thema Multiuser Spiele und bietet sogar einen MultiUser Game Server für Flash Spiele an(!). Im Forum von kirupa.com kann man mit anderen Flash Game Entwicklern diskutieren und Probleme lösen.

Da man das Rad auch in der Flash Game Programmierung nicht immer neu erfinden muss, haben sich einige sehr ehrgeizige Game Developer zusammengetan und einige Tools entwickelt. Für die ActionScript 3 Flash Game Entwicklung geht die Physik Engine von Flashfisix.com und die 3D-Engine von PaperVision3D ins Rennen. Beide Tools lassen es ordentlich rocken und leuten eine neue Ära im Flash Spiele Bereich ein. Für ActionScript 2 Flash Games entwickelte Andre Michelle (einer DER Flash Game Entwickler) ein Gamepackage, welches die Gameentwicklung bei den Spieletechniken Tilemap, mode7 und Raycasting massiv unterstützen soll. Jedoch finde ich das Gamepackage nicht mehr zum Download, vielleicht werdet ihr besser fündig.

Wenn die oben genannten Links euch nicht weiterhelfen oder ihr nicht mit ActionScript programmieren wollt, dann schaut mal hier rein www.gamedev.net.

--- UPDATE --- 3.2.2007

Eine sehr gute Linkliste zur Flash Game Programmierung gibt es auf FLAshot und zum Thema Formbasierte Kollision gibt es im GSKinner Blog einen sehr guten Eintrag.

--- UPDATE --- 13.4.2007
Leider ist ja ein Spiel ohne schöne Grafik ein bissl langweilig. Auf der Flashforum Seite gibt zwei sehr nützliche Forumthreads, die euch bei diesen Problem helfen können. Thread 1 beinhaltet einige gute Links, wie man Tile und Sprite Grafiken selbst erstellen kann. Thread 2 verweist dagegen auf einige sehr umfangreiche Sprite und Tile Grafik Bibliotheken. Also nur hin wenn man grafikfaul ist 😉

-- UPDATE 3.06.2007 --
AS3 Data Structures For Game Developers is a package containing common data structures useful for game programming and application development. The project was started because Michael Baczynski wanted a unified library which he could reuse in his games.

-- UPDATE 24.06.2007 --
APE (Actionscript Physics Engine) ist eine kostenlose AS3 open source 2D Physik Engine für Flash und Flex. Programmiert hat das Ganze Alec Cove. Auf seiner Seite gibt es sogar eine Portierung seiner Engine auf Java

-- UPDATE 18.08.2007 --
Auf dem Flash Game Development Blog H1DD3N.R350URC3 bin ich auf zwei interessante Projekte gestossen. Ein Wiki für Flash Game Development und ein ActionScript 3 Framework mit dem Namen hexagon für Game Developer. Schaut mal rein!

Bei meinem Lightwriter Experiment kann man mit Hilfe einer Taschenlampe in Echtzeit im Webcambild malen. Inspiration fand ich in der Lightgraffiti Szene, besonders der Clip The past of pikapika und der TV-Beitrag zum Thema Lichtgraffiti von Tracks haben mir es sehr angetan. Während der Entwicklung meines Lightwriters schockte mich die neue Apple I-Pod NanoWerbung sehr, denn sie deckt sich fast komplett mit meiner Grundidee. SHIT! Aber ich hab trotzdem weiter gemacht und erzähl euch jetzt was zur Umsetzung in Flash.

Als erstes versuchte ich die hellen Pixel (es gibt einen frei wählbaren Helligkeits Grenzwert) im Videobild herauszufiltern und diese dann in einer übergelagerten Bitmap Instanz genau an der gleichen Stelle zu kopieren. Für das Herausrechnen der Farbinformationen (splitten in den RGB Kanal) aus den jeweiligen Pixel half mir das Tutorial Bitweise Operatoren von Grant Skinner sehr, jedoch waren die 76800 Helligkeitsberechnungen pro Frame (Auflösung von 320x240 px) für jeden Pixel zu viel für Flash. Ich versuchte nun die Helligkeitsfläche der Taschenlampe zu tracken. Um das zu erreichen, versuchte ich das Bild mit Hilfe von Transformation Matrizen so zu verändern, dass es nur noch die hellen Bereiche anzeigt. Ich erreichte nach längeren Probieren ein ausreichendes Ergebnis, jedoch funktionierte dies nur bei mir zuhause, denn bei anderen Webcams mit anderen Lichtverhältnissen und Hintergründen muss der Filter wieder neu justiert werden. Eine dynamische Justierung wäre aber viel zu aufwendig gewesen. Gefrustet von den bisherigen Ergebnissen durchstöberte ich nochmal die ActionScript Doku und stiess auf die Hilfreiche Funktion Bitmap.getColorBoundsRect(). Diese Funktion sucht im Bild nach einem von mir angegebenen Farbwert und liefert mir ein Rechteck mit Positionsangabe zurück. Diese Funktion liess ich nach weissen Pixeln im Bild suchen. Und siehe da, das zurückgelieferte Ergebnis stimmte mit der Position der Taschenlampe im Webcambild überein. Mit diesen Ergebnis konnte ich sehr gut leben. Nun musste ich nur noch dem Rechteck einen Offset zugeben um die runden Ecken der Taschenlampe zu erhalten. Da sich das Licht am Rand der Taschenlampe abschwächt und einen anderen Farbwert bekommt, überprüfte ich wieder die Pixel nach ihrer Helligkeit. Denn der Farbwert am Rand der Taschenlampe macht die Lichtspielerei erst wirklich interessant. Dieses Verfahren funktioniert einwandfrei, wenn man nicht direkt in die Webcam rein leuchtet. Falls das doch passiert, fängt der Flash Player an tierisch zu rechnen, weil das TrackingRechteck massiv grösser wird und dadurch die Anzahl der Pixel im Offsetbereich massiv zunehmen. Da die Helligkeitsberechnungen im Offset Bereich auch noch sehr rechenintensiv sind, habe ich eine weitere Funktion eingebaut. Ich berechne die Mitte des erhaltenen Rechteck und fange an Linien mit der Funktionlineto() zu malen. Die daraus entstandene Ergebnisse brachten mich wieder auf weitere Ideen, wie z.B. das man bestimmte Symbole malt und diese vom Flash Player erkannt werden und dieser führt dann bestimmte Aktionen durch (zum Beispiel Video starten, nächsten Clip laden usw.). Ich finde die Idee sehr praktisch in Hinsicht auf einfache Interaktionen im Wohnzimmer mit dem Fernseher. Beim dynamischen Malen könnte man ein 2 Player PingPong Webcamspiel (spielbar über Internet) entwickeln...

Aber leider muss ich noch gestehen, dass mein Lightwriter bei mehr als zwei Lichtquellen nicht mehr unbedingt stablil läuft. Denn durch die zwei hellen Bereiche im Bild wird das Trackingergebnis stark verfälscht. Bei manchen Webcams findet die Funktion Bitmap.getColorBoundsRect() sogar keine wirklich weissen Bereiche der Taschenlampe und liefert somit kein Trackingergebnis. Um diese Schwächen zu beseitigen, muss ich mir wohl doch noch ein eigenes Trackingverfahren in Flash schreiben. Einen ersten Ansatz hab ich auch schon, aber ich muss ihn erstmal auf seine Tauglichkeit überprüfen.

Aber jetzt genug und testet selbst meine erste Version des Lightwriters

Sourcecode des Lightwriter

-- UPDATE 11.03.2007 --
Eine ähnliche Anwendung, wie mein Lightwriter entwickelten die Jungs vom Graffiti Research Lab. Bei ihrem sogenannten L.A.S.E.R. Tag kann man mit Hilfe eines Laserpointers und einem mega starken Beamer ein Haus mit Licht betaggen. Geile Umsetzung, einfach eine geile Sache! Es lebe der Digital Media Punk!

-- UPDATE 16.04.2007 --
Es gibt eine neue Version des Webcam Lightwriters