Archive

Posts Tagged ‘Interaction’

Büchersumpf für den Winter 08/09

November 1st, 2008 No comments

comimag dataflow gamearchitect

Der Sommer ist vorbei und die damit verbundenen Grillsessions am Fluss oder See oder andere tolle Sachen, die man draussen so anstellen kann, gehören somit der Vergangenheit an. Dazu kommt dann noch die ach so tolle frühe Dunkelheit und die schöne (Nass)Kälte, die mir persönlich so gut gefällt, dass ich mich meistens gerne abends ins Bett verziehe. Wer sich dabei langeweilt, dem kann ich nur empfehlen zum alten Printmedium Buch zurück zugreifen. Aus diesem Grund ein Blogeintrag die drohende Langeweile und Inaktivität im Winter für neue Inspirationen und Ideenentwicklungen zu nutzen. Die hier aufgelisteten Bücher aus den Disziplinen Generative Grafik, Informationsverarbeitung und Game Development können einem dabei gut unterstützen...

Generative Grafik oder Kunst

Rund um Informationsverarbeitung

Physical Computing

Game Development

Interessantes Neues für Medieninformatiker

September 27th, 2008 2 comments

sandscape levelhead structuresynth

Vor wenigen Wochen besuchte ich die Ars Electronica in Linz, eins der grössten Medienkunstfestivals in Europa, wo die Symbiose aus Wissenschaft und Kunst Vordergrund steht. Ich bin mit vielen guten Impressionen nach Fribourg zurückgekehrt und werde ein paar für Medieninformatiker interessante Projekte vorstellen. Zudem liegt mein letzter Blogeintrag, wo ich einige interessante Medienprojekte vorgestellt habe relativ lange zurück, so dass sich da auch einige tolle neue Projekte in meiner Linkliste angesammelt haben. Los gehts:

Projects in Interaction

SAMPLINGPLONG
Bei dieser Medieninstallation von Jörg Niehage kann man mit Hand eines projezierten Mauscursors im realen physikalischen Raum Gegenstände ausführen. Sehr nette Idee Mauszeigermetapher raus aus der virtuellen Welt in die physikalische Welt zu holen.

Mehr Infos unter:
Projekthomepage
Video

Sandscape Version 2
Sandscape ist eine haptisches Mensch-Maschine Schnittstelle für ein besseres Verständnis und Design von Landschaften, was mit Hilfe eines Art Sandkasten erreicht wird.

Mehr Infos unter:
Projekthomepage
ACM Artikel

BLUI: Low-cost Localized Blowable User Interfaces
Steuerung eines Mauszeiges per Luft bzw. durch blasen. Eine interessante berührungslose Interaktionsschnittstelle, welche für Menschen mit Behinderungen (z.B. Querschnittslähmung ab Hals) eine alternative Bedienungsmöglichkeit darstellen könnte.

Mehr Infos unter:
cnet Newsmeldung
Paper (PDF)
You Tube Video

Swype (TextInput für Touchscreens)
Der Erfinder Cliff Kushler hat eine neue Eingabemöglichkeit für Touchscreens entwickelt. Man fährt über das Keyboard und das System erkennt aus den dabei getroffenen Buchstaben das richtige Wort.

Mehr Infos unter:
Projekthomepage
Golem Newsmeldung
Informationsquelle

reactable
Sicherlich kennen die Meisten den reactable schon. Meiner Meinung nach ein super Tool für kollaborative elektronische Musik und es hat auf der Ars Electronica einen sehr stabilen Eindruck gemacht.

Mehr Infos unter:
Projekthomepage
You Tube Video
TRACKS Beitrag

Levelhead
Bei Levelhead handelt es sich um ein Augmented-Reality Memory Game. Dieses Game wird mit einen Würfel gesteuert, der an den Seiten mit 2dim Barcodes beklebt ist. Eine Webcam trackt die Bewegung und erstellt den passenden 3D Raum zum jeweiligen BarCode.

Mehr Infos unter:
Projekthomepage
Vimeo Video

interaktives Theater - Tablescape Plus
Tablescape Plus ist ein interaktives Tisch-Video-Theater. Verschiedene Bilder werden auf die winzigen Bildschirmen, die aufrecht auf dem Tisch angebracht sind, projiziert.

Mehr Infos unter:
Projekthomepage
Paper (ACM)
YouTube Video

Phun
Bei Phun handelt es sich um eine kleine feine 2D Physik Engine mit einem sehr netten (Level)Editor

Mehr Infos unter:
Projekthomepage
YouTube Video

generatives Programmieren

Nervous System
Organic and computational designs, which pushes the boundary of computer-based generative Art. The homepage includes some tutorials, too!

Mehr Infos unter:
Projekthomepage
Beispielprojekt
Tutorial

Structure Synth
Structure Synth ist ein Programm für die Erstellung von 3D Strukturen, die sich an ein eingegebenes Regelset vom User bzw. Programmierer orientiert.
Projekthomepage

