Ron Valstar

Mijn naam is Ron Valstar ~~en ik maak dope shit~~ en ik ontwikkel applicaties voor digitale media. Noem mij een front-end specialist.
Dat is vrij breed: eerst maak ik een interactie ontwerp, dan ga ik het vormgeven en als laatste zorg ik ervoor dat het werkt. Vlekkeloos!
Hier gingen wel een grafische opleiding, een HBO opleiding interaction design en tien jaar werkervaring aan vooraf.

Ja, ik ben zo'n jongen die dit soort dingen ook voor zijn lol doet. Dat is mijn manier om me altijd te blijven ontwikkelen en de nieuwste technieken uit te proberen. Wat ik nuttig acht geef ik vrij als open-source.

Heb je iemand nodig zoals ik? Mail mij met je vraag en je krijgt snel antwoord.

expertise

Het liefst schrijf ik toepassingen in Javascript, dit doe ik zelfs langer dan ik met Flash werk (sinds versie drie in 1998). Daarnaast zou ik me geen front-end specialist durven noemen als ik niet een hoop af wist van: DOM, XHTML, HTML5, XML, CSS (LESS), jQuery, PHP, Air en af en toe ook XSLT, Java, Processing en zelfs Lingo (Director, weet je nog?!).

Ik heb veel ervaring met fotografie en video in combinatie (realtime) 3D omgevingen. Dit zowel in Flash als Javascript (en CSS3 en Java/Processing en Director)

In de loop der tijd heb ik met de volgende partijen gewerkt: Novartis, Thieme Meulenhoff, BNN, Pool Worldwide, Tribal DDB, Lukkien, Nationale Nederlanden, Freedomlab, Kennisnet, Lost Boys, Centraal Museum, Ome Willem, Shapers.

Dustin Kershaw

uri:	http://www.dustinkershaw.com/
werkzaamheden:	HTML5, PHP, Javascript
grapisch ontwerp:	Judith van der Velden

Pixelfabrics

uri:	http://www.pixelfabrics.com/
opdrachtgever:	StillsnMotion
werkzaamheden:	Adobe Air Actionscript 3, Javascript

Bij StillsnMotion worden robotarmen verkocht die heel nauwkeurig om objecten heen kunnen draaien. Voor StillsnMotion ontwikkelde ik een crossplatform Air applicatie waarbij deze beelden worden omgezet naar een crossbrowser en crossdevice HTML5 applicatie.
De Air applicatie is voorzien van een gebruikers en licentie sleutel. Deze versleuteling is ook doorgevoerd in de uiteindelijke HTML5 applicatie waardoor deze door derden zeer moeilijk te stelen is.

JuridaII

uri:	http://test.ronvalstar.nl/jurida/
opdrachtgever:	Lea Jurida
werkzaamheden:	grafisch ontwerp, Flash Actionscript 3

Dit redesign is jammer genoeg nooit verder gekomen dan een prototype met 3D blokjes.

deepRED

uri:	http://deepred.tv/
opdrachtgever:	deepRED
werkzaamheden:	Javascript, HTML5, CSS3

Vroeger was een Flash plugin de enige manier om video te tonen. Met de komst van HTML5 wordt dat allemaal volledig geïntegreerd zodat deze site ook zonder problemen op een iPad draait.

Soundcircus

uri:	http://www.soundcircus.nl/
opdrachtgever:	Pool worldwide
(post-)production:	DPPLR
werkzaamheden:	front- en backend mbv XHTML/CSS, jQuery, Flash Actionscript 3, PHP

De opvolger van de Kees Kroot website is interactief gezien mischien minder spectaculair dan haar voorganger, qua sfeer wordt het zeker geëvenaard. Ook deze keer is de site weer beloond met een FWASOTD en heeft het een zilveren ADCN Lamp gewonnen in de categorie 'interactief'. Daarnaast is het genomineerd voor een Webby.

Chocolátl

uri:	http://chocolatl.nl/
techniek:	Javascript, HTML5, CSS3, PHP, Wordpress
grapisch ontwerp:	Ibrahim Farah

Er is een nieuwe winkel in de Jordaan: Chocolátl. Als je nog niet verslaafd was aan chocola wordt je dat wel na een bezoek aan deze winkel. Samen met grafisch ontwerper en fotograaf Ibrahim Farah maakte ik de website voor Chocolátl, simpel en strak.

Green Today

