Webdesign som fungerar – intervju med Jimi Wikman

Desgin är inte hur en sida ser ut, design är hur en sida får dig att känna och reagera. Någon som arbetat länge med design som gör skillnad är Jimi Wikman som hjälper E-handlare utveckla sin butik med hjälp av design. Vi har fått en ordentlig intervju med Jimi som är full av handfasta tips.

Jimi Wikman har jobbat med en lång rad stora varumärken, från Stadium och Assa Abloy till Pricerunner och Inkclub. Första gången jag träffade på Jimi online var många år sedan och redan då var han en av de, ganska få, som arbetade med design som faktikst pratade om designens funktion. Idag har han placerat sig som en av de designers som allra mest driver frågan om design som funktion, design som gör något istället för ser ut. Design som får dig att känna, köpa, registrera dig eller hitta precis rätt.

För den mindre E-handlaren har Jimi alltid goda råd, vanligtvis är den här typen av arbete förbehållet de riktigt stora, det är ett stort arbete att ta tag i sin design på allvar. Idag har vi dessutom fått en riktigt fyllig intervju med honom häroch avslutningsvis 13 handfasta råd till dig som är ehandlare.

Kan du berätta om din syn på design?

För mig så är begreppet design idag så otroligt mycket bredare än vad det var för 20 år sedan när jag började med design. Design är inte längre bara grafisk design utan det handlar om en förståelse långt utöver det grafiska. En duktig designer måste förstå användarbeteenden, front end utveckling liksom de tekniska begränsningarna för plattform och komplexiteten i systemen för att kunna skapa en bra design lösning. Discipliner som psykologi blir allt mer viktig, speciellt för E-handel där konverteringsoptimering för länge sedan lämnat enkla lösningar som logiska flöden och färgval. Struktur, text balans och innehålssstyrning är A och O i design idag liksom en förståelse för vikten av den mobila evolutionen och förändringarna som sker i de yngre generationernas tankeprocesser.

Tyvärr är det ytterst få designbyråer som har den kompetensen idag och det är också varför vi ser ett sådant otroligt stort behov av konverteringsexperter och ett uppsving för A/B test och Eyetracking för att nämna några tekniker. Vi vet att designen i många fall inte är optimal men det finns väldigt få personer som förstår varför.

Kan du besrkiva ditt arbete?

Mitt jobb är väldigt varierande och jag jobber med flera olika discipliner beroende på projektet och min roll. Det inkluderar allt från ren grafisk design, UX, konverteringsoptimering, test, frontend utveckling och på senaste tiden mestadels projektledning och kravhantering. Fördelen med att jobba så är att jag får en större helhetsblick över projekten då jag har jobbat med i stort sett alla delar av projektets livscykel. Detta gör att jag när jag sätter mig ner och ska göra en design för en ny eller befintlig e-handelssajt till exempel så har jag redan pusselbitarna från ett affärsperspektiv, från ett plattformsperspektiv och framförallt från ett e-handelsperspektiv. Detta ger en stor fördel gentemot till exempel renodlade designbyråer som ofta saknar flera pusselbitar.

Hur går det till?

Ett normalt designprojekt börjar för mig hos beställaren där jag håller en eller flera workshops. Syftet med dessa är att fånga upp och förstå affärsmässiga behov från de olika områdena som marknad och IT. Eftersom jag ofta jobbar med större e-handelskunder så är det viktigt att bjuda in rätt personer till dessa möten för en del av mitt uppdrag är även att fånga upp interna beroenden som kanske inte alltid uttrycks i ord, men som outtalat kan observeras under workshops. Vanliga övningar under dessa workshops är kortsortering för att hitta rätt informationsstruktur, genomgång av insamlad data i form av personas om det finns och annars Analytics data för att se kundresor och eventuella stoppklossar i flödet.

Utifrån detta så kikar jag på de tekniska förutsättningarna på plattformen så jag inte designar något som blir för dyrt att utveckla (såvida jag har fria händer, vilket nästan aldrig sker). I de flesta fallen så är det Intershop eller SAP Hybris som jag jobbar i, men ibland blir det en Epi lösning eller en Magento som jag ska designa för.

Sista steget innan designen blir att gå igenom UX och flöden för att identifiera vart största krutet ska läggas. Det brukar nästan alltid betyda att fokuset delas i två huvud delar: marknadsföring och checkout. Med marknadsföring menas alla komponenter som har som syfte att driva trafik genom sajten. Det kan vara allt från produktsliders till CMS block och satellitsidor av olika slag.

Sedan gör jag själva designen som alltid börjar med startsidan, trots att det är den minst intressanta sidan på saften egentligen. Anledningen är att den sidan är en bra sida att visa ramverk, dvs header och footer, och den har ofta en hel del komponenter. Detta gör att det blir ganska enkelt att få en bra översikt av sajtens tonalitet, dvs sajtens ”känsla” och kommunikation.