CityEngine von Procedural
Sehr praktisch für Computer Games und Filmszenen.

Mehr Infos unter:
Firmen Homepage
Videos
Trial Version

Anderes:

Giant video wall
Einfach eine riesige Videowand! Da stellt sich demnächst sicher die Frage, wie sich Motion Design am besten in den urbanen Raum integrieren lässt. Eine Symbiose aus Architektur und (Motion) Graphic Design

Mehr Infos unter:
Informationsquelle
Blogeintrag
YouTube video

Flash Intros bzw. interaktives video
Finde diese beide Beispiele einfach sehr gut gelungen. Super Idee!
de.youtube.com/experiencewii
producten.hema.nl

Weitere interessant Projekte gibts auf dem YouTube Channel iNspIreNewMedia zu sehen. Beispielsweise unter den Playlisten:

Studium: Get a Master in Media

August 31st, 2008 4 comments

interface design potsdam mediainforwth carnegiehci

Das Thema Masterstudiengang beschäftigt mich nach wie vor sehr. Meine ursprüngliche Planung war es nach meinen Bachelorabschluss in Computer Science in Media (deutsch: Medieninformatik) an der Hochschule Furtwangen 1-2 Jahre zu Arbeiten.

In dieser Zeit möchte ich bissl mehr Praxiserfahrung sammeln und ich will erkennen Können in welche Richtung ich mich weiter entwickeln möchte. Denn bei meinem Praxissemester in München trat ein kleiner AHA-Effekt bei mir auf. Denn während der 6 Monaten Anstellung als Kamera- und Tonassistent in der Video- und Filmproduktion merkte ich das dieser Bereich mir beruflich nicht so sehr zusagte, wie ich es mir ursprüglich vorgestellt habe. Und so geschah es, dass ich immer mehr in die Richtung (Web)Programmierung und Interaction Design abdrifftete. Was mir nun nach wie vor sehr viel Spass macht. Deswegen beobachte ich momentan hauptsächlich Master Studiengänge mit Schwerpunkten im Interaktionsbereich, Medienkonzeption und ein bissl Medienwissenschaft. Im Rahmen dieses Blogeintrages werde ich einige Master Studiengänge auflisten, die für mich und auch für andere Medieninformatiker nicht ganz so uninteressant klingen.

Goldsmiths University (London)

Potsdam

Hochschule Augsburg

Hochschule der Künste in Zürich (Schweiz)

Kunstuniversität Linz (Össterreich)

Uni Weimar

HDM Stuttgart

Bremen

University Malmö (Schweden)

RWTH Aachen

FHTW Berlin

University Leiden (Holland)

Carnegie Mellon University + Uni Madeira (USA und Portugal)

Manche, der hier erwähnten Studiengänge in meiner Auflistung sind nicht in Deutschland und sind zum Teil auch nicht gerade billig (siehe Goldsmiths Uni), aber vielleicht liefert gerade diese andere ausländische Sichtweise auf die Medien das besondere Etwas im Ausbildungsportfolio eines Medieninformatiker ;-). Zu dem fehlt der Masterstudiengang in Furtwangen in meiner Liste. Das liegt daran, dass ich einiges in Furtwangen gelernt habe und die Sichtweisen der Professoren zu den Medien mittlerweile gut kennen gelernt habe. Die Erfahrung (mein Hochschulwechsel von der FH Wiesbaden nach Furtwangen im selben Studiengang) hat mir gezeigt, dass solch ein Hochschulwechsel mit einer neuen Lehrbelegschaft und dem damit verbundenen anderen Verständnis von Medieninformatik sehr hilfreich war. Man bekam einen viel umfassenderen Einblick in die Thematik Medien und Informatik. Daher rate ich jedem seinen Masterstudiengang nicht an der selben Hochschule zu absolvieren, wie seinen Bachelor Studiengang. Nun ja das ist wieder meine sehr persönliche Meinung zu diesem Thema. Ich durfte mir auch schon andere gute Meinungen dazu anhören ;). Wie auch immer, falls jemand da draussen im WWW die eine oder andere hier erwähnte Fakultät bzw. Uni kennt, wäre ich um Feedback sehr sehr dankbar!

Literatur: Mobile Application Development

February 27th, 2008 No comments

intellinterface smallscreens flashmobile

Im Rahmen meiner neuen Anstellung als Flash und Interaction Developer beim SWR in Baden-Baden muss ich verschiedene Mobile Anwendung mit Hilfe von Flash erstellen. Da ich leider im mobilen Bereich noch nicht so mega fit bin, musste ich mir erst ein bissl theoretisches Wissen mit Hilfe von Bücherv aneignen. Hier mein kleines Fazit über die gelesene Literatur.

