Att förstå hur användare interagerar med din webbplats eller app är avgörande. En användarflödeskarta är ett kraftfullt visuellt verktyg som beskriver den väg användarna tar genom ditt digitala gränssnitt, vilket hjälper företag att optimera upplevelser och identifiera potentiella problemområden. En bra användarflödeskarta kan hjälpa dig att förstå deras användares resor, identifiera problemområden och planera för eventualiteter. Den här guiden förklarar användarflöden, hur man skapar användarflödeskartor och några bästa praxis för att utforma dina diagram.
Användarflödeskartor beskriver den väg dina användare tar genom din webbplats eller app, och det här diagrammet hjälper företag att optimera sina digitala upplevelser och felsöka problemområden.
Viktiga slutsatser:
- Användarresan beskriver användarens hela upplevelse med ditt företag, medan användarflödet beskriver de steg de följer med hjälp av ditt gränssnitt.
- Några vanliga former som ovaler, rektanglar, diamanter och parallellogram har allmänt förstådda användningsområden i flödesscheman.
- Följ bästa praxis och anlita experterna på Optimizely för att höja din digitala upplevelse.
Användarflöde kontra användarresa
Även om användarflöde och användarresa har liknande namn och överlappar varandra på betydande sätt, bör du vara medveten om viktiga skillnader mellan dessa koncept.
Användarresan omfattar alla aspekter av användarens upplevelse med ditt företag. Användarresan börjar när en användare först blir medveten om ditt företag (eller blir medveten om ett behov du kan lösa) och slutar med deras sista interaktion med ditt företag. Det betyder att även om du inte kan veta exakt när en användarresa börjar eller slutar, kan du använda kundrelationshantering-programvara för att identifiera var en användare befinner sig på sin resa och hur man tar dem till nästa steg.
Användarflödet överlappar användarresan, men det beskriver specifikt den väg användarna följer på din webbplats eller applikation. Till exempel kan ett användarflöde börja när en användare besöker din webbplats för första gången och sluta med ett köp. Dessa aktiviteter är en *del* av den större användarresan, men användarflödet är mer intresserad av den upplevelse användarna har med din webbplats eller app.
Användarresan är intresserad av användarens känslor, konkreta och immateriella interaktioner, pågående kommunikation, relationsbyggande etc. – "människosidan" av processen; medan användarflödet är intresserad av "tekniksidan" av processen – användarens klick, sidbesök och prenumerationer. Användarflödet och användarresan beskriver olika delar av samma relation mellan ditt företag och dina användare.
Användarflödesdiagram
Dina användare kommer aldrig att se din användarflödeskarta, men du och ditt team kommer att använda den under hela webbplatsens eller appens livstid. Så även om det inte behöver vara det vackraste dokumentet bör det fortfarande vara tydligt och användarvänligt.
Även om reglerna för användarflödesdiagram inte är huggna i sten, bör du känna till några bästa praxis och generellt förstå syntaxen för att skapa flödesscheman.
- Ovaler representerar start- och slutpunkten för ditt flödesschema. Beroende på din process kan ditt användarflöde ha mer än en startpunkt och mer än en slutpunkt.
- **Kvadrater eller rektanglar** representerar enskilda sidor eller steg. I allmänhet kan flödesscheman, kvadrater och rektanglar vara vilket steg som helst i en process, men inom webb- och appdesign representerar kvadrater och rektanglar enskilda sidor i användargränssnittet.
- **Diamanter** representerar beslut som användare måste fatta. Till exempel, när en användare först försöker logga in på din plattform kan din webbplats uppmana dem att ansluta till ett Google- eller Facebook-konto, eller så kan de logga in med en e-postadress eller fortsätta som gäst. Beroende på deras val kan deras upplevelse på din webbplats eller app variera eftersom du levererar en annan upplevelse baserat på deras val.
- Parallelogram representerar inmatning som användaren behöver. Du kan till exempel kräva att de anger ett serienummer för att aktivera sin produkt eller anger en leveransadress för att ta emot en tjänst.
- Pilaranger flödets riktning. Ditt flöde kan inkludera loopar, korsningar och divergerande och konvergerande vägar, så det är viktigt att ange elementens sekvens för att din användarflödeskarta ska vara läsbar.
Generellt sett är dessa fyra former, tillsammans med pilar, de grundläggande byggstenarna i din användarflödeskarta, men du kan alltid använda ytterligare former, färger eller andra designelement för att kommunicera information som du anser vara relevant. Kom ihåg att syftet med en användarflödeskarta inte bara är att följa reglerna eller markera en ruta utan att kommunicera information om användarflödet. Exemplet nedan visar ytterligare former som andra företag har använt när de skapar flödesscheman.
Principer för design av användarflöden
Precis som med alla former av kommunikation förlorar användarflödeskartor värde när de utelämnar relevant information och inkluderar för mycket irrelevant information. Att utforma en framgångsrik användarflödeskarta innebär att man balanserar flera överväganden för att maximera användbarheten av ditt diagram.
1. Fastställ en detaljnivå
Om dina användarflödeskartor är för detaljerade blir de invecklade och svårlästa. Om de inte är tillräckligt detaljerade är de inte användbara. Att fastställa rätt nivå av granularitet är ett viktigt första steg i att utforma en användarflödeskarta.
När det gäller att utforma diagram är den gyllene principen att ta hänsyn till användarnas behov. Vilken typ av frågor kommer de att försöka besvara med ditt diagram? Vilken erfarenhetsnivå kommer de att ha? Vad kommer de att använda detta diagram till? Att besvara dessa frågor hjälper dig att definiera rätt detaljnivå för din användarflödeskarta.
2. Överväg alternativ
En av anledningarna till att användarflödeskartor är användbara är att de låter designers visuellt analysera användarnas resa när de besöker din webbplats eller app. Gör ditt bästa för att överväga alla alternativ när du utformar din användarflödeskarta.
Vad gör du till exempel om användare lägger till varor i sin varukorg men lämnar utan att betala? Vad gör du om en användare anger en faktureringsadress men inte en leveransadress? Vad händer om en användare begär en gratis provperiod men sedan köper den fullständiga versionen? Din användarflödeskarta hjälper dig att identifiera dessa vägskäl och planera för eventualiteter.
3. Använd rätt digital upplevelseplattform
Dina användares digitala upplevelse är viktig. Vi har en kraftfull plattform för digital upplevelse med expertverktyg som hjälper till med automatisering, A/B-testning, innehållshantering och mycket mer.
En användarflödeskarta beskriver bara dina kunders resa när de interagerar med ditt digitala gränssnitt. Även om en användarkarta kan hjälpa till att identifiera problemområden och visuellt inspirera till lösningar, är nyckeln till att förbättra dina kunders upplevelse att förbättra innehållet på din webbplats eller app.