Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Träff #16 • Flöden • 26 april • vt 23 UX Writing • Nacakdemin

Träff #16 • Flöden • 26 april • vt 23 UX Writing • Nacakdemin

Jonas Söderström

April 27, 2023
Tweet

More Decks by Jonas Söderström

Other Decks in Design

Transcript

  1. Jonas Söderström • 2023 Flöden 
 Kundresa UX writing •

    Trä ff #16 • 26 April Jonas Söderström • Nackademin • Vt 2023
  2. Jonas Söderström • 2023 Du omfattas från och med det

    år du fyller 20 år av en tandvårds- försäkring. Tandvårdsförsäkringen innebär att du inte själv behöver betala hela kostnaden för din tandvård. Tandvårdsförsäkringen delas upp i två delar, 
 bastandvård samt protetik och tandreglering. Med bastandvård menas • undersökning, • förebyggande tandvård, • lagning av hål, med mera I protetik och tandreglering ingår • bryggor och kronor, • proteser, • tandställningar. Hur stor ersättning du får beror bland annat på …. Kolla efter 
 ”Detta innebär att”, 
 ”Med detta menas”, 
 och liknande
  3. Jonas Söderström • 2023 Från och med det år du

    fyller 20 år behöver du inte själv betala hela kostnaden för din tandvård. Då omfattas du av en tandvårds- försäkring. Du omfattas av en tandvårdsförsäkring från och med det år du fyller 20 år. Tandvårdsförsäkringen innebär att du inte själv behöver betala hela kostnaden för din tandvård. Konkret först!
  4. Jonas Söderström • 2022 Enligt paragraf 33 i Förordningen om

    miljöfarlig verksamhet och hälsoskydd (1998:899) ska en bostad 
 ”ge betryggande skydd mot värme, kyla, drag, fukt, buller, radon, luftföroreningar och andra liknande störningar”. En bostad ska ”ge betryggande skydd mot värme, kyla, drag, fukt, buller, radon, luftföroreningar och andra liknande störningar”. Så säger paragraf 33 i Förordningen om miljöfarlig verksamhet och hälsoskydd (1998:899).
  5. Jonas Söderström • 2023 Från och med det år du

    fyller 20 år betalar du bara en del av kostnaden för din tandvård. Då betalar en tandvårdsförsäkring resten. Tandvårdsförsäkringen delas upp i två delar, 
 bastandvård samt protetik och tandreglering. Med bastandvård menas • undersökning, • förebyggande tandvård, • lagning av hål, med mera I protetik och tandreglering ingår • bryggor och kronor, • proteser, • tandställningar. Hur stor ersättning du får beror bland annat på …. Men även här!
  6. Jonas Söderström • 2023 Från och med det år du

    fyller 20 år betalar du bara en del av kostnaden för din tandvård. Då står en tandvårdsförsäkring för resten. Tandvårdsförsäkringen har två delar. I den första delen ingår • undersökning, • förebyggande tandvård, • lagning av hål, med mera Detta kallas bastandvård. Den andra delen täcker land annat • bryggor och kronor, • proteser, • tandställningar. Detta kallas i försäkringen protetik och tandreglering. Hur stor ersättning du får beror bland annat på ….
  7. Jonas Söderström • 2023 
 Vad lätt att hitta! Så

    lätt att förstå! Vad snyggt! Vad häftigt! Vad enkelt! Så lätt att göra!
  8. Jonas Söderström • 2023 Visuell design Infor- 
 mations- 


    design Inter- 
 aktions- 
 design Se, uppleva, känna Hitta, tolka, förstå Agera, handla, beställa Användarens upplevelse
  9. Jonas Söderström • 2023 Vad enkelt att anmäl sig! Toppen!

    Hittar sajten Det här ser snyggt, coolt, seriöst 
 ut! Ah, här finns kvällskursen 
 om vikingatiden! UX – vad människor upplever när de använder din 
 app, sajt, tjänst 😀
  10. Jonas Söderström • 2023 Men WTF … varför kan jag

    inte hitta? Fula färger… tråkiga bilder…. &%£#! 11 klick för att komma vidare!?!
  11. Jonas Söderström • 2023 Nu vill jag göra … Börjar

    använda Hur ser 
 det här ut? Var finns det 
 jag söker? Det går inte! 🤬 Kan inte hitta – sticker 😠 Fult, konstigt – sticker 🙁 När dålig ui-design ger användarna en dålig upplevelse 

  12. Jonas Söderström • 2023 Interaktionsdesign 
 i smal bemärkelse Hund

    Katt Husdjur Välj husdjur Hund Katt V Husdjur Hund Katt X Katt Iller Råtta Hund H Husdjur Hund
  13. Jonas Söderström • 2023 Informationsdesign (inklusive ux-text) Husdjur Välj husdjur

    Hund Katt V I bokstavs- ordning? Är ”husdjur” ett bra samlande begrepp? Fiskar Iller Papegoja Råtta Undulat Eller lägga de vanligaste först? ”Fiskar” … eller ”Akvariefiskar”?
  14. Jonas Söderström • 2023 Interaktionsdesignens tre steg • Möjliggöra –

    inmatningsfält • Förenkla – ge förslag • Automatisera – automatisk ifyllnad
  15. Jonas Söderström • 2023 Inter- 
 aktions- 
 design Visuell

    design Infor- 
 mations- 
 design Att designa flöden
  16. Jonas Söderström • 2023 Ux- texter bildar också ofta flöden

    Status Uppmaning Varning Felmeddelande Erbjudande Bekräftelse
  17. Jonas Söderström • 2023 Ux- texter bildar också ofta flöden

    Du har 10 MB lagringsutrymme Du kan ska ff a mer lagringsutrymme Varning: Du har bara 500 kB lagringsutrymme Lagringsutrymmet är fullt! Köp till mer lagringsutrymme Nu har du 200 MB utrymme!
  18. Jonas Söderström • 2023 > > > Trigger Förtroende- 


    skapare Backa / 
 gå vidare Bekräftelse Process- 
 meddelande > (Ny) Status (Möjligt 
 felmeddelande) Temporära Permanenta
  19. Jonas Söderström • 2023 Vara Frakt Betalning Bekräfta Försäkring Grafisk

    design: Flöden kräver normalt tre designer 
 (färg, form, typ) Interaktions- design: 
 Hur många steg är rimligt? Informations- design: Vad kallar vi de olika stegen? Får de rum? Både och: I vilken ordning kommer de? Vad innehåller varje steg?
  20. Jonas Söderström • 2023 X Ofta tar vi bort huvudnavigation

    i ett flöde – för att hålla kvar/styra användaren. 
 Men det ska alltid gå att hoppa ur flödet - till exempel med ”Stäng (x)”
  21. Jonas Söderström • 2023 Och ett eventuellt alternativ har en

    tyngd mellan primär 
 och ångra Till betalning > < Tillbaka till frakt Alternativ Vara Frakt Betalning Bekräfta Försäkring Ångra/backa är nedtonad Primär action är tydligast
  22. Jonas Söderström • 2023 Till betalning > < Tillbaka till

    frakt Hitta försäkring Vara Frakt Betalning Bekräfta Försäkring Knappar ska kunna förstås utan sin kontext. Text på knappar ska förklara vad de gör – 
 inte bara ”ja” / ”nej”, utan 
 ”ja, ladda upp bild” /”nej, ladda inte upp bild”
  23. Jonas Söderström • 2023 ”Förtroendeskapare” Till betalning > Avbryt <

    Tillbaka till frakt Vara Frakt Betalning Bekräfta Försäkring Lugn! Du kan ändra 
 varan även i nästa steg
  24. Jonas Söderström • 2023 Till betalning > Avbryt < Tillbaka

    till frakt Vara Frakt Betalning Bekräfta Försäkring Lugn! Du kan ändra 
 varan även i nästa steg Vill du verkligen avbryta köpet? Avbryt Fortsätt
  25. Jonas Söderström • 2023 Till betalning > Avbryt < Tillbaka

    till frakt Vara Frakt Betalning Bekräfta Försäkring Lugn! Du kan ändra 
 varan även i nästa steg Vill du verkligen avbryta köpet? Ja Nej
  26. Jonas Söderström • 2023 Till betalning > Avbryt < Tillbaka

    till frakt Vara Frakt Betalning Bekräfta Försäkring Lugn! Du kan ändra 
 varan även i nästa steg Vill du verkligen avbryta köpet? Ja, avbryt köpet Nej, fortsätt med köpet
  27. Jonas Söderström • 2023 Ännu tydligare: Jag vill stoppa köpet.

    Jag vill gå vidare 
 och välja betalsätt. Vill du avbryta köpet? Knappar ska vara begripliga även utan sin kontext!
  28. Jonas Söderström • 2023 Login E-mail Password Log In Register

    Forgot password? Jag är inte här för att starta en relation
  29. Jonas Söderström • 2023 Logga in E-mail Password Log In

    Register Forgot password? 45 % hade multipla inloggningar 160.000 nya passwords/dag < 20 % av dessa köpte
  30. Jonas Söderström • 2023 Continue You do not need to

    create an account to make purchases on our site. 
 Simply click Continue to proceed to checkout. To make your future purchases even faster, 
 you can create an account during checkout. E-mail Password Log In Forgot password?
  31. Jonas Söderström • 2021 Försöka förstå målgruppen Vad vet vi

    om dem redan? • Data, undersökningar? Om vi inte vet … • Liknande tjänster eller produkter?
  32. Jonas Söderström • 2021 Scenarios – kundresa Innan wireframes eller

    skisser, försök beskriva 
 de kända eller de förmodade stegen som tjänsten eller delen ska hjälpa användaren med. • Vilka steg fi nns? • Vad gör, tänker, känner användaren 
 i varje steg och delsteg? • Vilka är svårigheterna?
  33. Jonas Söderström • 2022 Typiskt exempel på ”kundresa” Relevant och

    inspirerande nyhetsbrev – sinnebilden av drömresan Andras resbilder väcker nyfikenhet Annonsera Mottaglig men passiv Läser resereportage Läser nyhetsbrev Tittar på resebilder på Facebook Letar aktivt men okritiskt Kollar resmål och aktiviteter Tar reda på fakta Kollar priser och budget Samlar förslag på hög Säljer in idén om en resa till andra Ställer frågor till vänner som rest Trött på livspusslet Längtar till sol och värme Sliten och trött Avundsjuk på vänners bilder på Facebook Inspireras av andra Splittrad av livspusslet Ensam i letandet eller flera? Osäker var åker man? Hur ska jag välja? Förvirrad av alla alternativ Glatt överraskad av utbudet Finns inte Filippinerna som charter? Har vi hittat allt som passar oss? Det här blir härligt! Kritiskt och praktiskt orienterad Rangordnar bland alternativen Jämför aktiviteter, standard, service och priser Presenterar alternativen för sina medresenärer Planerar in resan i tiden Sätter budget och tidsram Bekräftar med medresenärerna Kontrollerar försäkringar, visum och vaccinationer Vill ha stöd av andra i sitt letande Har vi alla fakta? Kommer alla att tycka om resmålet? Där finns något för alla! Är alla överens? Är alla kostnader inräknade? Jag ska ligga i den solstolen och läsa! Nyhetsbrev Facebook TV Charterapp Desktop web Mobilwebb "Man kan simma med delfiner! Och det är inte så dyrt.". Visa att alla vettiga alternativ finns med Sammanställning av allas kriterier, lyft resmålens USP, sinnebilden av drömresan. Snabbfakta om extrakostnader, vaccin, visum, … Visa upp och kolla med utomstående Flagga för tillkommande kostnader, förenka bokningsflödet, informera om försäkringar, vaccin, visum. Grattis till ett bra val - nu börjar det roliga! Berätta för världen att ni ska åka Stressad, mottaglig för hjälp & råd Jämför detaljer, priser och tilläggskostnader Väljer betalsätt Kryssar mellan erbjudanden och försäkringar Förväntansvull, mottaglig för tips Delar sina planer med andra Kollar och bokar aktiviteter Läser på om resmålet Förbereder sig praktiskt, inköp, vaccina - tioner Begär ledighet och kontaktar dagis och skola Beslutsångest. Är det en bra deal? Törs jag välja bort försäkring? Blev dyrare efter tillval - pinsamt att förklara Blir allt rätt nu? Har betalningen gått igenom? Oro över att något viktigt är missat Vad kul vi ska ha! Hur ska vi göra för att få ut mesta möjliga? Vad får vi inte missa? Är det här bästa valet? Tänk om nåt händer? Hoppas alla blir nöjda nu! Hoppas barnen ska trivas Äntligen ska vi ut och resa! Glad & mottaglig för tips Kollar bra restauranger Kollar väderprognos Berätta att vi är framme och har det bra! Kollar området Kontaktar personal om något inte stämmer Fryser minnen Delar i sociala media Undrar hur det ser ut när vi kommer fram? Skönt att vara framme “Det här är minst lika bra som jag trodde att det skulle bli.” Njuter av värme, sol och bad Nu regnar det hemma! Men varifrån går bussen för utflykten? Här skulle man bo! Tänk att vi kom iväg! Fjärdedagsångest Mail med timad information och inspiration. Dela på FB! Nedräkning till avresa. Anteckna aktiviteter. "Jag är här och det är underbart"" – turkos- filter. Fota, filma, dela. Våra aktiviteter, hitta bästa resturangen "Ska jag klaga på mögellukten?" Aktiv med att berättande Tittar på sakerna vi köpte Landar i vardagen Ber att få se dom andras bilder Konservera upplevelsen Skönt att vara hemma igen Vad härligt vi hade det! Jag fick ut det jag ville av resan Vi valde rätt och det blev bra Återupplever tillsammans Positiv känsla med in i vardagen Det här borde vi göra oftare Så snabbt det gick Nostalgisk Lagar mat, visar bilder Reparerar minnen, genom andra Skratta också åt det mindre lyckade Så härligt och roligt vi hade det Kommer du ihåg när …? Förväntan inför nya resor Så bra att vi kom iväg till slut Vart ska vi åka nästa gång? Samla ihop och snygga till bilder & filmer. Dela räkningen Visa hur härligt det var Påminn om resan Påminn vänner, skapa event Visa foto- & videoalbum Point of pain på jobbet... hemma i kaoset några dagar senare sent på kvällen resan börjar närma sig på playan hemma igen en tid senare SAMLA & LETA DRÖMMA JÄMFÖRA & ENAS FÖRE BOKA & BETALA UNDER EFTER ÅTERUPPLEVA Besviken på dyra priser DEN RÄTTA KNUFFEN ALLT ÄR MÖJLIGT! RESMÅLETS SPETS TRYGGT & ENKELT NU BÖRJAR RESAN, NJUT! MAXIMERA UPPLEVELSEN KONSERVERA LYCKOKÄNSLAN FÖRLÄNG UPPLEVELSEN Besvikelse över mögel på rummet Långt kvar till nästa gång Ta beslut Uppgiftsorienterad Bekräftar att valet av resa är bra Genomför aktiviteter Träffas och minns tillsammans När borde vi boka? Ge bästa bilden av resan
  34. Touchpoints: 
 Vad användaren interagerar med 
 i det givna

    steget Facebook Sajt Mejl Mobil Boknings- system Reseledare
  35. Jonas Söderström • 2023 1. Vad gör användaren nu? Beskriv!

    2. Hur känner hen sig (på en skala)? 5. Vad kan vi kalla det här steget? 3. Hur känner hon, mer konkret? 
 Citat, exempel. Identi fi era ”pain points”: 4. System/tjänst/produkt/person som användaren interagerar med (Touchpoint) Pain point
  36. Jonas Söderström • 2023 SEO, 
 Skriva för sök Målgrupper,

    UX-writer i praktiken: 
 Felicia Kaiser Tisdag Maj 2 Måndag Maj 8 Vecka 18 Testa text, 
 UX research Torsdag Maj 4 Vecka 19 Onsdag Maj 10 Webb- typografi
  37. Jonas Söderström • 2023 Tack! Mejl: 
 [email protected] Webb: 


    javlaskitsystem.se Speakerdeck: 
 jonas_blind_hen Foto: Lars Lundqvist