Das intelligente Interface von Jef Raskin
In diesem Buch geht es eher allgemein über die Interaktion zwischen Mensch und Maschine. So werden zum Beispiel von Jef Raskin einige wissenschafltichen Methoden für die Qualitätsmessung von Interaction Designs vorgestellt. Desweiteren werden immer wieder Bedienungsunterschiede zwischen Mac und PC erörtert und miteinander verglichen. Dadurch bekommt man als leser einen sehr guten Einstieg in die Materie des Interaction Design und kann die dabei auftretenden Problematiken sehr gut nachvollziehen. Wer also einen Einstieg ins (wissenschaftliche) Interaction Design sucht ist bei diesem Buch genau richtig.

Don't make me think von Steve Krug
Diese Buch beschäftigt sich hauptsächlich mit dem Thema Web Usability, jedoch lassen sich auch einige Tipps (wie z.B. das Kapitel über das richtige Wording) für andere Bereiche z.B. der GUI-Entwicklung übernehmen. Durch die sehr lockere Schreibweise und die nicht besonders hohe Seitenzahl lässt sich das Buch zudem sehr schön nebenher auf einer längeren Reise durchlesen. Ich kann auch dieses Buch nur empfehlen, die dort vermittelten Informationen bleiben wirklich sehr gut im Kopf kleben und man kann es wegen der einfachen Schreibweise auch an ganz normalen Menschen weitergeben, die sich für das Thema Web Usability ein bissl sensiblisieren wollen.

Nach dem Lesen der etwas allgemeineren Interaction Design Materie bin ich nun zum speziellen Interaction Design für kleine Displays bzw. für mobile Devices gewechselt.

Designing for Small Screens von studio 7.5
Dieses Buch befasst sich ausschliesslich mit dem Thema Screen und Interaction Design für Geräte mit geringer Display Auflösung. Anfangs gibt es eine schöne Einführung in die Entwicklungsgeschichte von Small Screen Devices (Handys, PDAs, GameBoy usw.). Danach folgen grundlegende Themen, wie z.B. die physikalischen Interaktionsmöglichkeiten an mobilen Geräten, empfohlene GUI Elemente für kleine Displays, Designrichtlinien für Text- und Farbgestaltung, und und... Was ich persönlich sehr gute an diesem Buch finde, ist das jedes Kapitel in 3 Abschnitte unterteilt ist. Kapitel A behandelt die Interaction Design Konzepte und Empfehlungen, Kapitel B zeigt die realisierten Konzepte anhand von Produktbeispielen auf und Kapitel C vermittelt dann noch mal einen tieferen (technischen) Hintergrund. Also dieses Buch ist auf jeden Fall Pflicht für jeden Mobile Interaction Designer im Anfangsstadium!

Nach dem ich jetzt viel Interaction Design Krams gelesen hatte, musste sich mein Wissen jetzt unbedingt noch auf der technischen Seite festigen. Hier entschied ich mich für ein Mobile Application Buch mit Fokus auf Flash Lite, da dass Projekt bei meinen Arbeitgeber mit Flash Lite realisiert werden soll.

Flash Applications for Mobile Devices von Richard Leggett
Dieses Buch gab mir einen sehr guten technischen Überblick was mit Flash Lite bis zur Version 2.1 alles möglich ist und worin die Flash Player Unterschiede zur PC Variante liegen. Es deckt sehr viele Bereiche des Mobile Content (Gaming, Informationfsdienste usw.) Development mit Bezug auf Flash auf und gibt zudem immer wieder weitere allgemeine Infomationen zum Mobile Markt. Diese Zusatzinformationen haben mir sehr geholfen den mobilen Bereich besser zu verstehen. Sogar aus technischer Sicht werden dem Leser viele Zusatzinformationen angeboten. So beschreibt der Autor zum Beispiel sehr genau, wie man mit Flash Lite C++ und Python Programme auf dem Handy ausführen kann. Welche Vor- und Nachteile daraus entstehen werden sehr schön erklärt. Also die perfekte technische Einführung für die Entwicklung von Mobilen Anwendung mit Hilfe von Flash Lite. Allerdings vorab, dieses Buch verlangt schon fortgeschrittene ActionScript Kenntnisse vom Leser, sonst wird es kein Spass das Buch zu lesen 😉

Mein Fazit dieser kleinen Recherchephase:
Für das Einarbeiten von Mobilen Anwendungen mit Flash bieten die Bücher Designing for Small Screens und Flash Applications for Mobile Devices genau die richtigen Einstiegshilfen. Die Bücher Das intelligente Interface und Don't make me thing geben einen guten Einstieg ins Interaction Design, sind aber nicht wirklich sehr hilfreich für die Entwicklung mobiler Anwendungen. Daher bei geringer Recherchezeit die anderen 2 Bücher lesen 😉

AS3: Interactive Webcam Package 1.2

December 21st, 2007 16 comments

iacamlogo_web iacamdoku iacamdoku2

