Kempen.com: niet zomaar een bank website.

Het design-proces van een prachtige corporate website: kempen.com.

Dit is niet zomaar een bank website, gemaakt door een mooie mix van Nederlandse creatieve bureaus.

Mmm, een website voor een B2B bank…

Toen Kempen ons vroeg de nieuwe website te ontwerpen en bouwen was ik sceptisch. Ja, banken hebben zichzelf de afgelopen jaren opnieuw uitgevonden, maar goede concepten en designs worden in die wereld nog regelmatig tegengehouden door juridische rompslomp, conservatisme, angst en de strijd tussen interne afdelingen om een aandeel van screen real estate. Maar dit keer was dat niet het geval. Dit keer heeft het verhaal een heus happy end met 🌈s &🦄s.

Kempen homepage animatie met het Kempen hoofdkantoor op de voorgrond.

Geïntegreerd design-proces

Voor een goed werkend ontwerp moeten alle elementen samenkomen: concept, copy, brand design, visual design, interaction design, fotografie en animatie. Dat is in elk project een uitdaging, maar was het hier zeker omdat er drie agencies bij betrokken waren, alle met hun eigen specialiteit, mentaliteit en focus. De mix bestond uit:

• KesselsKramer voor merkpositionering, identiteit en concept.
• Van Santen & Bolleurs voor fotografie van de belangrijkste beelden.
• TamTam (wij) voor het concept van de website, design, animaties en het bouwen ervan.

Dit proces verliep niet lineair. Deels omdat de merkpositionering en het concept nog niet klaar waren toen wij begonnen met het design voor de website, maar ook omdat we elkaars expertise respecteerden en samen iets moois wilden maken. Het ontwerpproces zag er dus ongeveer zo uit:

Ons design-proces.

Mijn takeaway is dat zoiets alleen werkt als de mensen van de verschillende agencies nauw met elkaar en de klant samenwerken, terwijl ze ondertussen samen het algehele proces en de grotere doelen waarborgen.

Haute finance boutique?

Startpunt voor de website was de nieuwe merkpositionering van Kempen die KesselsKramer aan het ontwikkelen was. Op basis daarvan gebruikten we de term ”haute finance boutique” — denk aan sjieke horloges en fashion magazines. Dit vanwege de niche waarin Kempen opereert. Maar als we ons alleen daarop zouden richten zou het een stap terug zijn naar hoe het bankwezen was. Dus wilden we die traditionele, sjieke stijl vermengen met een gevoel van toewijding, innovatie, internationale focus en Dali-achtig surrealisme.

Mood board door onze designer, nog vroeg in het project.

Hier kun je zien dat KesselsKramer en wij op dezelfde golflengte zaten: KesselsKramer liet ons wat bijzondere stilleven foto’s zien die Van Santen & Bolleurs hadden gemaakt voor andere klanten en onze designer Dionne verwerkte vervolgens een stockfoto van een stilleven in het ontwerp van de homepage om de klant te inspireren. Kempen vond die beelden zo goed dat we toen speciaal voor hen foto’s van bijpassende stillevens zijn gaan maken. custom stilleven foto’s voor ze zijn gaan maken.

Evolutie van de homepage

De homepage is een belangrijke pagina voor het maken van impact. Hier kun je de evolutie van het design terugzien (tik om te zoomen & swipen):

Eerste stijlstudie van een home/landing page.

De versie met het eerste stilleven dat onze designer koos uit stock fotografie.

Concept van vlak voor de Van Santen & Bolleurs fotoshoot.

Eerste versie van de animatie met het Kempen-gebouw op de voorgrond. Deze versie bracht wat discussie teweeg over de kleuren.

Still van de uiteindelijke animatie, in de browser.

Stilleven fotografie met subtiele animaties

Al vroeg in het project was het onze visie om een kwalitatieve website neer te zetten met een diepe focus en impact, die tegelijkertijd ook verfijnd is. Hierin spelen de stilleven foto’s van Van Santen & Bolleurs een essentiële rol omdat we de user interface een minimale rol laten spelen.

We voegden aan de foto’s subtiele animaties toe om het verhaal op een rake, webby manier op de bezoeker over te brengen. Hieronder het ontwerpproces van de hoofdanimatie van Asset Management:

Het eerste concept/idee.

Fotoshoot bij Van Santen & Bolleurs met een hele dure, geleende Bonsai :)

De foto die we van Van Santen & Bolleurs aangeleverd kregen.

De foto in het design, nog zonder de nodige aanpassingen in positionering en schaal om het beeld geschikt te maken voor de meest gangbare schermgroottes en -resoluties.

Eind resultaat op de website. Kijk op kempen.com voor de animatie met flikkerende parels.

Alle beelden custom-made

De belangrijkste beelden zijn allemaal op maat gemaakt door Van Santen & Bolleurs, zodat ze zich echt thuis voelen op de website:

Op maat geschoten beelden in corresponderende stijl.

De volgende stap

Na dit creatieve proces zullen we ons meer op de business gaan richten. Het is nu een prachtige corporate website, maar moet meer zijn dan dat: hij moet nieuwe klanten genereren en waarde toevoegen voor bestaande klanten. In de volgende fase zullen we Salesforce implementeren, een klantenportaal en meer data gedreven features en campagnes.

Offline is ook cool:) Kempen heeft haar kantoor ingepakt om de rebranding te kickstarten.

Trots

We zijn enorm trots op de website voor Kempen en hopen dat hij de impact zal maken die we voor ogen hadden. Veel dank aan het marketingteam van Kempen, dat ons veel creatieve speelruimte gaf en ons wist te managen met een mooie balans tussen de eisen vanuit de business, vrijheid en plezier.

Ik ben strateeg en consultant bij TamTam en vanaf het begin bij dit traject betrokken. Je kunt me bereiken via jeroen@tamtam.nl

Vond je dit een leuk verhaal? Klik dan op het hartje hieronder om het met anderen te delen. Dank je :)