Slimmer ontwerpen voor digital commerce: zonder concessies tijd en geld besparen

Iwan Blokzijl   •  15 augustus 2016

Wanneer is het ontwerp van een webshop succesvol? Het moet er natuurlijk fantastisch uitzien en direct een wauw gevoel oproepen (vooral in de boardroom), het moet passen bij het merk (on brand), het moet een tijdje mee kunnen gaan en vanzelfsprekend helemaal afgestemd zijn op de klant (Customer Centric). En als het binnen de gestelde tijd en binnen budget te realiseren is maak je alle stakeholders blij. Maar dit laatste krijgt vaak wat minder aandacht dan het creatieve gedeelte van het vak. Ik heb gemerkt en vooral geleerd dat je door slimmer te ontwerpen je tijd en geld kunt besparen en zelfs nog de kwaliteit kunt verhogen. In deze post wil ik je vertellen hoe.

Het ontwerpen van een e-commerce kanaal is een uitdagend proces, zeker in een omnichannel, multidevice en responsive omgeving. Via research, data-analyses, praten met en het observeren van klanten kom je tot inzage wat de klant écht wil en vooral ook niet wil. Persona’s en de verschillende touchpoints van de Customer Journey zijn de basis voor de eerste UX schetsen en het vertrekpunt voor het visual design van het nieuwe digitale kanaal. Interne presentaties worden georganiseerd voor het nodige draagvlak en na enkele iteraties en prototype testing met klanten staat de basis voor de nieuwe webshop. De ontwerpfase (sprint 0) is succesvol afgerond, er staat een eerste concept om mee te gaan bouwen, dus tijd voor de eerste sprint.

01-blog-iwan-08-2016

Maar bij de bouw blijkt dat het ontwerp niet goed aansluit bij het gekozen platform (bv. Intershop, Magento, Demandware, ecManager, Hybris etc.) en de mogelijkheden van dit platform. En vaak zijn er ontwerpkeuzes gemaakt die voor frontend developers veel extra tijd vragen.

Veel voorkomende uitdagingen en issues:

  • Functionaliteiten worden niet ondersteund of zijn te uitgebreid
  • Het gridsysteem (stramien) sluit niet aan bij het gekozen platform
  • Er is überhaupt niet ontworpen op een gridsysteem
  • Margins verschillen teveel per element of per pagina
  • Er is geen consistent (of teveel verschillend) kleurgebruik
  • Fixed elementen ipv floating elementen
  • Fotografie is ongeschikt voor retina schermen
  • Compositie van de fotografie is niet goed schaalbaar voor responsive
  • Stijl van buttons verschilt per pagina
  • Lettertypes zijn niet beschikbaar als webfont
  • Lettertypes renderen niet goed op verschillende screens
  • Illustraties en icons zijn niet als vector gemaakt
  • Functioneel afwijkende checkout flow
  • Er wordt te weinig rekening gehouden met verschillende resoluties
  • Data die niet voorhanden is

Backend- en frontend developers vullen hierdoor de backlog vanaf de start al met meerwerk. Kortom: de deadline voor de eerste sprint, de volgende sprints en de daaropvolgende MVP loopt nu al vertraging op. Verre van succesvol zeg maar…
Hoe voorkomen we bovenstaand scenario zonder al te veel concessies te doen aan de user experience van de klant? Want de klant staat nog steeds centraal, hier begon het tenslotte allemaal mee.

 

‘Door slimmer te ontwerpen maak je alle stakeholders blij’

 

Check je platform

Bij het oplossen van UX en usability uitdagingen zijn er bijna altijd meerdere wegen die naar Rome leiden. Door de mogelijkheden van het e-commerce platform goed te bestuderen kun je keuzes maken waarbij je als ontwerper de wensen van de klant en de mogelijkheden van het platform samen laat komen. Zo kun je in een vroeg stadium uitdagingen anders oplossen ipv grote concessies te doen. Dus verdiep je in de (on)mogelijkheden van het platform waarop gebouwd gaat worden. Zo ontwerp je voor zowel klanten maar ook voor developers.

 

‘Ontwerp altijd voor klanten maar ook voor developers’

 

Ken de (on)mogelijkheden van de voorkant

Als ontwerper hoef je geen hardcore frontend developer te zijn (biedt zeker voordelen) maar ik zie nog te vaak té grote uitdagingen voor frontend developers omdat designers de (on)mogelijkheden niet goed kennen wat uiteindelijk leidt to veel waste of time. Het is daarom anno 2016 een must om je te verdiepen in HTML5 en CSS3 standaarden, browserondersteuning,  responsive design, verschillende devices en wat schaalbaarheid en hergebruik van code met een ontwerp doet. Vooral het hergebruik van herhalende elementen zal er zelfs toe leiden dat het ontwerp consistenter en helderder (dus beter) wordt.

html

‘Als UX en Visual Designer is het anno 2016 een must om de (on)mogelijkheden van HTML5, CSS3 en responsive design te kennen’

 

Praat en overleg met developers

Zoals een ontwerper in een vroeg stadium met de klant, de klant van de klant en de verschillende disciplines binnen een UX team samenwerkt (data-analysten, researchers, psychologen, content strategen, copywriters, visual designers etc.) is het van belang in een tijdig stadium ook developers te betrekken. Wij doen dit intern door kitchen reviews te houden waarbij we naast alle UX onderdelen een check doen op functionaliteiten, techniek, platform en (on)mogelijkheden van frontend.

Standaard is niet per definitie fout

Designers houden per definitie niet van standaard. Met standaard maak je niet het verschil en het heeft geen onderscheidend vermogen. Maar een standaard kan ook een conventie zijn, iets wat je gebruikers gewend zijn. Vraag je dus bij alles wat je doet af of het anders moet of dat het een conventie is die je gebruikers gewend zijn. In veel e-commerce platformen zijn deze conventies opgenomen en doorgetest. Maak er dankbaar gebruik van.

Geen eenheidsworst!

Ontwerpen volgens standaarden kan zoals gezegd ook uniform, saai, voorspelbaar en te weinig onderscheidend worden. Dus vergeet af en toe alles wat ik hierboven beschrijf, wees eigenwijs en creatief en kom met vernieuwende ideeën die de grenzen opzoeken. Presenteer je ideeën en kom met voldoende argumenten waarom het de klant beter helpt of het merk versterkt. Maar bespreek dit altijd vooraf met mensen die er mee moeten gaan werken. Een verrassing is leuk, maar in dit geval liever vooraf dan achteraf.

Bovenstaande biedt hopelijk wat handvatten om een geweldige ‘liever geen concessies’ user experience te ontwerpen en tegelijkertijd rekening houden met de fase die na het ontwerp komt. Want pas als iedereen blij en gelukkig wordt van het ontwerp spreek je van een succesvol ontwerp.

Heb jij ideeën hoe een ontwerp voor een webshop nog succesvoller kan zijn?
Please let me know.

Iwan Blokzijl is Art Director en houdt zich bezig met het creëren van visuele concepten waarbij conversie altijd centraal staat. Binnen De Nieuwe Zaak stuurt hij het concept en creatie team aan.
Blijf op de hoogte

Meld u aan voor onze wekelijkse e-commerce nieuwsbrief en blijf op de hoogte van het laatste e-commerce nieuws!

© 2018 De Nieuwe Zaak