Es ist endlich geschafft und auch noch rechtzeitig zu Weihnachten 😉 wurde die Version 1.2 meines Interactive Webcam Packages fertig gestellt. Viel hat sich in der Funktionalität zur Version 1.0 eigentlich nicht getan, ausser dass das Interactive Webcam Package nun komplett auf ActionScript 3 portiert wurde.
Aber der damit verbundene erhebliche Perfomancesprung von ActionScript 2 auf ActionScript 3 und die neuen Open-Source Projekte (wie z.B. Papervision 3D) ermöglichen einige neue interessante Anwendungsfelder für das Interactive Webcam Package. Als kleinen Vorgeschmack und für eine bessere Vorstellung wie solch eine Kombination aussehen könnte, habe ich für euch zwei Videos meiner neuen Webcam Experimente mit hochgeladen, die in Kombination mit der Papervision3D Engine entstanden sind.

Der Sourcecode dieser Experimente liegt in dem zip-File des Interactive Webcam Packages bei, so dass jeder damit ein wenig rumspielen kann. An dieser Stelle möchte ich mich noch bei den Entwickler der Papervision3D Engine,John Grden für das XFighter Modell und Jens Franke für seinen Papervision3D Vortrag und seine Utility Klassen bedanken. Ohne diese hilfreichen Tools hätte ich diese zwei kleinen Experimente auf jeden Fall nicht so schnell realisieren können.

Nochmal kurz zum Aufbau und zur Struktur des neuen Interactive Webcam Packages. Da sich bekanntlich die Flash API Struktur von ActionScript 2 auf ActionScript 3 schon gut verändert hat, musste ich auch ein bissl an der Struktur des Interactive Webcam Packages rumschrauben. Da die Klassen aber nicht so mega umfangreich sind, hat sich eigentlich nur das Eventhandling nennenswert verändert. So dass jetzt alle Events mit der bekannten ActionScript 3 addEventListener() Funktion abgefangen und bearbeitet werden müssen. Aber über solch eine Änderung lacht ja ein eingefleischter AS3 Coder ;-). Für alle anderen offenen Punkten soll die beigelegte Dokumentation des Interactive Webcam Packages für Klärung sorgen. Dabei orientiert sich die Dokumentation an der etablierten Flash Hilfe. Aus diesem Grund sind alle möglichen Klassenmethoden und Attribute erklärt und mit Beispielcodes versehen. Sollte es dennoch Fragen oder Probleme geben, scheut euch nicht mich anzuschreiben oder hier zu posten. Ich werde dann mein Bestes geben.

Nun aber genug von mir, wünsch euch allen frohe Weihnachten und viel Spass beim Flashen im neuen Jahr!


Leseempfehlungen für den November 07

November 29th, 2007 No comments

page1207 designrep1107 phpjou0607

In den letzten 2-3 Woche musste ich einige Zeit auf deutschen Bahnhöfen verbringen, und habe diese Zeit sinnvoll genutzt um in diversen Zeitschriften herum zustöbern. Drei aktuelle Zeitschriftenausgaben haben mich doch sehr überzeugt hier eine Kaufempfehlung auszusprechen.

PAGE 12.2007
Die aktuelle PAGE Ausgabe 12.2007 präsentiert sich in einem etwas neuem Design, welches dem Heft einen aufgeräumten und besser strukturierten Eindruck verleiht (Ich finds gut!). Leider hat mich die Titelstory über Crowdsourcing nicht wirklich vom Hocker gerissen, dagegen haben mir aber die Berichte über Information Design, die kurze Marktübersicht über IPTV Produktionen und der interaktive Medieninstallationsbericht Du bist ein Pixel sehr gut gefallen. Somit ist die aktuelle Ausgabe mal wieder sehr gelungen und empfehlenswert. Allerdings gibt es zu beachten, dass die neue PAGE Ausgabe schon am 5. Dezember erscheint und somit die aktuelle Ausgabe nur noch bis zum 4. Dezember verfügbar ist. Da ist also ein bissl Beeilung angesagt. 😉

design report:
Die aktuelle design report Ausgabe 11/2007 beschäftigt sich in ihrer Titelstory mit dem Themenbereich Interface Design. Die damit verbundene 4-5reihige Artikelserie gibt besonders für Interface Design Interessierte im Anfängerstatus einen sehr guten Einblick in die Materie. So wird z.B. anfangs sehr schön erklärt, was sich überhaupt hinter dem Thema Interface Design verbirgt. Danach folgt ein Artikel über alternative Eingabegeräte und zum Schluss wird das Themengebiet mit passenden Literaturempfehlungen beendet. Die Artikel sind wirklich sehr schön geschrieben, so dass das Lesen sehr leicht fällt und richtig Spass macht. Leider erscheint die neue design report Ausgabe schon am 3. Dezember und die hier empfohlene Ausgabe ist nur noch bis zum 2. Dezember im Kiosk verfügbar. Also noch mehr Beeilung als bei der PAGE 🙁