Efter första designen så görs flera iterationer med justeringar där olika stakeholders (personer med intresse som tex marknad eller SEO) tills designen till slut kan sättas och arbetet med krav och implementation kan påbörjas.

Vilket resultat vill du uppnå för att bli nöjd?

För mig finns bara två resultat som intresserar mig och det är att designen gör beställaren nöjd och att designen gör användaren nöjd. Det betyder att jag kan skapa en design som ger beställaren den flexibilitet som behövs och den tonalitet som passar just deras affärsplan och branding. För användaren så betyder det att UI och UX är enkelt och rätt anpassat så att upplevelsen av det grafiska och funktionaliteten blir så bra som möjligt.

Hur mycket tid tycker du man ska lägga på konvertering och design i förhållande till andra aspekter i sin butik?

Det beror mycket på vart man befinner sig i sin affärscykel.

Om man precis ligger i startgroparna för att starta sin E-handelsverksamhet så skulle jag säga att lägg lite extra tid på designen för det tjänar man på i längden. Det behöver inte vara några stora saker utan fokusera på förtroende höjande aspekter som trustfaktorer, tydlig kontaktinformation och lägg några timmar på att förutsäga vad kunderna kommer att fråga om när det gäller produkterna och lägg in svaren innan du går live. Ha bra produktbilder och tänk på saker som vänsterprincipen och struktur enligt gestalt lagarna. Har du möjlighet så ta hjälp av en SEO konsult och en copywriter så du kan få text som både ger bra resultat SEO mässigt och som ökar konvertering. Lägg ett par dagar extra på designen tillsammans med en konverteringsexpert så kommer det att löna sig i längden, men du kan även göra detta senare om tex budgeten inte tillåter vid startup.
Är du någonstans i mitten där du fortfarande lägger mycket tid på att positionera dig som E-handlare och sätta dina strategier för SEO och marknadsföring då skulle jag säga att behovet av optimering inte är speciellt stort, såvida det inte finns stora problem någonstans som behöver åtgärdas för att inte tappa försäljning. Här skulle jag säga jobba med att lösa problem istället för att optimera och lägg tid och kostnad på att positionera dig och få dina strategier på plats. Har du budget så lägg en dag eller två i månaden på optimering för att identifiera problemen och göra mindre optimeringar.

Är du i slutskedet av din cykel där du haft din butik och strategierna för SEO och marknadsföring sitter och du har etablerat dig som E-handlare, ja då är det konverteringsoptimering som gäller, speciellt på mobil om det är din målgrupp. Lägg så mycket av din budget du kan på optimering för varje procent du kan öka försäljningen betyder att dina strategier blir ännu mer inkomstbringande.

Jag brukar dra en presentation om ROI (return of investment) där jag jämför konverteringsoptimering och att köpa trafik där det är tydligt att köpa trafik en månad är billigare än att köpa konverteringsoptimering en månad, men att långsiktigt så ger konverteringsoptimering 1200% bättre ROI på ett år. Så var inte snål när det gäller vart du lägger pengarna, se till att du lägger dem där det är mest gynnsamt för just dig.

Generellt skulle jag säga att det ganska sällan handlar den grafiska designen på en sajt när man talar om konverteringsoptimering, men det är ofta där folk lägger sina pengar. Nästan alla problem med konvertering handlar om UX och copy med ett stort undantag för trustfaktorerna som man verkligen inte ska förringa. Checkouten får i de flesta projekten alldeles för lite tid när det gäller design och jag ser också att det är där mycket av optimeringsarbetet i Norden och Internationellt finns kvar att göra.

Vad är det första du tittar på när du ser en startsida/kategorisida/produktsida?

Oavsett vilken sida jag tittar på så är det struktur, balans och fokalpunkt som jag tittar på.

Strukturen är viktig för hjärnan så en ostrukturerad design, text en design med svag header eller footer eller listningar som är ojämna så stör det hjärnans behov för ordning och reda.

Balans betyder att sidan ska vara proportionerlig när det gäller innehållet och att sidan är ren utan att kännas tom och ändå ha den information som krävs för att kännas trygg och säker.

Fokalpunkt betyder att varje sida ska innehålla en funktion som vi vill att användaren ska utföra och därmed ska designen styra användaren dit genom designens utformning.

Startsidan är egentligen inte intressant från ett konverteringsperspektiv förutom hur den fungerar som ingångssida. Här tittar jag på navigering och ramverk så att trustfaktorerna finns med och att användaren kan komma till de viktigaste områdena på sajten.

