Waarschuwing: Dit is een nogal nerdy blog over design. Verder lezen op eigen verantwoordelijkheid.
282 uur bouwen, fouten maken, overleggen, frustratie, ontwerpen, wissen, weer ontwerpen. Vele berichten van familie: “zou je niet eens wat meer rust pakken?”. Vele keren “waarom werkt dit niet?”. Nog vaker: “huh dit werkt.” En na 282 uur is hij af. De bouw van de Beerders website in een notendop.
De website staat nu al even online. Ondanks dat er al tientallen kleine veranderingen in zaten wil ik toch even een terugblik naar het ontwerpproces plaatsen. Onze gemiddelde contact vindt deze blog vast niet heel interessant. De design-minded vast wat meer. First of all; voel je alsjeblieft vrij vragen te stellen. In de comments of op @Cyclia of via michael@beerders.nl ben ik altijd bereid keuzes toe te lichten. Design is een fantastisch proces en daar praat ik graag over.
Transparantie, rust, duidelijkheid, vertrouwen.
De kernwaarden van Beerders zijn transparantie en rust. Voor de website kwamen daar duidelijkheid en vertrouwen als logische subkernen bij. Iedere pagina, waar je ook komt, moet deze vier woorden uitstralen. Van de home tot de welkomstpagina (de pagina die je ziet na het betaalproces), overal vind je transparantie, rust, duidelijkheid en vertrouwen terug. Menig design is gesneuveld bij de bouw van de website. Na het ontwerpen van een pagina moest hij voldoen aan deze vier woorden. Deed hij dat niet, dan was het exit en weer vrolijk opnieuw beginnen. Vooral het kopje ‘rust’ vergde nogal wat slachtoffers.
Typografie
Voor de bouw van beerders.nl heb ik me nogal verdiept in typografie. Ondanks dat het altijd al een grote hobby van me was had ik er, op wat standaardkennis na, nooit echt wat van begrepen. Doe ik dat nu wel? Zeker nog niet genoeg, maar ik ben volgens mij wel op de goede weg. De fonts die je nu op Beerders ziet zijn ‘Oswald’ en ‘Merriweather’. Beerders gebruikt Oswald voor de headers. Oswald is een robuust font, een sans-serif dat vooral bruutheid uitstraalt. Ik vind Oswald in het groot het beste tot zijn recht komen. Het is tevens een speels sans-serif. In het font ga je weinig zien aan opmerkelijke details. Speelsheid included, opvallende characters excluded. Alles valt mooi in het plaatje.
Voor body text heb ik lang zitten tobben tussen sans-serif Open Sans en serif Merriweather. Merriweather is uiteindelijk het gekozen lettertype geworden. Merriweather heeft de serifs, maar heeft ook het speelse karakter. De verschillende diktes in de karakters zelf maakt het van een streng lettertype naar een speels maar vertrouwelijk lettertype. Raden welk woord doorslaggevend werd voor mijn keuze is niet lastig meer.
Ik wil nog even twee pagina’s apart doornemen. Ik begrijp dat als je al door de vorige bult tekst heen bent, dat je waarschijnlijk óf een grote fan van me bent, óf zelf een designer bent. Aangezien mogelijkheid 1 volgens mij niet zo groot is wil ik je in ieder geval bedanken voor de leestijd. Ik hoop dat ik je wat entertain.
Home
De Homepagina groet je direct met de video in de eerste slider. Het verhaal achter het concept moet binnen tien seconden duidelijk zijn en ik denk dat dit slaagt. Op de tweede slider zie je nu een ‘saaie’ slide met een tekst die leidt naar de Join-Us pagina. Op het moment dat box II er is, nu hopelijk met bedrukte boxen (lees hier meer info, mocht je die nog niet hebben gelezen), wordt deze slide compleet omgegooid naar een foto van de box die de inhoud laat zien. Dan is buiten het verhaal ook direct de vulling duidelijk en sterk. Zoals het hoort.
Direct daaronder vind je ‘Why’. Marketeers onder ons weten dan direct waarover dit gaat. We zijn Beerders niet om geld begonnen. Zeker niet. Het gaat dieper dan dat. We willen waarde toevoegen.direct een klein verschil zijn in iemands leven. That’s why we ‘start with why’. ‘What’ is hetzelfde verhaal als home. Ook hier komt later een duidelijke foto met informatie. Het is tot die tijd even schipperen. De counters daaronder staan er om drie redenen. Die eerste twee zijn transparantie en vertrouwen. Direct zie je dat we bestaan; hoeveel we af hebben geleverd en hoeveel leden we op dit moment hebben. Daarnaast is de klok ook om een mate van urgentie aan te bieden. Dit gaat natuurlijk volledig tegen het principe van rust in, maar dat heeft een reden: duidelijkheid. Met de counter is het voor bestaande klanten direct duidelijk wanneer de dozen ongeveer ontvangen kunnen worden (maximaal 1 week na afloop van de counter). Ook is het voor nieuwe klanten in één oogopslag duidelijk tot wanneer ze kunnen bestellen voor de volgende maand. Aangezien de conversie aan het eind van vorige maand stukken hoger was dan eerder in dezelfde maand kunnen we ervan uitgaan dat dit werkt.
Tot slot van deze blog komt mijn relaas over de blog, maar daar heb ik weer een ander kopje voor…
Blog
De pagina’s met een bericht zelf telt maar weinig elementen. Dat is een bewuste keuze. Ik ben een groot fan van Medium; de leesbaarheid op hun website is ongeëvenaard. Waar Medium meer elementen implementeert, probeer ik de rust juist te bewaren door weinig te implementeren. Door de lijnbreedte vrij breed te maken en de tekstgrootte stukken groter dan gemiddeld te maken straalt hij in mijn ogen openheid en transparantie uit. De elementen kunnen nog stukken beter vormgegeven worden. Het blijft een work in progress. Maar de start is er. Een goed begin…
Over de rest van de huisstijl komt nog een artikel Dit zal in combinatie gaan met MNMM, die daar ook flink mee bezig is geweest. Wordt vervolgd dus…
Geef een reactie