In samenwerking met Waxle Ontwerp een responsive en retina optimized WordPress theme ontwikkeld.
Categorie: Webdesign
-
ROTS van Leeuwen
Responsive en retina ready WordPress theme ontwikkeld voor Waxle Ontwerp.
-
Loes & Reinier
Webshop voor de galerie van Loes & Reinier in Deventer. Ontwikkeld op basis van een mashup van 2 themes, met voor de galerie belangrijke functionaliteiten, zoals Expositie- en Kunstenaar-beheer, gekoppeld aan elkaar en aan de objecten, die beheerd worden met Woocommerce.
-
Coolminds: een one-page case-study
Voor een sollicitatie een ontwerp en inhoudelijk onderzoek gedaan voor een one-page variatie op de huidige Coolminds website.
Mijn insteek met betrekking tot de visie voor een nieuwe site; minder content en iets meer bravoure. Gezien de scope van de opdracht (enkele dagen) was het niet wenselijk de communicatiefilosofie van de huidige website radicaal om te gooien; de focus ligt nog steeds op de boodschap ‘wij hebben de specialisten voor uw klus in huis’, de verpakking van deze boodschap is alleen flink verandert.
One-page sites hebben veel minder ruimte voor uitgebreide artikelen dus de inhoud van de oude site is flink ingekort. Om de langere teksten en hun auteurs toch een goed platform te geven, is het voorstel om naast de one-page site een blog te ontwikkelen en de huidige langere teksten daar in artikel-vorm te plaatsten. Daarnaast is het advies is om de communicatie in de eerste linie te herschrijven naar simpelere uitingen.
Daar waar meer content wenselijk is, zijn popovers voorzien, zie bijvoorbeeld de popover bij de ‘diensten’ keywords. Detail pagina’s met betrekking tot cases in ‘Ons Werk’ werken volgens het lightbox principe.
Het ontwerp combineert de in de briefing voor de klus genoemde wensen met recente, en opkomende, trends in webdesign; forse typografie, focus op content, geen rommel; minimal, flat, responsive en een lichte verwassen kleurstelling.
De nu gebruikte Museo is een prima font, en doordat het al in het Coolminds logo gebruikt wordt, een goede basis de site, hier zit dus ook nog een verwijzing naar de ‘oude site’. Het beeldmerk is bewust weggelaten; beeldmerk en woordbeeld zien er niet bij elkaar ontworpen uit, iets wat dieper graven op internet bevestigd. De Museo vervangt daarmee het CM-beeldmerk als herkenbaar element voor Coolminds.
Niet uitgewerkt, maar wel bedacht, zijn subtiele CSS-animaties, zoals animatie on scroll. In dit ontwerp geen parallax. Bij het scrollen wordt een aantal visueel sterke elementen opgebouwd en een aantal controls worden bij passeren geduid. Voorbij de 100px scrollen maakt dat het menu een een vaste balk met kleiner logo van boven het beeld in animeert. Hover states mogen ook kleine slide en fade animaties bevatten.
-
Context: een proof-of-concept applicatie
Als sollicitatieopdracht een semi-werkend interactief woordjes overhoor applicatie gebouwd. De uitdaging voor deze proof-of-concept was om mee te gaan met de trend van minimale interfaces; dus geen traditionele inputvelden (wat je verwacht dat editable is, is dat ook), opslaan gaat automagisch – de UI bestaat dan in de basis alleen nog uit een knop nodig om nieuwe vakjes bij te voegen en eventueel te deleten. Dit is het deel waar de focus van het uitwerken van de functionaliteit op ligt; het is mogelijk titels, teksten e.d. te editten en woordjes toe te voegen of te deleten, overige functionaliteit is niet uitgewerkt.
Er kan begonnen worden met een bestaande vaste lijst – als een element niet editable is, verschijnt daar een ‘locked’ icoontje bij. Ook is er rekening gehouden met langere beschrijvingen voor een woord in kolom 2, zodat deze applicatie breder inzetbaar is dan alleen voor talenlijstjes.
-
Werkplek Zwolle
Voor Puur!fct op basis van door hen aangeleverde logo, kleurenschema en wireframe een site ontworpen en in HTML/CSS uitgewerkt.
-
Previous mr10.net
Een vorige mr10.net was een showcase voor het door mr10 ontwikkelde open source Gallery Component voor Flash MX. Daarnaast diende het als fotografiedagboek voor een reis door Australië.
Ook zijn een eerder dagboek op basis van het Gallery Component, mr10’s afstudeeropdracht en zijn stageopdracht (gemaakt in Flash 4/5) online gearchiveerd.
-
Interactieve PDF Reader
Deze uitgebreide applicatie werd in 2006 voor Zicht ontwikkeld. De opdracht was om de PDF met de begroting van Noord Holland online te kunnen presenteren. De in Flash ontwikkelde reader kon door een AMFPHP database koppeling de tekst doorzoeken, je kon bookmarks opslaan en en notes aan bepaalde pagina’s toevoegen. Het was mogelijk delen van teksten, losse pagina’s of spreads printen vanuit de applicatie. Pagina’s konden ingezoomd of als spread getoond worden. Alle kleuren, teksten en logo’s werden extern ingeladen (met als doel de reader breed in te kunnen zetten), de inhoudsopgave en bladerfunctie werden dynamisch gegenereerd.
De website URL en achterliggende databse zijn long gone – wat overblijft zijn deze screenshots en de source files.
-
Krant in de Klas
[wooslider animation=”slide” slider_type=”attachments” limit=”4″ thumbnails=”true”]
Voor Stichting Krant in de Klas heb ik een site ontworpen waarmee zij hun informatie en aanbod beter kunnen ontsluiten. De site heeft als doelgroep leraren en beleidsmakers. De ontwikkeling van deze site is gedaan door Acato. Daarnaast heb ik ook het logo en bijbehorende huisstijl ontworpen. Krant in de Klas is inmiddels Nieuws in de Klas geworden.
-
Cartoon van de Maand
Deze site werd voor stichting Krant in de Klas ontwikkeld; zij scanden dagelijks alle cartoons (niet comics) uit de krant, en hielden met een selectie van die cartoons, maandelijks een verkiezing. De site was voor jongeren tussen de 10 en 18, en is een mooi voorbeeld van naadloze integratie tussen HTML en Flash.
-
Sloterwijk & Heinen Bedrijfsmakelaars
[wooslider animation=”slide” slider_type=”attachments” limit=”4″ thumbnails=”true”]
Sloterwijk & Heinen is een jong makelaarskantoor in Emmeloord waarvoor het logo, de huisstijl en site ontworpen en uitgewerkt werden. mr10 was in deze verantwoordelijk voor alle uitingen van Sloterwijk & Heinen. Er werd bijvoorbeeld autobelettering, presentatiemapjes, rolbanners, flyers, vlaggen, raamdecoratie, borden en advertenties in de krant ontwikkeld.
De door mr10 ontwikkelde site is intussen vervangen; ten tijde van het oprichten van Sloterwijk & Heinen, was het begrip aankoopmakelaars nog niet ingeburgerd en de site was toendertijd ingericht om dat begrip te verklaren. In de loop der jaren burgerde de ‘aankoopmakelaar’ in en veranderde de focus van Sloterwijk & Heinen van aankoop- naar bedrijfsmakelaars, waartoe de site een upgrade ondergaan heeft.
-
Die Eet & Sport
Samen met Thoas.nl gewerkt aan de website voor Die Eet & Sport. Thoas was verantwoordelijk voor ontwerp huisstijl, logo en de fotografie, mijn taak was het opzetten en stylen van de WordPress site.
-
De Zuinigste Rijder
Een interactieve bouwplaat, waarbij je het uiterlijk en de accessoires op de auto zelf kunt bepalen, werd in opdracht van ARC-Amsterdam (nu Saatchi & Saatchi | Leo Burnett) ontwikkeld voor de campagne ‘de Zuinigste Rijder’. Deze Flash gebaseerde site heeft de mogelijkheid om je eigen patroon voor op de auto te uploaden. De bouwplaat wordt gegenereerd als PDF; die is te printen, zodat je je eigen auto ook daadwerkelijk kunt bouwen.
P.S. Het motorgeluid houdt na 3 keer op. -
Inertia Creative
Voor een Canadese partner werd een interactieve, creatieve Flash site ontwikkeld, waarbij elke sectie een navigatie experiment is. Deze site uit 2005 was zijn tijd ver vooruit, waardoor de site er anno 2011 nog steeds fris uitziet; alleen jammer van de verouderde nieuwsberichten.
-
Dutch Premium Horses
Ontwikkeling van huisstijl een communicatie voor Dutch Premium Horses, een startende onderneming die paarden en expertise naar China uitvoert. Er werden voor DPH, naast een standaard correspondentiereeks, presentaties, flyers en rollbanners ontworpen. De kleurstelling is gebaseerd op de in China belangrijke kleuren blauw en goud, terwijl nadrukkelijk weggebleven is van de ‘slechte’ kleuren wit en rood. De DPH site is op WordPress gebaseerd, met from scratch gebouwde templates en een custom op paarden gerichte admin sectie. De site is tweetalig opgezet.
[wooslider animation=”slide” slider_type=”attachments” limit=”4″ thumbnails=”true”]
-
Sovon Website
Voor Sovon (Stichting Vogelonderzoek Nederland) ontwikkelde ik samen met Thoas.nl de vormgeving van de nieuwe website. Alhoewel dit project de komende maanden nog zal groeien, is een eerste versie van de site online gegaan op Sovon.nl.
Sovon Vogelonderzoek Nederland is een non-profit organisatie die in Nederland het voorkomen en de ontwikkeling van Nederlandse vogels bijhoudt. Sovon kijkt daarbij naar de voor- of achteruitgang van vogels, en naar het hoe en waarom daarvan. De resultaten van de tellingen die Sovon organiseert vormen een basis voor het natuurbeleid en beheer in ons land. Ongeveer 7500 vrijwillige vogelwaarnemers vormen de spil van de organisatie.
Op basis van een door Sovon opgezet Communicatieplan en Functioneel Ontwerp hebben we een dertig-tal belangrijke pagina’s op de site vertaald naar wireframes en daarna ontworpen. Een selectie screenshots van de ontwerpen is hier te bekijken.
We hebben gekozen om de verschillende doelgroepen van Sovon, namelijk de content die voor de Wetenschappelijke- en zakelijke bezoekers van belang is, met kleurpaden te scheiden van de content die bedoeld is voor de Belangstellenden- en waarnemers; zo is alles dat voor de waarnemers van belang is groen gecodeerd, alles dat met actualiteit te maken heeft volgt een oranje pad, en de wetenschappelijke informatie is in de blauwen gevat.
De nieuw ontworpen pagina’s werden door mij uitgewerkt in HTML5/CSS3, zodat hun eigen ontwikkelaar deze bestanden konden koppelen aan Drupal.
… Sovon is een veelzijdige club. Voor de vormgevers leek het mij een nachtmerrie om daarmee aan de slag te moeten gaan. Maar niets van dat alles, zij hebben zich uitstekend van hun taak gekweten.
Theo Verstrael (directeur) – Sovon Nieuws juni 2012
-
Sovon Vogelatlas
Op basis van de, ook door ons ontworpen, website van Sovon, samen met Thoas.nl een subsite voor de Vogelatlas ontworpen die duidelijk gelinkt moest kunnen worden aan Sovon.nl, maar met een eigen smoeltje. Het Vogelatlas Logo werd ook door ons ontwikkeld.
