public var spierala

my work, my code, my life by florian spier

Portfolio-Webseite esistwinter.de

Bei “Es ist Winter” handelt es sich um ein Designstudio in Nürnberg mit dem Schwerpunkt 3D-Animation und Motiondesign. Auf der neuen Portfolio-Seite werden die Arbeiten aus den Bereichen Messefilm, TV, Internet, Mobile Devices, Events & Präsentationen übersichtlich in elegantem reduziertem Design präsentiert. Als Grundlage diente das moderne CMS Silverstripe, das mit einer übersichtlichen und effektiven Benutzerführung aufwarten kann. Bei der Umsetzung der Seite lag das Hauptaugenmerk auf der einwandfreien Wiedergabe der Seite auf einer Vielzahl verschiedener Endgeräte, Desktop-Browser, iOS Geräte (iPhone/iPad) sowie Android.

Alle Arbeiten verfügen über eine Diashow, optionale Videos und Social Media Integration.

Einen guten Einblick in die Projekte von “Es ist Winter” bietet das Showreel:
Showreel

Diese Animation ist momentan meine Lieblings-Arbeit von “Es ist Winter”:
Nürnberg Convention

Übersichtsseite im Desktop-Browser

Projekt-Detailseite auf iPad

Projekt-Detail auf iPhone


Technologien: Silverstripe (CMS), HTML, CSS, Javascript
Projekt-Link: esistwinter.de
Kunde: Claus Winter
Design: Claus Winter

Singleton Pattern Example AS3 (based on MVC)

Hello all,
the Singleton Pattern helps you to store persistent data in your application, which should be globally accessible at any time. Therefore it is recommended to use a Singleton Class for your Model in a MVC-Application. For example your Singleton Class could hold the data of a loaded XML-File or in a game it could hold the score/bodycount of the player. The Singleton Pattern makes sure you can access that data whenever and whereever you want with a simple statement like this:

_model = Singleton.getInstance();

The function getInstance() just returns always the same instance, which is just created once at the first function call.

I just updated the popular Actionscript Basic Model View Controller example.
For the Model I use the Singleton Design Pattern, which makes it very easy to access data throughout the entire application.

You can see I just call Singleton.getInstance(); to access the Model with all its data.

check out the new AS3 example here: MVC Singleton Slideshow.
you can view the actionscript source via right-click on the swf.
alternatively feel free to download the entire flash builder project here.

MVC SlideShow Application

MVC Singleton SlideShow Application

I recommend this basic setup for tiny actionscript applications, which will help you to keep your code structured and clean. For bigger things you should think about using a mvc framework – for example Robotlegs. Maybe I will do a tiny example for it as well. Soon.

Cheers,
Flo

blockhaus-spier.de online

Impressionen von der Mosel


Anfahrt

Das nette Ferienhaus an der Mosel “BLOCKHAUS SPIER” kann mit einem neuen Web-Auftritt aufwarten. Check it out: www.blockhaus-spier.de
Wer Lust hat, die letzten sonnigen Tage des Jahres an der Mosel zu verbringen mit Radfahren, Wandern, Weintrinken und vieles mehr, sollte ganz schnell hier buchen: http://blockhaus-spier.de/buchung/

Technologien: Silverstripe

Lagersoftware

Im Auftrag eines Kunden habe ich diese Lagersoftware erstellt, die dazu verwendet wird, den Bestand des Lagers jederzeit und aktuell bewerten zu können. Die Software liefert entsprechende Übersichtsfunktionen für den Bestand an Teilen und Artikeln. Die Bestände können jederzeit aktualisiert werden z.B. bei Zuläufen. Zusätzlich besteht die Möglichkeit, einen „internen Auftrag“ zu erstellen. Nach Erstellung des Auftrages werden die Bestände an Teilen und Artikeln automatisch aktualisiert. Über kritische Mengen an Teilen informiert eine „Note- Funktion“.

Technologien: Actionscript 3.0, Flex-Framework, Doctrine, Robotlegs (MVC-Framework)

Playboy Microsites

Playboy Dinner

Playboy meets Stromberg KUTCHiiN.

Der Playboy veranstaltete zum 1. Mal das Playboy Dinner unter dem Motto “Die Lust am Fleisch”. Holger Stromberg kocht live und die Playboy-Bunnys sind die Gastgeberinnen des Abends. Die dazugehörige Webseite beinhaltet alle Informationen rund um den Abend. Ein kleines Highlight ist die Navigation mit ihren großen Bildern, die erste Einblicke gewährt und “Appetit” auf den bevorstehenden Abend macht.

Playboy-Clubtour 2010

Auch 2010 fand wieder die Playboy Clubtour statt. In fünf Städten feiern die Partygäste ausgelassen mit den hübschen Playboy Bunnys.

