Home Voor anderen CV Superboy My MTV Get focus Tolstoy Masquerade Over mijzelf Nog meer?!

David Verkerk

Hover in and out of the image.

Welkom op mijn portfolio website.

In 2012 ben ik overgestapt van printmedia naar front-end webdevelopment.
Sindsdien heb ik niet meer terug gekeken en ben continue bezig met het opdoen en uitbreiden van mijn front-end vaardigheden. Zowel thuis op eigen initiatief als in een werkomgeving.

Deze vaardigheden begonnen met een korte HTML5, CSS3, Javascript en Jquery opleiding. In die gebieden valt natuurlijk nog steeds wat te leren. Je bent immers nooit klaar. Maar ik breid mijn vaardigheden ook uit naar PHP, AngularJS, MySQL, XML, Wordpress en Magento waar ik de eerste stappen ook al heb gezet. De honger naar meer is nooit gestild.

Alle code waar deze site uit bestaat heb ik allemaal zelf geschreven en bedacht vanaf een blanco vel (nee niet papier). Nergens zijn plugins gebruikt.

Kijk rustig even rond. Hier en daar geef ik wat developer uitleg voor degene die het lezen wil.

Voor anderen

Deze site staat vol met opdrachten die ik zelf heb verzonnen om mij te bekwamen in Front-end development.

Natuurlijk heb ik ook in opdracht van anderen gewerkt. Aan deze onderstaande sites heb ik in teamverband meegewerkt.

Klik op een afbeelding en bezoek de site.

Superboy

Push the button below to experience the incedible Curriculum Vitae adventures of

Mijn cirriculum vitae met een twist.

Maar ook een oefening in Jquery animatie met een "aanloopje" om natuurlijk gedrag na te bootsen. Dat is ook belangrijk.

Watch my MTV

Begonnen als een droge drag and drop oefening maar uitgebreid met een andere passie van mij: muziek.

De lijst met video's (van youtube) konden niet simpel met "overflow:hidden" uit beeld verdwijnen als je op de navigatiepijlen klikt want dan zou je de video's ook niet vanuit de lijst container naar de TV kunnen slepen. Ik heb dit uiteindelijk opgelost door de thumbnails met Jquery animatie "op te vouwen" door de hoogte van video thumbs terug te brengen naar 0 als ze uit beeld moesten verdwijnen of weer terug naar de originele hoogte om te verschijnen. De bovenste vouwt op en de onderste vouwt uit. Of andersom natuurlijk.

Veel luisterplezier!

Get into focus

Een nieuwe techniek: Blur animatie met css keyframes. Niet alle browsers (zoals IE) zijn er nog geschikt voor. Chrome in ieder geval wel. Maar laat je dat niet weerhouden.

Click on the camera and start taking pictures.

Get Focus

Take Picture

Leo Tolstoy animation

Voor Leo Tolstoy's 186ste verjaardag had Google een leuke animatie online gezet.

Ik dacht meteen: "Dat ga ik ook proberen" en ben met de gedownloade afbeeldingen zonder enige code begonnen.

Veel css animatie van 70 verschillende (sprite)afbeeldingen en een beetje javascript later denk ik dat het wel gelukt is.

Image
Mask

Met javascript en HTML5 canvas de Alfa-waarden van de image vervangen voor de zwart-, wit- en grijs-waarden van de mask voor transparantie.
De mogelijkheden om te experimenteren zijn daardoor eindeloos en je kan de gekste creaties maken. Iets extravagants als hierboven of met iets simpels als een logo.

Iets over mijzelf

Men wordt niet alleen gevormd door werk en studie, belangrijk is het natuurlijk wel.

Naast opgedane kennis door opleidingen ben ik ook autodidact, heb een brede intresse en ben daardoor een veelzijdig persoon die graag uitdagingen aangaat.

Dat uit zich in uiteenlopende zaken, van posters maken met Photoshop (en Gimp) voor Paradiso, mijn klassieke Ford Granada uit 1974 verbouwen en restaureren (zie foto), een (film) script schrijven, een compleet huis verbouwen tot het schrijven en spelen van muziek. Oh ja... ik houd ook graag een fotocamera vast. Bijna alle foto's op deze site zijn door mij geschoten.

Ik houd van creeren en de problemen (al dan niet out of the box) oplossen die daar mogelijk bij komen kijken.

Een uitdaging kan ook een avontuur zijn. Zo heb ik ook 3 jaar in het buitenland gewoond en gewerkt.

Door kennisuitbreiding en creativiteit betreed je onbekende paden en die brengen altijd uitdagingen en avontuur. Deze leiden op hun beurt altijd tot meer zelfkennis.

davidverkerk@gmail.com

Nog Meer?!

Ja er is nog meer om te laten zien.

Je kan echter niet ongestraft eindeloos veel leuke draaiende of interactieve elementen op 1 pagina kwakken. Daar kan de pagina te stroperig van worden. Iets wat sommigen van jullie misschien wel gemerkt hebben. Al die interactie kan je eigenlijk beter apart per pagina laten zien.

Ik heb echter voor deze opzet gekozen om ook het navigeren op een "spreadsheet" pagina (zoals ik het maar noem) te demonstreren. Niet alleen horizontaal of verticaal opschuiven maar ook diagonaal. Das weer eens iets anders. Om dat goed te demonstreren heb je al gauw 3x3=9 pagina's nodig. En die moeten natuurlijk wel gevuld worden... en niet alleen met statische plaatjes en knopjes. Tja dan wordt het zwaar.

We moeten nu dus toch echt naar een andere pagina om verder te gaan.

Ik zie je bij het 2de deel (als ik deze klaar heb)

Groetjes, David Verkerk.