PHP Journal Ausgabe 6/2007
Längere Zeit habe ich mich um PHP nicht gekümmert, da kam mir die aktuelle Ausgabe 06/2007 des PHP Journals über den Umstieg von PHP 4 auf 5 gerade recht. Zu dieser Titelstory gibt es noch einen ergänzenden Artikel zum Thema wo die Reise mit PHP (hinsichtlich Version 6) hingehen soll. Besonders praktisch und hilfreich ist das Ganze für so Leute wie mich, die ihr PHP Wissen etwas vernachlässigt haben und nun eine sehr gute neue Orientierung über die Entwicklung im PHP Bereich bekommen. Desweiteren wird diese Orientierung massgeblich von den etwas umfangreichern Artikeln über Datenbankperfomance und -optimierung, sowie die Umsetzung von standardkonformen Web 2.0 Navigationsmenüs unterstützt. Also eine absolute Kaufempfehlung für etwas eingestaubte PHPler. 😉

Nun wünsch ich euch ein frohes Rennen zum Kiosk und ein viel Spass beim Lesen!

Neues von und für Medieninformatiker

October 25th, 2007 No comments

hdrvideo mrpainter display360
Vor ca. über einem halben Jahr habe ich einen Blogeintrag zum Thema Die Zukunft der Medieninformatik?! verfasst. Damals ging es um Web 3.0 (bzw. das Internet der Dinge) und um ziemlich heftige Bildverarbeitungsprojekte. Auch diesmal ist die Bildverarbeitung wieder ein ein wichtiges Thema, denn sie ist auch aus einigen hier vorgestellten
Human-Computer-Interaction Beispielen nicht mehr wegzudenken (siehe Multi-Touch Bildschirme). Somit werde ich jetzt einige interessante Projekte mit einer kurzen Beschreibung vorstellen und am Ende jeder Vorstellung sind dann noch Links zur weiteren Information beigefügt.

Bildbearbeitung

Microsoft Photosynth
Photos werden inhaltlich passend 3dimensional zueinander ausgerichtet und mit Hyperlinks versehen.

Weitere Infos:
Vortrag auf der TED
Projekt Homepage

Using Photographs to Enhance Videos of a Static Scene
Ein Verfahren, welches Z-Parameter aus einem Videobild heraus extrahiert, und noch zusätzlich Fotos in das Video mappen kann um damit grössere Belichtungsspielräume (siehe HDR) im Video, Objekt- und Kamera-Shakesbearbeitung im Bild zu ermöglichen.

Weitere Infos:
Beispiel Video
Projekt Homepage

HDR Video
Das Max Planck Institut hat sich dem Thema HDR verschrieben. Einige interessante Arbeiten zum Thema HDR Video Encoding und HDR Image Processing sind daraus entstanden.

Weitere Infos:
Beispielvideo
HDR Video
Projekt Homepage

Digitales Schärfeziehen
Mit dieser Kamera kann man ein Bild aufnehmen, bei dem sich in der Post Production die Schärfeebene bearbeiten lässt.

Weitere Infos:
Beispielvideo
Projekt Homepage
netter Blogeintrag dazu

Charakter Motion Tracking Verfahren
Das Motion Trackingverfahren kommt ganz ohne die üblichen TrackingSensoren aus. Als erstes muss der Mensch durch einen 3D Scanner, wo ihm dann die Gelenkpartien zugeordnet werden. Danach kann er sich im Raum frei bewegen und die speziell ausgerichteten Kameras berechnen dann die Bewgung, und erstellen daraus die Bewegungsdaten für 3D PRogramme.

Weitere Infos:
Paper
Entwickler Homepage

Seam Carving for Content-Aware Image Resizing
Eine neue kontextbasierte Skalierung von Bildern. Das Verfahren fand eine grosse Aufmerksamkeit in der Bloggerszene. Nun will es Adobe in Photoshop integrieren.

Weitere Infos:
Paper
Beispielvideo
Umsetzung in Flash

Heliodisplay
Bei diesen Display soll es sich um ein Display aus Luft bzw. um eine Luftprojektion handeln. Mit 20.000 Dollar ist man dabei.

Weitere Infos:
Hersteller Seite
Blogeintrag dazu
Blogeintrag dazu

Mensch-Maschine Interaktion:

Multi-Touch Display
Jef Han verursachte mit seinen Mult-Touch Bildschirm einen riesigen Hype. Der Vorteil von MultiTouch Bildschirmen ist das mehrere Berührungspunkte (multi-touch) erkannt werden können, was widerum eine direkte, umfangreiche und gestenbasierte Steuerung am Display ermöglicht.

Weitere Infos:
Jef Han TED Vortrag
Microsoft Surface
Jens Frankes (Flash) MultiTouch
Tim Roths (Flash) MultiTouch
Blog zu MultiTouchs

360° Holographic Display mit 3D Interface
Ein kugelartiges Display, welches sich komplett mit den Händen steuern lässt. Ähnlich eines MultiTouch Displays.

Weitere Infos:
Paper
Entwickler Homepage
Entwickler Homepage
Entwickler Homepage
Universität
Blogeintrag dazu