uri:	http://greentoday.nl/
opdrachtgever:	GMG
techniek:	Javascript, HTML5, CSS3, PHP, Wordpress

Green Today is een beurs over groen. Geen geitenwollen sokken groen, maar high tech groen. De site is een Wordpress CMS met speciaal ontwikkelde HTML5 templates en plugins, met veel Javascript animatie en canvas.

Tatarataa!

uri:	http://tatarataa.com/
opdrachtgever:	Tatarataa!
werkzaamheden:	Javascript, HTML5, CSS3
grapisch ontwerp:	Ibrahim Farah

Tatarataa! bedenkt, ontwikkelt en organiseert evenementen voor merken of bedrijven.

Allerhande

uri:	http://allerhande.ah.nl/
opdrachtgever:	Lukkien
werkzaamheden:	Flash Actionscript 3
samenwerking:	Sanne Wijbenga Anna Offermans Patrick Sanwikarja Thomas Moes Marlène Soulier Yuri van der Meer Orne Brocaar Erik van Nieuwburg Koen van Esterik Stijn de Ryck Paul van der Loos

Allerhande is het gratis blad van Neerlands grootste supermarktketen Albert Heijn. De focus van deze Flash site ligt op recepten; vooral met betrekking tot thema en sociale netwerken. Waarbij dat laatste een implentatie is van het bestaande kookschrift op ah.nl. En ander mooi voordeel van digitaal is dat je nu ook de artikelen uit eerdere Allerhandes kan raadplegen.
Ook al kwam ik halverwege dit project binnen, ik zat er al snel in dankzij Scrum. En natuurlijk had ik al eerder met het op PureMVC gebaseerde framework gewerkt. Dankzij een goed team is het resultaat heel koel geworden.

Allerhande.nl heeft de Publieksprijs Lancering Customer Medium van het Jaar 2010 gewonnen.

illustratie

3D panoramas

opdrachtgever:	Iwan Baan
werkzaamheden:	Flash Actionscript 3, XML/XSLT

Iwan Baan is fotograaf. Hij fotografeert onder andere objecten voor architecten met behulp van een fish-eye lens. Het resultaat toonde hij eerder altijd met behulp van Director, maar de Shockwave-plugin die daarvoor nodig is, wordt sinds de komst van Flash eigenlijk niet meer zoveel gebruikt.
Ik heb aan de Flash-panorama's een aantal kleine dingen toegevoegd. De laadtijden zijn kleiner geworden omdat de panorama's nu worden gecached (zover het geheugen dat toelaat). De hele applicatie is nu liquid, wat wil zeggen dat het op elke willekeurige resolutie te bekijken is en meeschaalt wanneer de browser wordt vergroot. Er zitten nu tevens kleine scherm overgangen in, wat de illusie van beweging geeft.

Kees Kroot

uri:	http://www.soundcircus.nl/
opdrachtgever:	Pool worldwide
werkzaamheden:	front- en backend mbv XHTML/CSS, jQuery, Flash Actionscript 3, PHP
fotografie:	Krijn van Noordwijk

Deze Flash site gunt je een blik in het hoofd van Kees Kroot. Naast de portfolio kun je ook zien wat Kees zoal inspireert. Als je Kees een berichtje stuurt verschijnt het onmiddelijk in zijn hoofd.

FC Walvisch

uri:	http://www.fcwalvisch.nl/
opdrachtgever:	FC Walvisch
werkzaamheden:	concept, grafisch ontwerp, productie
techniek:	XHTML/CSS, jQuery, PHP, Flash Actionscript 3

FC Walvisch is een geluidsstudio met een voetballiefhebber aan het roer.
Na zes jaar was het voor FC Walvisch tijd voor een nieuwe site, in een jaren 70 technicolor voetbalstijl, serieus met een knipoog (of andersom).

Vacansoleil

uri:	http://www.vacansoleil.nl/
opdrachtgever:	Lukkien
werkzaamheden:	Flash Actionscript 3, Javascript, CSS

Een Europees marktleider in kampeervakanties krijgt natuurlijk niet zomaar een site, maar eentje waarin het lijkt alsof je al op vakantie bent. Bij Lukkien ging de lead developer zelf op vakantie dus ik werd gevraagd een maand in te komen vallen.

New Colt minisite

uri:	http://newcolt.com/
opdrachtgever:	Lukkien
werkzaamheden:	Flash Actionscript 3
grapisch ontwerp:	Olaf Gremie

