Frälsningsarmén – Längre

Vad gjorde webbyrån?

Frälsningsarméns gåvoshop

En lättnavigerad gåvoshop som ökat antalet besökare och donationer

Bakgrund till projekt

Frälsningsarmén i Sverige har en historia som sträcker sig från år 1882 och utgör i dagens läge en av de ledande välgörenhetsorganisationerna i landet. Genom sin omfattande kårverksamhet och gedigna sociala arbete gör rörelsen varje dag insatser för att hjälpa människor i olika typer av utsatthet.

En position som naturligtvis ställer höga krav på de digitala plattformar som representerar och informerar om verksamheten. Frälsningsarméns dåvarande webbsida bedömdes att inte möta de krav och mål som organisationen satt upp. Detta gällde framför allt avsaknaden av en integrerad gåvoshop som genererar ökning av antalet donationer från användare.

Wasabi Web tilldelades uppdraget att ta fram design och utveckla Frälsningsarméns nya gåvoshop med koppling mot deras affärssystem. 

Efter lansering uppskattas den nya gåvoshopen både av besökarna och uppdragsgivaren, vilket avspeglar sig i den rejält tilltagna besöksantalet i jämförelse med den uppmätta trafikfrekvensen innan lansering. Även när det kommer till antalet genomförda donationer och köp av gåvor och andra artiklar anmärkningsvärt fler än tidigare.

Gåvoshopen spelade även en avgörande roll i Frälsningsarméns kampanj ”Ta in en hemlös i vinter” som lanserades i slutet av 2015. Via gåvoshopen kunde besökaren köpa porträtt av tre hemlösa individerna Peter, Thomas eller Claes Thomas – tagna av den brittiske fotografen Lee Jeffries. Avbildningen av Cleas Tomas ansågs hålla så pass hög kvalité att den senare nominerades till Resumés tävling som utser årets reklambild 2015.

Genomförande, projektform och faser

I projektet arbetade 2 st utvecklare under ca 6 månaders tid. Därefter har förvaltning av uppdraget följt där Wasabi Web bidragit med uppdateringar i form av ny funktionalitet, ändringar och rättningar.

Projektet har använt ett agilt arbetssätt (Scrum) med veckovisa iterationer och avstämning med beställare. Det betyder att kunden genom veckovisa möten fått tydlig insyn i hur produktionen går och får möjlighet att prioritera det (just då) viktigaste först. Det medför att tester kan göras på del-leveranserna och att man på så sätt kan kvalitetssäkra produkten på ett effektivt sätt. På grund av detta har beställarna haft mycket god insyn i projektet och har kunnat prioritera funktioner. Parallellt i projektet genomfördes design, utveckling, specifikation och test. Totalt genomfördes 14 sprintar – där varje sprint motsvarar en vecka.

Baserat på en användarstudie analyserades användarnas behov och krav. Därefter påbörjades utvecklingsprojektet som genomfördes enligt Scrum med täta leveranser av en testbar sajt – allt för att snabbt kunna svara på förändringar och kontinuerligt kunna fatta beslut om sajtens utveckling för att den skulle bli så bra som möjligt. Analyser användes som underlag för att ta fram Wireframes (skisskartor) över sajtens grundläggande struktur.

–  Kravställning och uppstartsmöte tillsammans med kund där agendan är att skriva en kravspecifikation och gå igenom tidsplan för projektet.

–  Gå igenom statistik (Google Analytics) för den gamla hemsidan. Definiera styrkor och svagheter med den nuvarande hemsidan och kartlägga hur dessa kunde förbättras med den nya designen.

–  Wireframe – Skiss på hur sidan strategiskt ska vara uppbyggd för att uppnå optimalt engagemang och försäljning.

–  Första utkast av gåvoshopen samt övriga sidor enligt wireframe och grafisk manual.

–  Avstämning och korrigeringar med Frälsningsarmén

–  Färdigställning av design på övriga sidor av webbplatsen.

–  Programmering Front-end vilket är den “ytliga programmeringen” d.v.s. kodning av hemsidans utseende för besökaren.

–  Programmering Back-end. vilket är “back-end delen”, som består av att koppla på funktionaliteten som krävs i bakgrunden så att beställaren kan logga in och administrera gåvoshopen själva. Innefattar; Installation och anpassning av webbhotell, databas (development server).

Integrationer

Frälsningsarmén valde att bygga sin gåvoshop i WordPress och WooCommerce av flera anledningar, bland annat på grund av den enkla administrationspanelen och dess flexibilitet. Eftersom uppdraget inkluderade en systemintegration, i syfte att minska mängden administration för Frälsningsarmén, var kravet på en flexibel plattform hög.