Das Partyvolk findet auf dieser Webseite alle wichtigen Informationen rund um die Locations, Tour-Daten, Bunnys und Partner des Events. Ein kurzes Video fasst die Highlights des letzten Jahres zusammen und macht schon im Vorfeld Lust auf heiße Partynächte.

Technologien: Flash, HTML, CSS, Javascript
Projekt-Links: Clubtour 2010, Playboy Dinner
Arbeitgeber: stilbezirk

UEFA Truck Mailing Software

User-Foto und Versand

Die E-Mail beim Empfänger.

Für adidas wurde dieses Software erstellt, die auf einem Truck im Einsatz war, der quer durch Europa tourte und an den großen Spielstätten der Europe League halt machte. Die Teilnehmer konnten per Webcam ein Foto von sich aufnehmen und dieses mit einem persönlichen Text versehen. Alles zusammen konnte an die email-Adresse eines Freundes verschickt werden. Alle Bilder und Texte wurden auf einem Server zwischengespeichert. Ein Backup-System sorgte dafür, dass die Nachrichten bei fehlender Internet-Verbindung zwischengespeichert werden und zum nächst möglichen Zeitpunkt verschickt werden.

Technologien: Actionscript 3.0, PHP, SQLite
Arbeitgeber: stilbezirk

adidas Videotool in Kapstadt zur WM Südafrika

MAKE YOUR MESSI MOVE

basierend auf meiner Diplomarbeit habe ich bei stilbezirk das Videotool entwickelt. Es handelt sich dabei um ein mobiles Greenscreen Videostudio. Das Tool war in Stockholm und zur Fussball-WM in Kapstadt im Einsatz. Die Teilnehmer konnten dank des Tools zusammen mit Superstar Lionel Messi in einem Videoclip kicken.

Hauptaugenmerk bei der Entwicklung des Videotools lag auf der einfachen Bedienung, die vor allem auf dem weitgehend automatisierten Videoproduktions-Prozess basiert. In der Videotool-Software wird per Knopfdruck die Video-Aufnahme des Teilnehmers vor dem Greenscreen gestartet; der Teilnehmer im Video wird daraufhin durch die Software automatisiert freigestellt und in ein bestehendes Video-Compositing (mit Messi etc.) eingebettet. Nach wenigen Minuten kann der fertig berechnete Clip auf einem großen Screen angeschaut oder auf einem USB-Stick dem Teilnehmer übergeben werden.

Technologien: After Effects, Max MSP
Arbeitgeber: stilbezirk

Kneipp App für iPhone

Kneipp Start Screen

Kneipp Start Screen

Produktauswahl

Auswertung 1 - tabellarisch

Auswertung 2 - Graphisch und Produktempfehlung

Die für die Firma Kneipp entwickelte iPhone App zur Volkstablette wurde in Kooperation mit der Bild Zeitung vermarktet.

Mit dieser App kann nun jeder sofort herausfinden, welche Nährstoffe in seinen täglichen Nahrungsmitteln enthalten sind. Aus einer umfangreichen Datenbank mit über 10.000 Lebensmitteln kann man auswählen, was auf dem Speiseplan steht bzw. stehen sollte und erfährt, wie gut man mit den einzelnen Nährstoffen versorgt ist.

Somit hat man seinen kostenlosen Ernährungsberater immer in der Tasche! Die App ist im iTunes Store in der wichtigen Rubrik “Neu und beachtenswert” auf der Startseite gelistet worden und innerhalb weniger Tage in den Top-Charts für Gratis Apps weit nach oben geklettert!

Projekt-Link: Kneipp “Gut versorgt” im App Store
Arbeitgeber: stilbezirk

epoq: CMS-Webseite

Startseite

Inhaltsseite

Der mehrsprachige Web-Auftritt für epoq wurde komplett in HTML/CSS, Javascript realisiert. Im Hintergrund arbeitet das CMS Silverstripe, über welches die Inhalte  der Seite gepflegt werden können.

Technologien: Silverstripe (CMS), HTML, CSS, Javascript
Projekt-Link: epoq
Arbeitgeber: stilbezirk
 

embed googlemaps in silverstripe template

Hello,

today I became nearly crazy by trying to embed a googlemap in a silverstripe template. It was usually quite easy even with typo3…

I tried this with the help of jquery:

http://marcgrabanski.com/article/jquery-google-maps-tutorial-basics

Standalone in a single html page the code worked perfectly. Then in my silverstripe generated site the map never appeared and I got javascript errors in firefox like these:

Error: google.maps is undefined

GMap2 is not defined

Then i saw another interesting thing: The map appeared properly in IE! after searching nearly the whole Internet I found this post in the silverstripe forums that explained that there is a problem with the doctype used by silverstripe generated html files…

The post´s solution:

remove the first line on the default template of silverstripe:

<?xml version=”1.0″ encoding=”UTF-8″?>

silverstripe community seems to be great. you never code alone!

cheers,
flo

Follow

Get every new post delivered to your Inbox.