sonja vieten

design of interactive and animated media

  
YouTube
Sonja vieten  - digital creative
Digital Creative
Technologie im Wandel

Die Herausforderung im digitalen Design: Sich ständig wandelnde technische und gestalterische Aspekte verstehen, ausschöpfen und kreativ in einer ansprechenden Benutzer Oberfläche kombinieren. Diesem spannenden stetigen Wandel begegne ich seit dem Jahr 2000.
HTML5 e-card animated interactive cartoon
HTML5 Animation
Animationsdesign

Digitale On- und Offline Animationen vermitteln Informationen anschaulich und einprägsam. Präsentationen, animierte Infografiken, interaktive Web-Module, Erklärfilme, Trickfilme, Werbebanner, Foto Slider und Games sind nur einige Anwendungs Beispiele. Einige meiner selbst gezeichneten und animierten HTML5 Cartoons, die ich früher für meine Flash e-Card Plattform entwickelt habe, und nun als interaktive HTML5 Animation umgewandelt habe. Mein bevorzugtes Produktions Tool: Animate CC (ehemals Flash Pro)
Artworks completed - Photoshop
Artworks completed
Kreativtraining

"Adolphe Bouguereau's poses reinterpreted". Die Collagen entstehen auf Basis eines Werks von A.Bouguereau, in dem mit etwas Fantasie noch etwas "fehlen" könnte. Dies ist ein laufendes Photoshop- und Kreativtraining.
Einarmiger Bandit Info-Spiel
Einarmiger Bandit
Touchscreen Game

Ein interaktives vertontes Info Game; Einsatz als Touchscreen Messe Anwendung und online als Webseite. Vorteil: Mit HTML5 und JavaScript realisierte Anwendungen kann jeder Browser (on- und offline) darstellen. Realisation und responsive Design Anpassungen. Konzept/Illustration by tigerworx.de.
Garagen Film
Garagen Film
Webdesign

Interaktive multimediale Website, maßgeschneidert nach Vorgabe des Regisseurs. Mit animierten Sequenzen der Illustratorin Ulrike Möltgen. Die Kombination von HTML5, CSS und JavaScript erlaubt die Darstellung in jedem Browser und Gerät.
Pengball
Pengball
HTML5 Canvas Game

Interaktives animiertes Spiel auf HTML5 Canvas Basis. Ursprünglich als Flash Game realisiert habe ich es mit Open Source Technologien in aktuelle Standards konvertiert. Das Design und die Bedienung passt sich den jeweiligen Endgeräten und Bildschirmgrößen an.
Interaktive Infografiken
Interaktive Infografik
Design und Entwicklung

Interaktive animierte Infografiken können sowohl online im Web als auch offline, zB. auf Messen als Touch Screen Anwendung, veröffentlicht werden. Komplexe Zusammenhänge werden so unterhaltsam und verständlich vermittelt. Der Nutzer steuert aktiv den Informationsablauf und wird damit der wesentliche Teil der Anwendung. Zum Einsatz kommt eine Kombination aus HTML5, Canvas, CSS und JavaScript, die in jedem Broser dargestellt werden kann.
Cologne Photo Gallery
Photo Gallery
interaktive Ausstellung

Handy Schnappschüsse in Köln aufgenommen und in einer interaktiven Ausstellung präsentiert. Per Klick auf die Fotos öffnen diese sich im Fullscreen. Die Kombination der Websprachen HTML5, CSS und JavaScript erlaubt die Darstellung in jedem Browser und Gerät, ohne weitere notwendige Plugins.
HTML5 Sketches & Experiments
Animation Sketches
Experiments

Hier stelle ich einige Interaktions- und Animations Experimente aus. Generative Art und algorithmisch erzeugte interaktive Zeichnungen, basierend auf Code: JavaScript, HTML5, CSS, Animations Frameworks.