Danai Media

De Beebielove webshop

Samen met Aart en van Breensma (A&vanB) en Itum033 heb ik de complete online ervaring van het merk Beebielove ontwikkeld. A&vanB heeft het ontwerp verzorgd, Itum033 heeft zich vooral bezig gehouden met de corporate site en ik heb me vooral bezig gehouden met de webshop.

Catalogus

De shop is gemaakt met behulp van Magento software. Het bevat een uitgebreide catalogus met alle kleding die besteld kan worden. Betalingen worden geregeld via iDeal en creditcard.

Beheer

Magento heeft al een standaard beheerders gedeelte. Ik heb alle Nederlandse instellingen toegepast alsmede een aantal export mogelijkheden ontwikkeld, waaronder naar King.

Simpel lunch halen met de lunch App!

De lunch app is een eigen project wat ontstaan is uit twee behoeften. Allereerst wilde ik een gemakkelijk middel om op kantoor bij te houden wat de wensen voor de lunch zijn. Tot de lunch app werd dit met pen en papier bijgehouden. Deze makkelijke aanpak moest ook in mijn middel terugkomen.

Daarnaast wilde ik meer weten over de nieuwe HTML5 api 'localStorage'. Dit biedt ontwikkelaars de kans om data op te slaan die na het herstarten van de browser nog steeds beschikbaar is.

De app bestaat grotendeels uit HTML en Javascript. Het toevoegen van producten gebeurt aan de voorkant door nieuwe objecten aan het DOM toe te voegen. Via een XMLHttpRequest wordt er aan de achterkant met een database gecommuniceerd. Om elkaars wensen bij te houden wordt de app realtime gesynchroniseerd. Het product wat meneer A toevoegt ziet meneer B ook meteen in zijn lijst.

Uiteindelijk is het een SaaS dienst geworden waar elk kantoor zijn eigen lunch app heeft. Wilt u ook een (test) account? Deze kunt u aanvragen via het contactformulier.

Gezichtsmodule voor wordpress

De gezichtsmodule bestaat uit diverse afbeeldingen waarmee je je eigen gezicht kunt ontwerpen. In CSS heb ik voor elke aparte afbeelding een class gemaakt. Op de HTML pagina heb ik een aantal blok elementen over elkaar heen geplaatst waarbij elk blok een deel van het gezicht was (haar, mond, neus, etc).

De interactie is geregeld met een HTML5 range element. Voor oudere browsers die dit niet ondersteunen heb ik een jQuery plugin als fallback gebruikt welke dezelfde output genereert.

Technieken

Door gebruik te maken van javascript heb ik ervoor gezorgd dat het gezicht realtime wordt aangepast. Het verschuiven van het range element zorgt ervoor dat het blok element wat hierbij hoort van class veranderd naar de volgende of vorige class (ander haar, andere mond). Als je op de kleurvlakjes ernaast klikt veranderd de kleur van het element (huidskleur, haarkleur).

Case Slider voor CMS Made Simple

Via Image33 heeft Thinkwise Software mij de opdracht gegeven om een Content Slider module te ontwikkelen. De website is dynamisch ontwikkeld in CMS Made Simple. Voor de Content Slider heb ik een aparte module gemaakt die hierdoor ook op meerdere CMS Made Simple installaties geïnstalleerd kan worden.

Module inhoud

CMS Made Simple heeft het ontwikkelen van modules vereenvoudigd. Elke actie krijgt zijn eigen bestand wat voor overzicht zorgt. Ook de installatie en de-installatie zit in deze module verwerkt. Per casus kunnen afbeeldingen, teksten of youtube filmpjes worden toegevoegd. De afbeeldingen worden netjes geschaald en passend gemaakt voor de slider.

Portfolio Website

Mijn eigen portfolio heb ik online gezet. Deze is qua inhoud al verouderd maar heeft een aantal interessante aspecten. Ik heb geprobeerd om een goed overzicht te creëren door alleen de nodige informatie te laten zien. Op de website staat mijn recente werk centraal.

"Recent Werk" Slider

Elk item in de "Recent werk" slider kun je aanklikken. Het item animeert dan met behulp van jquery naar links en een korte uitleg verschijnt. Zo kan elke case apart worden bekeken. Bij een aantal onderdelen zit ook een voorbeeld.

Footer

Onderaan heb ik wat 'meta' informatie gezet. Via een nieuws blok kan iedereen op de hoogte blijven van mijn bevindingen. In het midden staat een blok met alle links naar diverse Social Media. Helemaal rechts staat kort beschreven wie ik ben en wat ik doe.