Het nieuwe gezicht van Sprout

Sprout is een mooi merk dat zich richt op het New Boys Network. Dat is, met een knipoog naar de oude garde, de nieuwe generatie ondernemers. De mannen en vrouwen die met hun ideeën, aanpak en doorzettingsvermogen zo bepalend zijn voor de  toekomst van Nederland. Sprout inspireert ze met eigen artikelen, onderzoeken, statistieken en exclusieve evenementen. Dagelijkse via de website. En met nog meer diepgang in het dubbeldikke, 2-maandelijkse Magazine.

Sinds kort heeft het merk Sprout online een nieuw gezicht. UNITiD tekende met veel plezier voor  interactie concept en visual design van de nieuwe website.

De opdracht

In mei introduceerde Sprout haar nieuwe inspiratieconcept. Dat is: All You Can Absorb. Voor 8,25 per maand hebben ondernemers onbeperkt toegang tot alles wat Sprout te bieden heeft.

Opdracht werd om een nieuwe online omgeving te ontwerpen die bijdraagt aan de nieuw gekozen koers. Met een paar randvoorwaarden.

  • Doe het slim: vanuit 1 CMS willen we alle soorten berichten zonder al te veel omhaal kunnen plaatsen.
  • Doe het snel: we willen binnen 8 weken live.
  • Doe het netjes: zorg voor eenvoud en werk in lijn met de stijl die is ontwikkeld voor het tijdschrift.

Onze aanpak

Ok, het moest snel. Belangrijk werd dus om ook snel een gevoel te krijgen voor het soort nieuwssite dat Sprout wilde worden. Een snelle nieuwssite? Voor de korte snack en met een hoge nieuwsdichtheid. Of meer inspirerend? Slow news, met veel diepgang en verbeelding, de lezer achterover laten leunen, zorgen dat-ie even de tijd neemt. Of iets daar tussenin? Of daarboven? Of juist eronder?

Om dit gevoel scherp te krijgen, schetsten we in een twee dagen een set uitgewerkte ‘praat-platen’. Zo kan het worden, riepen we daarbij. Maar mogelijk bedoelen jullie van Sprout iets heel anders. Schiet maar!

image1

De uitkomst hiervan, samen met de keuzes die tegelijkertijd gemaakt werden voor het magazine, vormden de basis voor het vervolg van het visual design traject.

image2

 

Het concept

Met de introductie van het nieuwe abonnementsmodel kwamen er 3 type gebruikers:

  • Gratis gebruikers
  • Friends (geregistreerde gebruikers)
  • Members (geabonneerde gebruikers).

Uitgangspunt was om ieder type gebruiker een grootse ervaring te bieden. Om hem in ieder geval niet uit zijn flow te halen als hij een artikel aan het lezen is. Tegelijkertijd was het van belang om aan de business doelstellingen te denken, en dus voor conversie te zorgen. Dat is: Zet ‘Gratis gebruikers’ om in ‘Friends’. En maak van ‘Friends’ als het even kan ‘Members’.

Het converteren moet subtiel zijn en de gebruikerservaring niet in de weg staan. Alle gebruikers moeten kunnen proeven van de content die Sprout te bieden heeft, maar ook de voordelen inzien van de vele extra’s van een All You Can Absorb abonnement. Als Member kun je bijvoorbeeld gratis naar alle events, terwijl je daar als Gratis gebruiker iets voor mag betalen.

Minder navigatie

Sprout is rijk aan een grote hoeveelheid content. Om voor de bezoeker focus aan te brengen in het aanbod van Sprout hebben we de topnavigatie teruggebracht tot een minimum aantal pijlers die al deze verschillende vormen van content ondervangen. En op de homepage hebben we iets meer visuele hiërarchie aangebracht, zodat je als lezer geholpen wordt bij het bepalen wat urgent en belangrijk is, en welke informatie meer secundair is. Bijvoorbeeld door focus aan te brengen in het nieuws dat net binnen is en het exclusieve nieuws van Sprout. De detailpagina’s krijgen verder de volledige focus en zijn daarom gecentreerd en vormgegeven met veel extra witruimte.

Online magazine concept

Vanwege de al geplande releasedatum van het nieuwe magazine, wilde Sprout met de nieuwe website zo snel mogelijk live gaan. Om het magazine en de website qua look & feel goed overeen te laten komen, hebben we de nieuwe stijl van het magazine onderzocht. We hebben  gekeken naar kleurgebruik, vorm en typografie om te beslissen wat voor de website te gebruiken was is en wat niet.

image3

Het uitgangspunt voor het design van de website was het magazine concept. Maar waar je in een papieren magazine vrij ver kunt gaan in het mixen van verschillende stijlen, zijn er online wat meer beperkingen. Het inladen van veel verschillende fonts inladen gaat bijvoorbeeld ten koste van de laadsnelheid, dus we hebben variatie in fonts spaarzaam ingezet. Verder maakt het gebruik van (te) veel verschillende design stijlen het een efficiente opbouw in componenten extra complex, waardoor het responsive gedrag (het gebruik van de site op meerdere devices) onvoorspelbaar wordt.

De kunst werd daarmee om het nieuwe ‘Sprout gevoel’ in een zo flexibel en ‘licht’ mogelijk design te vatten, dat snel te implementeren is.

Dit betekent dat we het ervoor gekozen hebben om componenten te ontwerpen die herhaaldelijk terugkomen op verschillende pagina’s en daarmee goed herbruikbaar zijn. Daarnaast ontwikkelen we – als altijd – een styletile, een compacte stijlgidswaarin titels, kleurcoderingen en veelvoorkomende assets worden gedefinieerd. Dit zorgt voor consistentie en werkt tevens als basis voor de CSS.

image4

 

 

Scanbare fonts

Zo hebben we veel witruimte gebruikt om pagina’s rustig te laten ogen, en onderscheid in blokken aangebracht met subtiele dividers. Waar we de nadruk op hebben gelegd is lees- en scanbaarheid. Na verschillende fonts bekeken te hebben is de keuze gevallen op drie fonts. Gotham hebben we gebruikt voor titels, body teksten en metadata, Core Mellow voor quotes, en Kepler Std voor het inleiden van artikelen.. Deze fonts, voorzien van ronde vormen, zorgen ervoor dat de site niet ‘te vierkant’ wordt.

 

Bekijk het resultaat: www.sprout.nl