DataTiles
Rekimotos hat im Jahre 2001 das grafische Interface mit einem physikalischen Interface verbunden. Eine sehr intuitive Interaktion ist daraus entstanden.

Weitere Infos:
Projekt Homepage

Mixed-Reality Painter
Das MIT hat eine Art Mixed-Reality Painter erstellt mit dem man das Gemalte beliebig im Raum positionieren kann.

Weitere Infos:
Projekt Homepage

Mobile Stadtspiele: REXplorer
Mobile Stadtspiele sind eigentlich nichts Neues, aber die RWTH hat mit ihrem REXplorer (Regensburg Tourismusführer) eine vorbildliche Umsetzung abgeliefert. Ihr System basiert auf Gestenerkennung, GPS und Smartphones.

Weitere Infos:
Projekt Homepage
Entwickler Homepage
Fernseh Beitrag

The Arcade Fire
Ein gut umgesetztes interaktives Musikvideo.

Weitere Infos:
Musikvideo

Drop Spin Fade
Mensch-Maschine Kommunikation über eine Art Fadensystem. Weiss gar nicht wie ich das erklären soll, muss man sich einfach mal anschauen.

Weitere Infos:
Projekt Homepage

Adobe Creativity Conducted
Blitz Agency präsentiert eine grosse HD Flash Interactive Leinwand, gesteuert mit Wii Remotes.

Weitere Infos:
Projekt Blogeintrag

Design

Justice - Dance
Das Musikvideo Dance von Justice ist eine hammerharte Motion Graphics und Tracking Arbeit, kombiniert mit einer geile Idee. Ein absolutes must see!

Weitere Infos:
Musikvideo

Creativity Spark From Masters Of Illustration
Eine sehr umfangreiche Gallery von Illustrationen, die die Zeichnungen wunderbar mit dem Realbild kombiniert.

Weitere Infos:
Gallery

Aukustik Hörspiel
Schon mal einen Stereobasierten Haarschnitt erlebt? Dann jetzt mal schnell die Kopfhörer aufziehen und zurücklehnen.

Weitere Infos:
Hörspiel

Ich hoffe die vorgestellten Projekte konnten euch genauso begeistern und inspierien wie mich. Ich bin immer wieder überrascht was für ein abgefahrenes Zeug von noch abgefahreren Leuten produziert wird. Schade das man im normalen Arbeitsalltag davon kaum etwas erfährt. Die absoluten Klassiker wie z.B. MS Surface sind davon mal ausgenommen. Wer sich jetzt noch ein paar Videos von kreativen Hobbybastlern und Studenten anschauen möchte, der kann gerne Stunden auf der Seite hackedgadgets.com verbringen. 😉

-- UPDATE 1.12.2007 --
Auf slashcam.de ist ein schöner Übersichtsartikel zum Thema Ausblick in der Bildtechnik erschienen. Sehr krass was da alles auf der Siggraph 2007 vorgestellt wurde. Eine noch umfangreichere Auflistung gibt es auf trowley.org.

InnoVisions Ausgabe Herbst 2007

October 14th, 2007 No comments

Innovation Magazin pointscreen rockscreen

Ich habe schon einmal in einem älteren Blogeintrag die InnoVisions Zeitschrift vom Fraunhofer-Iuk Verbund für Medieninformatiker empfohlen. Nun gibt es wieder mal einen Themenschwerpunkt im Bereich der Digitale Medien in der aktuellen Herbstausgabe. Gerade für angehende oder zukunftsorientierte Medieninformatiker sind die 3 Hauptthemen produzieren & senden (Schwerpunkt interaktives Fernseh), suchen & finden (von Video-, Ton- und Bilddateien), präsentieren & interagieren (mit Displays) eine gute Orientierungshilfe, was momentan State of the Art ist bei den Fraunhofer Jungs. Besonders gut gefallen haben mir die Projekte PointScreen und digitaler Leuchttisch. Das Projekt Rockscreen könnte gutes Potenzial haben für eine neue Spielwiese der Cyperpunks. Bei dem Projekt Rockscreen sollen nämlich grossflächige Plakate in LED-Screens umgebaut werden. Diese LED-Screens erhalten ihre Daten (Grafiken und Animationen) äber einen WLAN oder DSL Anschluss. Den mässte man dann nur noch knacken, und dann kann die Cyberpunkshow im öffentlichen Raum losgehen. 😉

Daräber hinaus gibt es noch das Special Smart Living, das sich hauptsächlich mit einem komfortableren Wohnen mit Hilfe von IT-Technologie beschäftigt. Eigentlich ein schon bissl ausgelutschter Themenbereich, aus diesem Grund wird wohl in dieser Artikelreihe auf die bestehenden Probleme und mögliche Lösungswege näher eingegangen. Alles nicht ganz uninteressant für Medieninformatiker, wenn man das Ganze hinsichtlich mediales vernetztes Zuhause und Web 3.0 (Internet der Dinge) näher betrachtet.