De Mitsubishi Colt heeft een restyle ondergaan. De minisite hiervoor was onderdeel van een crossmedia campagne voor deze auto. Technisch is de site vrij zwaar; een compromis tussen kwaliteit en kwantiteit. De site bevat een drietal interactieve 360° panorama's met hotspots naar specifieke onderdelen. De panorama's vloeien naadloos in elkaar over en bevatten verschillende achtergrondgeluiden die meedraaien met de auto's.

Blauwe Planeet

opdrachtgever:	Thieme Meulenhoff via Shapers
werkzaamheden:	Flash Actionscript 3

Shapers ontwikkelde voor ThiemeMeulenhoff een serie topografie cd-roms voor groep 7, 8 en 9. De cd-roms bieden een complete, leuke en effectieve manier om topografie te leren. Ze maken deel uit van de methode 'de Blauwe Planeet'. Onlangs is een deel hiervan omgeschreven naar Flash zodat het ook online te leren is. We hebben meteen van de gelegenheid gebruikgemaakt het interactief en grafisch te verbeteren.

Kosmonaut

opdrachtgever:	Kosmonaut & Pool
werkzaamheden:	Flash Actionscript 2, XHTML/CSS

Kosmonaut maakt muziekvideos. Hun site moest vooral simpel zijn. Ik kreeg foto's aangeleverd van hun eigen bureau, en wat post-its, en daar moest ik het mee doen.
Het navigeren gebeurt door middel van het bewegen van de camera over het bureaublad. De bitmap van het hout wordt bij verandering van schermgrootte opnieuw berekend. In verband met rotatie zijn de breedte en hoogte gelijk aan de diagonaal van het scherm. Doordat grote bitmaps op sommige computerprocessors intensief zijn, zal een kleiner scherm soepeler lopen.
Op dezelfde manier als de site van Lea Jurida wordt de content ingeladen in de vorm van de eigen XHTML pagina, en in dit geval wordt ook de CSS file gebruikt.

SFBrowser

uri:	http://sfbrowser.sjeiti.com/
werkzaamheden:	XHTML/CSS/jQuery/PHP

Als onderdeel van websites maak ik vaak een afgeschermd deel waar men teksten kan aanpassen en afbeeldingen uploaden. Voor het uploaden van bestanden heb ik SFBrowser geschreven. Hiermee kan je bestanden uploaden, downloaden, verwijderen, aanpassen en selecteren voor gebruik. In ruil voor wat karma heb ik het open-source gemaakt. Daarnaast is open-source natuurlijk een goede manier om testers en feedback te krijgen.

TinySort

uri:	http://tinysort.sjeiti.com/
werkzaamheden:	Javascript / jQuery

Omdat ik iets nodig had om HTML nodes te sorteren heb ik een jQuery plugin geschreven.

TinySort is een kleine, eenvoudige jQuery plugin die elk nodetype kan sorteren door op tekst- of attribuut waarde, of door dat van een van de kind-nodes.

Elf Fantasy

uri:	http://www.elffantasy.eu/
opdrachtgever:	Shapers
werkzaamheden:	concept, illustratie, productie (Flash as3, jQuery)

De Elf Fantasy Fair is een groots internationaal festival geënt op fantasy en sciencefiction. Het inlevingsvermogen van de bezoekers is zodanig dat zo'n tweederde van hen zelfs verkleed gaat als trol, draak, elfje of ander fictief wezen. Dat was een goede reden om de website te voorzien van een ouderwetse maar interactieve landkaart met daarop het festivalgebied (omgedoopt tot Elfië). Een andere reden was dat de festivalorganisatie de indeling van het terrein had opgezet met behulp van Google Earth. De data uit Google Earth worden weggeschreven naar een XML-formaat dat door Flash gelezen en geïnterpreteerd wordt. Het zijn overigens alleen de posities en bepaalde meta-data die daarbij worden uitgelezen. De kaart zelf is volledig geïllustreerd.
Op de kaart kunt je in- en uitzoomen. Wanneer je op een icoon klikt, krijgt je meer informatie te zien. Via de legenda kunt je bepaalde delen van de kaart aan- en uit zetten.

Ome Willem

uri:	http://www.omewillem.nl/
opdrachtgever:	Ome Willem
werkzaamheden:	illustratie, grafisch ontwerp, productie

