Today’s Brands – Flex skinning

By Mediamonkey | Published: 3 August, 2010

Voor Today’s Brands heb ik een kleine opdracht gedaan, namelijk een psd ontwerp voor een website omgezet naar een skin template voor Flex components. Binnen 6 uur had ik alle relevante componenten geskinned. De states, anders dan de up-state, waren echter niet aangeleverd. Die heb ik daarom naar eigen inzicht ontworpen.

Posted in Uncategorized | Comments closed

TriMM – NXP Online Calculations

By Mediamonkey | Published: 4 March, 2010

Voor TriMM heb ik aan hun project NXP Online Calculations gewerkt; een RIA waarin berekeningen kunnen worden gedaan voor het ontwikkelen van een spaarlamp.

Dit project bestond uit het bouwen van formulieren met invulvelden waarna er een calculatie wordt uitgevoerd en de output in een mooie grafiek wordt getoond. De berekeningen gebeurden aan de server kant en de koppeling bestond al, dus het was een makkelijk uit te voeren klus. Het meeste werk ging zitten in het interactief maken van de velden en custom gestylede en geskinde componenten. De applicatie kan hier worden bekeken.

Posted in portfolio, voltooid | Tagged , , | Comments closed

MediaMonks – BattleDate

By Mediamonkey | Published: 4 March, 2010

MediaMonks zocht een goede freelancer om hun team aan te vullen voor een spoedklus: het maken van een animeerbare en aankleedbare “avatar” waarmee jonge gebruikers kunnen battlen in een multiplayer game: BattleDate.com

Ik heb aan de hand van een aangeleverd design de avatars (aparte man en vrouw) gemaakt en aangestuurd met actionscript waardoor er kleren konden worden toegevoegd. Daarnaast heb ik verschillende UI components gebouwd voor de verschillende kamers en de game: lijsten met itemrenderers voor de verschillende kleren en custom geskinde componenten als buttons en tekstballonnen.

Het animatie systeem heb ik in samenwerking met Arjan van Wijk (Tha Narie) gerealiseerd. Arjan schreef een jsfl script wat de handmatig gebouwde en getweende aangeleverde animatie omzette naar een JSON bestand met transformatie matrices per animeerbaar element. Dit werd ingeladen en uitgelezen door een animator manager zodat tijdens het spelen van het spel de Avatar werd geanimeerd.

Posted in portfolio, voltooid | Tagged , , | Comments closed

Mediamonkey – Isometrische Level Editor

By Mediamonkey | Published: 15 September, 2009

Voor een mogelijk toekomstig project heb ik een offerte uitgebracht. Na de specificaties te hebben gelezen werd ik zo enthousiast dat ik in mijn eigen tijd begonnen ben met een prototype / demo om te kijken of de wensen gemakkelijk te implementeren waren. Hier ben ik momenteel af- en aan mee aan het werk.

Voor de applicatie maak ik gebruik van de open-source library AS3IsoLib, een 2D engine voor het tekenen en plaatsen van isometrische graphics. De UI maak ik in Flex 3, en bestaat uit verschillende custom components en itemrenderers (zie bijvoorbeeld het op Photoshop gebaseerde Overview window, een Tree component met custom itemrenderer). Een library met units die te plaatsen zijn op het isometrische grid worden dynamisch ingeladen via een xml document uit een runtime shared library (RSL) en losse SWF bestanden.

Door aan dit project te werken bouw ik langzaam maar gestaag een interessant aantal uitgebreid gebouwde en geteste classes op voor gewenste functionaliteiten in RIA editors zoals een ButtonGroup, PopUpUtil, KeyBindingManager, ContextMenuManager, ImageExportManager, CursorManager (een uitgebreidere versie, voortgebouwd op die van Adobe). En natuurlijk doe ik hiermee veel ervaring op met het bouwen van uitbreidingen op de isometrische engine, zoals MouseTools (selectie, transformatie, zoom, panning etc.). Zie de online demoversie TET

Posted in portfolio, toekomstig | Tagged , , , , , , | Comments closed

SiteSeeing – Wevolve

By Mediamonkey | Published: 14 September, 2009

SiteSeeing benaderde mij voor het maken van een Flash interactieve animatie aan de hand van een goed uitgewerkt storyboard. In de animatie wordt aan de kijker op een speelse manier duidelijk gemaakt dat SiteSeeing van naam veranderd naar ‘Wevolve’.

De gebruiker dient na een korte animatie het oude logo op te pakken en dit in een machine te gooien. De machine gaat hiermee aan de slag en maakt er het nieuwe logo van Wevolve van. Vervolgens is het de beurt aan de gebruiker om een (bedrijfs)naam in de machine te gooien, wat als resultaat geeft dat ‘dit niet zomaar gaat’, en dat contact kan worden opgenomen met het bedrijf om te kijken wat Wevolve voor de gebruiker kan betekenen.

sis1

Posted in portfolio, voltooid | Tagged , , , | Comments closed