BNNVARA.nl

Achtergrond: Een nieuwe online strategie voor BNNVARA

In 2014 zijn BNN en VARA samen gefuseerd tot de grootste publieke omroep van Nederland (BNN-VARA). Waar beiden merken BNN en VARA samen bleven bestaan.

In 2017 is besloten om de merken BNN en VARA te fuseren in BNNVARA. Vanwege veranderingen binnen het medialandschap en die intern plaatsvonden. Moest er een nieuwe, meer toekomstbestendige identiteit gecreëerd worden.

Dit was het startsein van de grootste schoonmaak van BNNVARA ooit, waarbij alle merkuitingen zouden worden aangeraakt. Waar de afdeling digital met een passende digitale strategie moest komen, in een landschap waar mensen anders media zijn gaan consumeren.

Mijn rol

Tijdens de ontwikkeling van het BNNVARA ecosysteem ben ik actief geweest als UX/UI designer. Mijn werkzaamheden varieerde van user research, design workshops, prototyping tot pixel perfect designs creëren en Front-end Development.

Het team

Er is door 3 SCRUM teams aan het project gewerkt. Verder is er intensief samengewerkt met marketing, communicatie, developers, product owners, head of digital en de directie van BNNVARA. Tijdens het project werkte ik samen met een UX- en Visual designer om een eerste versie van bnnvara.nl te realiseren, werken aan o.a. gebruikersonderzoeken, design workshops organiseren, interaction design en visual design.

Tijdens de 2e iteratie van het project zijn er 2 personen vanuit Informaat ingehuurd, een Sr. UX strategist en een interaction designer. Voor de 3e iteratie is een Sr. visual designer ingehuurd van Informaat (Edwin Nollen), i.v.m. het wegvallen van onze eigen visual designer.

Uitdagingen

Vanuit de missie positieve sociale impact creëren en een manier vinden om bezoekers een online beweging te laten vormen rond het merk BNNVARA.
BNNVARA sturen naar een meer digital first aanpak, waardoor een gebruikersvriendelijke en diverse digitale ervaringen mogelijk gemaakt moest worden en het merk meer naamsbekendheid krijgt.
Een coherent BNNVARA design systeem ontwikkelen, met als centrale basis de nieuwe BNNVARA huisstijl ontwikkelt door Dog & Pony. Om zo de ontwikkeling van de digitale producten efficiënter, sneller en schaalbaar te maken.

Design proces

1e fase

Na de aankondiging van de fusie (1e iteratie) van BNN en VARA, moest bnnvara.nl in een relatief korte tijd ontworpen en gebouwd worden. Dit vroeg om een pragmatische aanpak. Opnieuw kijken naar de inzichten van onderzoeken voor bnn.nl en vara.nl. Vervolgens opnieuw toetsen bij de leden en bezoekers van BNN en VARA. Daarop is een snelle analyse uitgevoerd om te kijken naar de overeenkomsten, die vervolgens ingezet konden worden om persona’s op te stellen en een grove user journey. Dit vormde de basis hoe bnnvara.nl werd ontworpen, gebouwd en gelanceerd binnen 6 weken tijd.

2e fase

Nu dat bnnvara.nl een tijd up en running was kon de balans worden opgemaakt. Leren van onze bezoekers en hun ervaringen. Tevens was dit een mooi moment om te vragen naar hun mediaconsumptie, concurrentie, etc. Een enquête is uitgezet onder leden en bezoekers van bnnvara.nl, dit resulteerde in 755 respondenten. Die ons nieuwe inzichten gaven om te verbeteren.

Nadat de enquêteresultaten binnen waren wilden wij meer de diepte in gaan om de user-needs op te halen bij de bezoekers. Daarvoor hebben wij 5 personen uitgenodigd voor een diepte interview en user test. Met inzichten van de enquêteresultaten, analytics en Hotjar data, user tests en diepte-interviews kon het design van bnnvara.nl verder worden geoptimaliseerd en gerealiseerd worden.