Kategorisidan och i förlängningen sökresultatsidan, där tittar jag på presentation och balans. Det viktigaste är att det mest relevanta finns tidigt och att möjligheten att sortera och filtrera fungerar på ett enkelt och lättförståeligt sätt. Rätt copy och rätt information så produktkorten blir fokuserade och ändå har relevant information så besökaren kan gå vidare med köp.

Produktsidan där är det presentation och fokalpunkt som är det viktigaste, men eftersom produktsidan ofta är landningssida så blir navigation och förståelse om vart i informationsstrukturen sidan finns också en viktig del. Rätt copy, bra produktbild (gärna med innehållsstyrning vid mouseover i desktop) och tydligt fokus på köp är viktigt. Ha inte för mycket information framme utan låt besökaren ta fram informationen själv genom frontend tekniker som hide/show och tabbar. Produktsidan har två syften och det är att ta bort alla tvivel om produkten är rätt för besökaren och ge möjlighet att köpa produkten.

Kan du ge några handfasta råd till ehandlare som precis på allvar börjat fundera över vad deras design gör?

1. Det finns två intressenter på en e-handlares sajt: e-handlaren själv och besökaren. Av dessa två så är det besökaren som är absolut viktigast så mitt första råd är att lär känna din besökare. Alldeles för många e-handlare anser att deras målgrupp är alla mellan 15 och 95, men det är omöjligt att jobba mot en sådan målgrupp. Sätt upp och gå igenom ditt analysverktyg så det spårar det viktigaste på sajten, nämligen kundresorna och framförallt sök. Utifrån analysdata se vilka målgrupper du faktiskt har och vilka problemområden du har i designen just nu. Utifrån det kan du sedan göra en plan för hur du ska förbättra köpupplevelsen för dina besökare och jag rekommenderar att du gör övningen med att skapa ett antal så kallade personas.
2. Snåla inte på UX eller kassans utveckling. De flesta avhopp sker på grund av otydlighet eller dålig UX.
3. Se till att du har bra produktbilder. Dåliga produktbilder ger association om att produkterna är lika dåliga.
4. Lägg lite extra kärlek på texterna på sidorna. Det ger ofta en stor effekt både på försäljning och SEO. Förutsäg frågor som besökaren kan ha och besvara dessa så minskar bounce rate och kontakt med kundtjänst.
5. Även om färg och tonalitet har stor betydelse så påverkar struktur på sidan ännu mer. Se till att sidan är strukturellt balanserad och att designen är logiskt grupperad. En stark footer och header är en bra start som är ganska enkel att uppnå och likaså att se till att mellanrum mellan olika delar på sidan är tydlig.
6. Se till att ha trustfaktorerna väl synligt och lyft fram vem som står bakom sidan och hur man kontaktar företaget. Detta inger förtroende vilket i sin tur ökar försäljningen.
7. Styr produkternas placering på sidorna. Om du kan styra dina produkter så prova att lägga de produkter du vill sälja mest av längst till vänster i produktlistningen. Vänsterpricipen säger att besökaren väljer produkter längst till vänster, framförallt på rad ett och två i listan.
8. Ta kundtjänst på allvar. En arg kund som kan omvandlas genom rätt bemötande är mer värt än all marknadsföring du kan ha, speciellt om det sker öppet. Det visar engagemang och omtanke och du får en ambassadör som kommer att sälja åt dig på köpet.
9. Hjärnan är känslig för tid och risken att missa något. Detta kan du använda kreativt på sajten med bra resultat. Få antal kvar av storsäljare eller erbjud fri frakt inom x minuter är exempel på saker som är relativt enkla att implementera och som ger bra effekt.
10. Innehållsstyrning kan användas på många sätt, bland annat genom bilder. En enkel mouseover effekt där personen på bilden först tittar rakt fram för att etablera kontakt och vid moseover tittar mot fokalpunkten, tex lägg i varukorgen hjälper besökarens hjärna att röra sig i önskad riktning.
11. Var tydlig med sidornas syfte och gör fokalpunkten tydlig, exempelvis med färg, fontstorlek och utmärkning. I mobil kan det vara fördelaktigt att repetera eller låsa fokalpunkten vid långa sidor.
12. Experimentera. Stirra dig inte blind på best practice eller vad alla andra gör. Experimentera i den mån du kan för att hitta det som fungerar för just din e-handel.
13. Utnyttja möjligheten att få en gratis utvärdering. Många företag erbjuder en gratis utvärdering som visserligen är väldig generisk eftersom de vill att du ska köpa deras tjänster längre fram, men det kan ändå ge några tips och du får en kontakt för framtiden. En del evenemang erbjuder också möjlighet att testa din sajt på olika sätt så ta den möjligheten om den erbjuds av samma anledning.