Den informativa affischen

Utifrån pappersprototypstesterna utformades en affisch som gick igenom varje steg i datorprototypen. Författaren ansåg att det var viktigt att även ha med bildexempel för att framföra informationen. På så vis kom den brainstormade idén ​Illustration som demonstrerar hur QR-koden skannas ​trots allt till användning.

Till en början prioriterades dock att bestämma var varumärkenas logotyper skulle placeras samt att fastställa det mest nödvändiga i affischens textinnehåll. Därigenom skulle dess grundläggande form uppenbara sig. Den första iterationen (se Figur 22, följande sida) inkluderade därför bara de

grundläggande elementen. Avgörande för affischens funktion var att den skulle upplevas som grafiskt konsekvent med automatens skärmgränssnitt. Dessa skulle tillsammans framhäva Pantameras

varumärkesidentitet och samarbetet mellan Pantamera och Swish. Logotyperna lades till i form av en rebus - ​“Pantamera + Swish”​ - vilket författaren ansåg spelade väl in med den lekfulla tonen i Pantameras varumärkeskommunikation. Rebusar har dessutom tidigare använts i

Returpack/Pantameras grafiska manual (Lundgren & Co., 2019).

Figur 22 (återfinns i Bilaga 14) 

Textinnehållet behövde vara enkelt och något lekfullt för att stämma överens med Pantameras typiska kommunikationsstil. Av denna anledning gavs affischen en ordlek till rubrik: ​“Panta med ett Swish!” men också en förklarande underrubrik ​“Överför enkelt pantpengarna - direkt till ditt konto”​ för att förtydliga affischens syfte (se Figur 22 ovan). De fem punkter som ansågs nödvändiga att ha med på affischen var följande:

1. ​“Töm din pant i automaten”

3.​ “Skanna QR-koden på skärmen med Swish-appen eller skriv ut ett kvitto för att skanna senare” 4.​ “Slutför processen i Swish-appen”

5.​ “Klart! Pengarna är på väg till dig”

Den första, grundläggande designen inkluderade den gula övertoning som ofta används i varumärket Pantameras tryckmaterial (Lundberg & Co., 2019). Den gula övertoning som utgjorde bakgrunden för affischen valdes för att den kontrasterade väl med den blå texten. Däremot kontrasterade den inte alls mot varumärkeslogotyperna som sedan lades till i layouten. Av denna anledning bestämde sig

författaren att byta färgerna på bakgrunden och texten det vill säga till en blå övertoning i bakgrunden och gul text som varumärket ofta använder (se Bilaga 14).

I och med att det var viktigt att affischen skulle vara uppmärksamhetsväckande ansågs den mörka bakgrunden dock inte vara optimal. En bildfil föreställande ett vitt papper som placeholder till bakgrund. Anledningen att detta ansågs vara en placeholder var att författaren inte hade tillgång till den pappersbakgrund som Pantamera ofta använder enligt den grafiska manualen (Lundberg & Co., 2019). Texten ovanpå pappret valdes gavs den blå färgen i enlighet med Pantameras grafiska profil. Denna kombination ansåg författaren var mer intresseveckande samtidigt som den kontrasterade väl med både logotyperna och texten. Den framhävde också tydligt varumärkets grafiska profil. Nu när den övergripande strukturen slagits fast började innehållet arbetas med på detaljnivå.

Dodd et al (2017) påpekar hur gränssnitt där varje steg beskrivs noga används med större säkerhet av sina användare. Av denna anledning lades även en representation av den Swish-knapp som leder till QR-koden i gränssnittet till. Säkra användare upplever förmodligen sitt användande av automaten som mindre stressande. En anledning till detta val var att författaren ansåg att termen ​Swish-knapp​, som använts i Figur 22, inte var uppenbar nog för att kunna användas. Representationen av Swish-knappen upplevdes tillsammans med texten tydligt indikera att affischen visade en knapp i gränssnittet. Att Swish-knappen återges i affischen var viktigt för att göra den och skärmgränssnittet mer visuellt konsekventa. Detta gör att gränssnittet blir mer lättorienterat efter läsning av affischen. Texten förmedlar också att knappen är placerad överst till vänster i utbetalningsmenyn.

Under detta finns samma QR-kod som finns i datorprototypen (se Bilaga 12) ett plustecken samt en ihålig clipart-bild på en mobiltelefon (se Bilaga 14). Här skapas ännu en rebus för att visa hur

QR-koden skulle skannas av mobiltelefonen. Denna rebus bedömde författaren också vara nödvändig eftersom den introducerar en representation av hur QR-koden i automatens gränssnitt kommer se ut. På så vis förbereds pantare såsom dem med dåligt arbets- och långtidsminne som Dodd et al (2017) skrivit om, på vad de kommer möta i automatens gränssnitt. Genom affischen blir pantare som tidigare använt gränssnittet även påminda om hur processen går till redan innan de börjar interagera med gränssnittet. Precis som vid användandet av den visuella representationen av Swish-knappen gör detta designerna mer visuellt konsekventa. 

Figur 23 (återfinns i Bilaga 14) 

I den här, andra iterationen, fetmarkerades ordet ​eller​ för att förtydliga att det är två olika alternativ som presenteras i punkt nr. 3. Författaren såg dock en risk i att det inte framgick att QR-koden skulle skannas med kameran specifikt i Swish-appen. Därför sattes QR-koden istället i clipart-bilden av mobiltelefonen (se Figur 23 ovan). Efter detta genomfördes en pilotgenomgång av affischen, även denna med en av de personer som deltagit i pappersprototyptesterna.

4.4.2.1 Pilotgenomgång av den informativa affischen 

Under pilotgenomgången anmärkte deltagaren att texten hade gjorts tydligare om siffrorna som indikerar de olika stegen i processen fetmarkerkades. Hen menade också att det behövde framgå tydligare på affischen att det är ​“KLAR!”​-knappen en pantare bör trycka på för att bekräfta att hen har pantat klart. Detta förtydligades därför i texten. Beslutet togs att inte ha ​“KLAR”​-knappen

representerad i bildform i den informativa affischen. Detta då dess gula färg riskerade stjäla för mycket uppmärksamhet. Även Dodd et al (2017) användes för att motivera detta. Medan Dodd et al skriver om UX-gränssnitt ansågs faktumet att visuella element kan upplevas som distraherande av äldre viktigt att ha i åtanke här. Av denna anledning är det viktigt att använda visuella element balanserat.

Författaren ansåg att symbolerna också borde kommunicera tydligare att QR-koden ska skannas genom Swish-appen. Av denna anledning skapades en ny rebus likt den som återfanns i Bilaga 14.2. Den nya rebusen bestod av en clipart-mobiltelefon som visade upp Swish-logotypen på sin bildskärm. Plustecknet från den tidigare rebusen ersattes här av en högerpekande pil som för blicken vidare mot ytterligare en clipart-mobil som i sin tur visar upp QR-koden på sin skärm (se Figur 24, följande sida).

Figur 24 (återfinns i Bilaga 15) 

Deltagaren ansåg dock även att bildexemplet på hur QR-koden bör skannas borde visas mellan de två alternativ som utgör punkt nr. 3 av anledning att bilderna bara tillhör det första alternativet.

Författaren upplevde att detta var ett bra förslag eftersom det också avskilde de två alternativen från varandra på ett tydligare sätt än att endast fetmarkera ordet ​eller​. För säkerhets skull behölls dock fetmarkeringen, vilken deltagaren inte kommenterat. Efter pilotgenomgången framställdes den affisch som skulle komma att användas i den heuristiska utvärderingen (se Figur 24 ovan).