3e fase: nieuwe online strategie

Met alle inzichten die uit de vorige iteraties van bnnvara.nl zijn gehaald, besloot de afdeling digital dat het tijd was voor een nieuwe online strategie. Door het veranderende landschap van de Nederlandse publieke omroepen, was het tijd om een strategie te bedenken waarmee BNNVARA zich in de toekomst kan meten. Dat jaar lanceerde de NPO ook een vijandige strategie, door gebruik te maken van al het online materiaal van de omroepen. Ook de gebruikelijke terugkerende bezuinigingen.

Jarenlang was de strategie: ‘Wij zenden, jullie consumeren’. Het was tijd om na te denken en te onderzoeken hoe wij BNNVARA in het toekomstige digitale medialandschap kunnen positioneren.

Uitdagingen (Fase 3)

Vanuit de missie positieve sociale impact creëren een manier vinden om bezoekers een online beweging te laten vormen rond het merk BNNVARA.
BNNVARA sturen naar een digital first aanpak, waardoor een gebruiksvriendelijke en diverse digitale ervaringen mogelijk gemaakt moesten worden
Een coherent BNNVARA design systeem ontwikkelen, met als centrale basis de nieuwe huisstijl ontwikkelt door Dog & Pony. Om zo de ontwikkelingen van de digitale producten efficiënter, sneller en schaalbaar te maken.

Onze visie is dat we alle gebruikers het gepersonaliseerde platform bieden, waar ze zich meer en meer betrokken voelen bij BNNVARA, omdat ze daar dagelijks de meest waardevolle content ontdekken en aangezet worden om mee te doen.

Workshops

Om iedereen te proberen te overtuigen van de waarde van dit onderzoek, zijn er door mijn collega UX strategist een aantal workshops opgezet, zoals story- en impact mapping. In ruil daarvoor zouden de workshops ons waardevolle zakelijke richting geven en een mental model opleveren. Uit de workshops kon een product roadmap worden uitgezet. Ook gaf de workshop richting aan gebieden waar meer inzichten opgehaald moesten worden.

Onderzoeken

Diepte interviews, enquêtes, data analyses aangevuld door data analisten en marketing, Hotjar heatmaps en recordings, meerdere design workshops, prototypes (invision & principe), usability testing, usability hub voor preference tests.

Het design verder uitwerken
Parallel aan deze workshops is gezamenlijk met de designers gewerkt aan het idee van een nieuwe bnnvara.nl. Wij kwamen met het een idee van een ecosysteem. Ieder programma van BNNVARA had zijn eigen website en huisstijl. Wij probeerde cross-navigatie en consumptie stimuleren, maar faciliteerde dit onvoldoende. Hieruit is de volgende hypothese ontstaan:

Het centraliseren van alle programma’s van BNNVARA in één ecosysteem zou cross-navigatie stimuleren en de kijkersloyaliteit, de bezoekduur en het aantal paginaweergaven verbeteren.

Om meer naamsbekendheid te creëren voor BNNVARA zijn wij gaan kijken op welke manier alle programma’s op bnnvara.nl zouden kunnen worden ondergebracht. Na wat semi-succesvol experimenten en schrappen van een hoop ideeën, concentreerde wij ons op het concept waarvan wij dachten dat het meeste potentieel had.

Inspiratie halen uit apps zoals YouTube and Netflix en de manier hoe zij aanbevelingen en gerelateerde content gebruiken. Zouden wij soortgelijke dingen kunnen doen met een enorme hoeveelheid gevarieerde inhoud van alle programma’s, waaronder verschillende soorten video, artikelen en audio.

Ik besloot het concept van ‘kanalen’ (vergelijkbaar met die op YouTube) te testen en te kijken of dit voor ons zou kunnen werken. Alle redacteuren zouden hun inhoud nog steeds op dezelfde manier kunnen maken, alleen online publiceren zou op een andere, meer algemene manier gebeuren.