Zusätzlich zur Printausgabe wird von der InnoVisions-Redaktion noch ein Videocast angeboten. Ein Besuch lohnt sich an dieser Stelle auf jeden Fall mal.

Algorithmen verpackte Ästhetik

July 29th, 2007 3 comments

genillu infovis iatheatre

Die visuelle Programmierung und der Computer etabliert sich immer mehr als Ausdruckswerkzeug für Designer und Künstler (siehe algorithmische Revolution vom ZKM). Um die Macht der Mathematik und der Programmierung für den kreativen Gestaltungsprozess offenzulegen und um den Einstieg für die Kreativen zu vereinfachen, sind einige sehr brauchbare Bücher zu diesem Thema erschienen:

- Flash Math Creativity (Quellcode)
- Processing: Creative Coding and Computational Art
- CodeArt. Eine elementare Einführung in die Programmierung als künstlerische Praktik

Als zusätzliche Inspirationsquelle finde ich die Gallery beautiful algorithms von Alec Cove und die Website von Levitated sehr sehr gut!

Eine gewisse Ästhetik ist auch bei der Informationsvisualisierung vorhanden. Der Blogeintrag Infosthetics: the beauty of data visualization von pingmag bringt diesen Sachverhalt sehr gut auf den Punkt. Spätestens aber wenn man die Gallery von visualcomplexity.com betrachtet, kann man die Ästhetik der programmierten Informations- visualisierung nicht mehr leugnen.

Damit nicht genug, die kreative (visuelle) Programmierung schreitet mittlerweile sogar in Bereiche vor mit denen man bisher nicht gererechnet hat. So passt sich zum Beispiel bei einem Theaterstück das Hintergrundbild (auf einer Leinwand) den Bewegungen der Darsteller an. Sogar bei einer Modeshown wurde das Motion Detection Verfahren angewandt um die Hintergrundanimation mit den Bewegung der Modells auf dem Laufsteg abzugleichen. Dieser Bereich befindet sich aber noch in den Kinderschuhen und lässt somit viel Raum für weitere Experimente.

Meiner Meinung nach ist mit dieser Entwicklung das Klischee des unkreativen verpickelten Fertigpizzen fressenden Programmierer hinfällig. Vielleicht werden ja sogar die Programmierer irgendwann mal die Kreative Führung übernehmen 😉

Hier noch einige nette Links zum Thema:
- Interaktion mit Sound
- graffitiresearchlab.com
- Zentrum für Kunst und Medien
- Quasimondo | Incubator

-- UPDATE 19.10.2007 --
Der MIT Press Verlag hat ein passendes Buch zu diesem Thema mit dem Titel Processing: A Programming Handbook for Visual Designers and Artists herausgrebracht. Dieses Buch liefert einen sehr guten Einstieg in die Thematik und führt den Leser bis zu fortgeschrittenen Themen heran.

Ein weiteres brauchbares Buch vom MIT zum Thema Creative Code in deutscher Sprache.

-- UPDATE 1.11.2007 --
Ein netter Blog von Moritz Stefaner zum Thema Informationsvisualisierung. Schaut mal vorbei, es lohnt sich.

Webcam – Lightwriter Version 2.0

April 16th, 2007 8 comments

singlelighttrack twolighttrack light2config

Nachdem mein Webcam Lightwriter Version 1.0 leider nicht bei allen Webcams so gut funktioniert hat (wegen Helligkeitsproblem), habe ich ein komplettes neue Trackingverfahren geschrieben. Ich arbeite jetzt nicht mehr mit der Funktion Bitmap.getColorBoundsRect(), sondern analysiere fast jedes Pixel des Webcambildes. Bei der ersten Version hatte ich massive Perfomance-Probleme bei der Helligkeitsüberprüfung. Die konnte ich dank eines Tipps meines WG-Kollegen Matze ziemlich einfach lösen. Ich sollte einfach das Webcam Bild in ein Schwarz/Weiss Bild umwandeln. Mit Hilfe des colorMatrixFilter von Matthias Kannengiesser wandelte ich das Webcambild um und hatte somit eine Art Graustufenbild (Helligkeitsbild). Dieses Graustufenbild wandelte ich wiederum mit Hilfe der Bitmap.threshold() Methode und einen variablen Schwellenwert in ein Binärbild um. So waren die hellen Punkte (Lichter) weiss und der Rest schwarz. Damit die Perfomance noch im Rahmen bleibt, skalierte ich das Bitmap auf 80x60 Pixel herunter. Diese Auflösung reichte in meinen Tests für ein erfolgreiches Tracking aus.