Självklart har samtliga komponenter byggts utifrån moderna tekniker med hög säkerhet och bra prestanda i åtanke.

I övrigt har Wasabi Web integrerat följande lösningar i gåvoshopens struktur för att optimera plattformens helhet:

–  HTML5, Javascrpit och SASS/CSS med Wasabi Webs skräddarsydda css- och javascriptramverk.

–  PHP – programmeringsspråk som WordPress och hela plattformen är baserad på.

–  WordPress/WooCommerce, och för systemintegrationen (Winorg) har vi applicerat testdriven utveckling (TDD).

–  Google Analytics – På sidan användes Google Analytics vilket är ett analysverktyg där användarnas beteende kan spåras och kartläggas in i

– Hotjar Insights: ett nytt sätt att avslöja användarnas beteende på hemsidan och deras upplevelser via ett centralt verktyg. Den ger dig möjligheten att förbättra webbplatsens användarupplevelse och
konvertering. Verktyget knyter ihop datapunkter för att samla in information om användarna för analys.

Användbarhet – uppmaning till handling

Ett flertal nya lösningar utvecklades, såsom införandet av interaktiva knappar som tydligt lotsar besökaren från huvudsidan till gåvogivning – det vill säga knappar som ger uppmaningar till handling (call-to-action). Förutom förbättrad användarvänlighet får besökaren omedelbart feedback på sina köp – som de sedan kan dela/visa upp för sin omgivning i sociala medier genom tydligt exponerade knappar. Användaren kan själv välja den exakta gåvosumman och får i realtid respons hur mycket donationen räcker till.

Testimonals

För att skapa känslan av och bekräfta att köpta gåva faktiskt går till ett utsatt syfte har utrymme gjorts för personliga berättelser från bidragstagare att berätta hur Frälsningsarméns insatser hjälper just dem. Dessa profiler har förekommit vid enskilda kampanjer och skapar ytterligare incitament att ge en större gåvosumma.

Lättnavigerad struktur

I linje med att göra gåvoshopen enkel att använda för en äldre målgrupp med begränsad datorvana så har stor ansträngning i själva gåvoshopen lagts vid att design och formulerandet av menyval, knappar och att andra interaktiva ytor ska vara så lättnavigerade som möjligt. Detta innebär i huvudsak större knappar och bilder, begränsat med enskilda störande element på sidan samt konkreta budskap (trigger-ord) vars innebörd inte kan missuppfattas av användaren.

Breadcrumbs, som indikerar i överkant var användaren befinner sig i flikstrukturen, gör det enkelt att återgå för vid eventuell felnavigering.

Överskådlighet 

Sätt att ge gåvor har utvecklats och förenklats. Väljer användaren exempelvis att föra markören över “Sätt att ge” i huvudmenyn i överkant av startsidan öppnas en pop-up-meny som presenterar de tillgängliga sätt som en gåva kan ges på.

Lansering

Wasabi Web har i ett tidigt skede lanserat en fungerande produkt som direkt börjat generera intäkter, och allteftersom fler iterationer avslutats och fler funktioner blivit klara har webbyrån kontinuerligt kunnat lansera dem och därmed under en längre period kunnat öka produktens omfattning och därmed också Frälsningsarméns intäkter.

– Under första lanseringen, som skedde innan jul, såldes porträtt som skickades ut med post.

– I andra lanseringsfasen började “gåvokort” säljas. Kunden köper en gåva (t.ex. en måltid, mössa och vantar m.m.) och får ett “bevis” på att hen köpt gåvan skickat till sig via post. På beviset kan hen skriva en personlig hälsning. Vid andra lanseringen gavs kunden också möjlighet att donera valfri summa pengar till ett specifikt ändamål. Vid beställningen ges då också möjlighet vara helt anonym.

– Från tredje lanseringen ges kunden möjligheten att själv skriva ut sitt gåvobevis via en länk som skickas via e-post tillsammans med kvitto på köp.

Resultat

Frälsningsarméns nyframtagna gåvoshop ansågs uppfylla den kravbild som på förhand sattes upp av uppdragsgivaren. Det nya inslaget uppskattades och föll väl ut bland rörelsens medlemmar och besökare.

Ett av projektets viktigaste målsättningar var att öka antalet totala donationer och faktiska intäkter. Detta har uppfyllts genom att webbyrån har utvecklat en plattformslösning som skapar försäljningstillfällen – jämfört med december 2014 innebar samma period 2015 hela 88% i mer insamlade pengar.  Wasabi Webs tillägg till den huvudsakliga webbplatsen har dessutom medfört en kundökning med 346% under december 2015 i jämförelse med december 2014.