Concept valideren
Op basis van eerder onderzoek en nieuw onderzoek, zijn nieuwe persona’s gecreëerd. De persona’s zouden dienen als actors in een design sprint die werd gefaciliteerd om het concept te valideren en tot nieuwe inzichten te komen. Het doel van de design sprint was om erachter te komen hoe we mensen ertoe kunnen brengen, om meer BNNVARA-content te laten consumeren over meerdere programma’s. De resultaten van de prototype test waren redelijk positief. Maar wat belangrijk was, ze gaven ons veel inzichten en patronen die ons konden helpen bij het bereiken van onze doelen om mensen in een ‘content-loop’ te krijgen.

Scoping down
De ambitie van het concept was hoog. We hadden ideeën voor gamification, lidmaatschap niveaus, het bouwen van een grote online community en een recommendation api. Wij besloten om de eerste 3 voorlopig te parkeren om onze inspanningen te richten op het verkrijgen van de juiste aanbevelingen en gaandeweg te leren. Ons onderzoek had uitgewezen dat dit de meeste impact zou hebben met de minste inspanning. Uiteindelijk is het concept, inclusief het community gedeelte, in kaart gebracht om meer context te creëren voor de stakeholders en ontwikkelaars.

Wireframes & mockups

Tijdens de ideeënvorming is er veel geschetst en aan low fidelity wireframing gedaan, zodat we een goed overzicht hadden van hoe het ontwerp vorm moest krijgen. We zijn verder gegaan met het itereren van een aantal wireframes, concepten en een hebben daarvoor guerrilla tests gehouden met stakeholders en mensen op straat.

Designs

Na het verwerken van alle feedback, is een eerste mockup gemaakt. Het combineerde de resultaten van de visual design verkenning die ik samen met mijn collega visual designer had gedaan, om dichtbij het merkverhaal te blijven.

BNNVARA Design systeem

Parallel aan het design van BNNVARA.nl is een design systeem gerealiseerd, met Atomic design van Brad Frost als methode om het BNNVARA design systeem mee te ontwikkelen. Atomic design zorgt er mede voor dat de digitale producten van BNNVARA efficiënter, sneller en schaalbaar te ontwikkelen zijn. Het design systeem is vervolgens vastgelegd in Sketch als bibliotheek en in Storybook als frontend React componenten.

Afsluiting

Het grootste deel van het ontwerpwerk voor dit project is nu gedaan en grotendeels geïmplementeerd door de developers. Terwijl we aan het ontwerpen waren, werkten zij hard aan onze nieuwe architectuur (api-driven). Tijdens dit proces waren er veel ontwikkelingsachterstanden, waardoor de eerste release van de nieuwe website werd uitgesteld. Anno 2022 wordt er op product niveau verder ontwikkelt aan het BNNARA ecosysteem.

Bekijk bnnvara.nl

Learnings

Dit project was buitengewoon ambitieus en ik moest beroep doen op al mijn vaardigheden. Door te improviseren en soms mijn tekortkomingen te accepteren, kon ik voor de meeste uitdagingen oplossingen bedenken.
De nieuwe strategie vroeg om een volledig nieuwe technische infrastructuur en architectuur. Dat was verwacht, maar de implementatie duurde veel langer dan gehoopt.
Hoe meer we hebben getest, hoe meer het ontwerp is versneld. Nog een geweldig getuigenis van design thinking.
De ontwikkeling van het nieuwe designsysteem voor BNNVARA kosten veel inspanning. Het overtuigen van stakeholders is lastig, mensen vallen snel terug op eigen smaken.
Ik heb op de harde manier geleerd dat politiek een integraal onderdeel is van de ontwerpstrategie. Ik kwam er ook achter hoe moeilijk het kan zijn om mensen te overtuigen van de waarde van je inspanningen. Het is hard werken!