Nachdem ich das Bild jetzt endlich fertig bearbeitet hatte, ging es an das eigentlich Tracking. Ich suchte im Bild nach einem weissen Pixel, der noch zusätzliche weisse Pixel als Nachbarn hat (mind. 3 bis 4). Ist diese Bedingung erfüllt, ging ich davon aus, dass es sich an dieser Stelle um ein Licht handeln müsse. Um die Grösse des Lichtes zu ermitteln, überprüfte ich die immer aufeinander folgenden horizontalen Nachbarn nach der obigen (weissen Nachbar) Bedingung. Wenn diese Bedingung nicht mehr erfüllt ist, ging ich davon aus, dass ich die Breite des Lichtes grob ermittelt hatte. Nun musste ich die Höhe des Lichtes ermitteln. Die Höhe ermittelte ich genauso wie die Breite des Lichtes nur das ich die vertikal aufeinander folgenden Pixel überprüfte. Dieses gesamte Verfahren lieferte mir schon eine zufriedenstellende Information über die Position des Lichtes, aber nicht über die ungefähre Grösse. Denn bei der Breite war dieses Verfahren noch nicht stabil genug. Dieses Problem konnte ich aber mit einem einfachen Trick lösen. Ich halbierte die ermittelte Höhe des Lichtes und überprüfte dort (y= yWertLinksOben + lichtHöhe/2) nochmals alle horizontalen aufeinander folgenden Pixel nach weissen Nachbarn. Wenn diese ermittelte Breite grösser war (das ist sie in der Regel auch), übernahm ich diese als aktuelle Breite für das Licht. Am Ende dieses Verfahren gebe ich ein Rechteck-Objekt zurück, das genug Informationen zu der EINEN getrackten Lichtquelle beinhaltet.

Froh darüber, das ich das Tracking erfolgreich geschafft hatte (in Furtwangen), wollte ich es zu Hause bei meinen Eltern (in Ober-Mörlen) weiter verbessern. Und siehe da es funktioniert nicht mehr. Und warum?! Weil eine zweite Lichtquelle im Webcam Bild war. Mein Algortihmus wusste nie welches Licht jetzt getrackt werden sollte. Ein Differenzverfahren wollte ich nicht benutzen, da dadurch die Bildinformation meines Lichtes erheblich verändert werden kann und wegstellen konnte ich das Licht auch nicht, Grr. Da meiner Meinung nach, so etwas aber ein absoluter Standardfall sein könnte, kam mir die Idee mehrere Lichter zu tracken. Also hab ich mich wieder dran gesetzt um das Verfahren auch noch für mehrere Lichter fit zu machen. Lichter zu finden war ja zu diesem Zeitpunkt kein Problem mehr, nur mehrere Lichter zu finden ohne das dabei die Perfomance in die Knie geht, war da schon schwerer umzusetzen. Ich durfte einfach die schon überprüften Pixel nicht nochmals überprüfen - Wer sich den Algortihmus genau anschaut, wie ich die Grösse des Lichtes ermittle wird verstehen was ich meine - Als erstes wollte ich dann die überprüften Pixel mit einer anderen Farbe kennzeichnen, was mir aber das Webcambild im nach hinein verfälscht hätte. Und das fand ich gar nicht gut. Nächster Gedanke war es ein extra 2dim. Array (80x60) anzulegen und dies mit den Stadien 0=noch nicht überprüft und 1=schon überprüft zu belegen. Aber das war mir viel zu umständlich, bis auch hier mir wieder jemand den ultimativen Tipp gab, den nicht genutzten Alpha Kanal für dieses Problem zu nutzen (Dank hier an Helge - Stefan Eckert). Denn wenn der Alpha Kanal den Wert 255 hat, muss ich die Pixel überprüfen, wenn er den Wert 0 hat ist eine Überprüfung nicht mehr nötig. Mit Hilfe dieses Verfahren bekam ich alle Lichtquellen heraus gefiltert. Jetzt musste ich sie nur noch passend sotieren, so dass z.B. Lichtquelle 1 auch immer als Lichtquelle 1 erkannt wird. Das machte ich mit einem Distanzvergleich alter Trackingergbnisse mit den neuen Trackingergebnissen. Dort wo die Distanz zwischen den alten und neuen TrackingRechtecken am Geringsten ist, ist ein Paar gefunden und es musste sich um die gleiche Lichtquelle handeln. Ja und in meinen Tests mit 2-3 Lichtquellen funktioniert das auch ganz gut. Schaut mal rein.


Sourcecode Webcam Lightwriter Version 2.0

Webcam Lightwriter Version 1.0 wens dann doch noch interessiert. Die Vorschau der ersten Version gibts noch auf der Flashhilfe.de Seite anzuschauen

-- UPDATE 18.05.2007 --
Eine nette passende Interaktion für den Lightwriter. Danke Jonas für den Tipp!

-- UPDATE 17.06.2007 --
Die LightTracking Klasse wurde in Sachen Anwenderfreundlichkeit überarbeitet, so dass ihr diese Klasse super einfach für eure eigenen Experimente benutzen könnt. Den Download gibt es unter Interactive Webcam Package mit ausführlicher Doku und Beispielcode zum leichteren Einstieg.