Bij deze site stond de bekende Show van Ome Willem centraal. Je ziet het decor van Ome Willem als interface, met deur en al. De knoppen naar de verschillende pagina's zijn vellen papier die aan de wand achter het Ome Willem-figuurtje hangen. Wanneer je op een knop drukt, gebeuren en allerlei dingen die met die pagina te maken hebben. In de winkel kun je bijvoorbeeld aan de waslijn met petten en t-shirts trekken. De content pagina's heeft een knip-en-plak gevoel gekregen door de titels echt uit te knippen en in te kleuren met wasco en viltstift.
Naast een guestbook is er ook een verjaardagskalender die bezoekers kunnen invullen. Op hun verjaardag krijgen ze dan een heus sms'je met felicitaties van Ome Willem.

Lea Jurida

uri:	http://www.jurida.com/
opdrachtgever:	Lea Jurida
werkzaamheden:	illustratie, grafisch ontwerp, productie
werkzaamheden:	XHTML, Flash Actionscript 3

Lea Jurida is een sound designer. Bij haar site moest de nadruk natuurlijk liggen op geluid. Een interesante techniek die ik voor deze site bedacht, is de manier van content inladen. Normaal gesproken kunnen zoekmachines de content van een Flash site niet indexeren. Maar in dit geval laadt de Flash site xhtml content, wat gewoon de index.html is.

Kleuren speuren

uri:	http://kleurenspeuren.shapers.nl/
opdrachtgever:	Centraal Museum via Sikkens Foundation
werkzaamheden:	concept, illustratie, programmeren (Macromedia Director)

Met deze cd-rom leren basisschoolleerlingen van verschillende leeftijden leuke dingen over kleurenleer. Het is een speelbare leeromgeving die op een avontuurlijke manier toegang geeft tot een schat aan informatie. Door de actieve houding die wordt opgewekt, zijn leerlingen intensief bezig. Het overkoepelende spelelement zorgt voor de extra uitdaging de gehele cd-rom te doorlopen. Kleuren Speuren werd in 2004 genomineerd voor de Gouden Apenstaart.

strip-o-matic

uri:	http://strip.o.matic.shapers.nl/
uri:	http://onm.bnn.nl/page/stripeditor
opdrachtgever:	-
werkzaamheden:	Flash Actionscript 2, PHP/MySQL (amfphp)

Met de strip-o-matic kan de bezoeker zelf strips maken en opsturen naar zijn vrienden. Dit project begon eigenlijk als oplossing om de Onderweg naar Morgen-kijkers de wintermaanden door te helpen. Later heb ik het in mijn vrije uurtjes opnieuw gebouwd en er een tweetal speciale features aan toegevoegd: foto's uploaden en webcam-snapshots nemen.

Cubejunky

uri:	http://cubejunky.sjeiti.com/
werkzaamheden:	Flash Actionscript 3, PHP/MySQL (amfphp)

Lang geleden (toen computers nog zestien kleuren hadden) speelde ik weleens het spel Sokoban. Dat bracht mij tien jaar later op het idee om Cubejunky te maken. Mijn versie moest wel wezenlijk anders worden: het speelde zich af in drie dimensies en je moest door het schuiven van blokken op een bepaald punt geraken. Nog eens tien jaar later deed ik het dunnetjes over, maar nu echt in drie dimensies.

Knikkertijd

uri:	http://www.sjeiti.com/coderef.php?id=631
uri:	http://shapers.nl/media/lab/knikkeren/index.html
werkzaamheden:	Flash as2, PHP/MySQL (AMFPHP)

Uit een displacement-mapping test rolde een simpel en nostalgisch spel: knikkeren! Als je goed kijkt, zie je dat het licht van de onderliggende tegels en de binnenkant van de knikker gebroken wordt. Daarnaast wordt de weerkaatsing van knikker tegen knikker op een natuurkundig correcte manier berekend. Een klassieker in een digitaal jasje.

Frogs from space

uri:	original game
uri:	prototype remake
sound design:	Lea Jurida
werkzaamheden:	Flash Actionscript 2, PHP/MySQL (amfphp)

Als ik aan schapen denk, denk ik aan ontvoeringen door buitenaardse wezens (maar misschien ben ik de enige). Dit spel heb ik gemaakt om te kijken in hoeverre het mogelijk is dynamisch levels te genereren. De levels worden nu met XML ingeladen. Naast de grafische presentatie van een level staan hier ook uiteenlopende condities in beschreven die nodig zijn om een level te halen. Toch is de XML-structuur redelijk simpel gebleven.

Ron Valstar :: freelancer :: digitale media