SlideShare a Scribd company logo
1 of 37
User Experience
   Why do we need to care?
Användbarhet i praktiken
• Varför behöver vi bry oss?
• Gestaltlagarna (White Spaces, Grouping, Similarity, Proximity)
• Beteenden och upplevelser hos användare (Navigering, Sök, Hur
  hittar jag, Var är jag)
• Användaren och hennes digitala miljö i ett större perspektiv.
• Informationsarkitektur (Struktur, Organisation, Navigering och
  Namngivning)
Varför?
behöver vi bry oss?
Mätetal - Definition av framgång

• Vi skapar verktyg
• … som kundernas anställda använder
• … som underlättar deras vardag
• … i timmar och minuter
Timmar och minuter

• Tid som vi sparar…
• … ger n användare * tid till kunden
• 7000 användare * 5 minuter = 583 000 kronor!
• … vilket i förlängningen är det vi lever på
Intranet 2006

• Varje anställd använder 2 timmar och 30 minuter om
 dagen för att Leta efter Information
• > 90 000 anställda
• 225 000 timmar varje dag ”Leta efter Information”
• 20 000 000 USD varje dag
Gestaltlagar
Gestalt
•En rörelse som startade före WW1 inom
 experimentell psykologi
•Människan upplever bilder som ett
 välorganiserat sammanhang snarare än
 enskilda komponenter
•Helheten är viktigare än delarna
Förmågan att fylla i mönster

Skapa sammanhang
Skapa mening av kaos
Skapa ”min” tolkning
Skapa ”min” verklighet
Förmågan att fylla i mönster
Förmågan att fylla i mönster
White Spaces
• Negativ yta
• Yta mellan grafiska element:
   • marginaler
   • avstånd mellan kolumner
   • Avstånd mellan web parts
• Skapar (icke-synliga) avstånd
  mellan objekt
Grouping
Similarity
Similarity
Similarity
Similarity
Proximity
Nära blir en grupp
Att komma ihåg
• Objekt som liknar varandra - hör ihop
• Objekt som är nära varandra – hör ihop
• Objekt som grupperas tillsammans – hör ihop
• Avstånd (white space) skapar gränser
• Och?
Så vad betyder det här i praktiken?
Ett formulär:
Skapar grupper – logiska enheter
Alltid vertikala radioknappar
Knappar tillhör gruppen
Anpassa fältens bredd efter innehåll
Högerställ ”labels”
Underlätta användning (tomma formulär)
Alternativ till ”obligatorisk uppgifter”
If(mandatoryFieldsHaveContent() ==
true)
{submit.disable = false;}
Undviker Kognitiv stress
Beteenden hos användaren

 Hur hitta användaren?



      Sök      Navigering   Sök




                                                      Navigering
                            Navigering




                            Sök          Navigering    Sök
Eller så här


          Link


          Link
Inte antingen eller utan och


Användaren kommer inte till startsidan
Hon kommer till den sida sökmotorn hittat
Så snacket om Startsidan är överdriven
Informationsarkitektur

 Låt användaren se var hon är
 Titel (label)
 Breadcrumbs
 Navigering
 Organisation
 Struktur
 Ordning
 Konsekvent
Den digitala miljön i större perspektiv
• Inte bara SharePoint…
Använd konventioner
• Hitta inte på ikoner
• Uppfinn inte hjulet igen

More Related Content

Similar to Användbarhet i praktiken

En introduktion till intranät - praktiska exempel och en del teori
En introduktion till intranät - praktiska exempel och en del teoriEn introduktion till intranät - praktiska exempel och en del teori
En introduktion till intranät - praktiska exempel och en del teorisilverdalen
 
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...Jakob Persson
 
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)Petter Knutsson
 
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationer
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationerFenomenet sociala medier och vad det betyder för finlandssvenska organisationer
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationerKaj Arnö
 
SEO Do's and Don'ts - Söklandskapet 2018
SEO Do's and Don'ts - Söklandskapet 2018SEO Do's and Don'ts - Söklandskapet 2018
SEO Do's and Don'ts - Söklandskapet 2018Linus Logren
 
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106Kajsa Hartig
 
NEA - The design way 22 jan 2015
NEA - The design way 22 jan 2015NEA - The design way 22 jan 2015
NEA - The design way 22 jan 2015Annika Klyver
 
Compare föreläsning och workshop 181121
Compare föreläsning och workshop 181121Compare föreläsning och workshop 181121
Compare föreläsning och workshop 181121Joakim Jansson
 
Hitta och attrahera rätt kompetens
Hitta och attrahera rätt kompetensHitta och attrahera rätt kompetens
Hitta och attrahera rätt kompetensOscar Höglund
 
Dokumenthantering digital summit 2017 05-18
Dokumenthantering digital summit 2017 05-18Dokumenthantering digital summit 2017 05-18
Dokumenthantering digital summit 2017 05-18Lars Blixt
 
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museet
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museetSociala medier ur ett museiperspektiv, erfarenheter från Nordiska museet
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museetKajsa Hartig
 
Kajsa hartig digikult_130411
Kajsa hartig digikult_130411Kajsa hartig digikult_130411
Kajsa hartig digikult_130411Kajsa Hartig
 
HT18 - DA156A - Användbarhet (2)
HT18 - DA156A - Användbarhet (2)HT18 - DA156A - Användbarhet (2)
HT18 - DA156A - Användbarhet (2)Anton Tibblin
 

Similar to Användbarhet i praktiken (20)

Vintergatan introduktion
Vintergatan introduktionVintergatan introduktion
Vintergatan introduktion
 
Nyttovärdering 3.0
Nyttovärdering 3.0Nyttovärdering 3.0
Nyttovärdering 3.0
 
Kreativa Processer 2010 Nackademin, Dag 1
Kreativa Processer 2010 Nackademin, Dag 1Kreativa Processer 2010 Nackademin, Dag 1
Kreativa Processer 2010 Nackademin, Dag 1
 
Vintergatan introduktion
Vintergatan introduktionVintergatan introduktion
Vintergatan introduktion
 
En introduktion till intranät - praktiska exempel och en del teori
En introduktion till intranät - praktiska exempel och en del teoriEn introduktion till intranät - praktiska exempel och en del teori
En introduktion till intranät - praktiska exempel och en del teori
 
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...
“Oväntade effekter” – De oväntade nyttorna av effekt-, målstyrning och impact...
 
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)
Sök är användarnas röst - men hur lyssnar vi (och lite andra tips och idéer)
 
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationer
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationerFenomenet sociala medier och vad det betyder för finlandssvenska organisationer
Fenomenet sociala medier och vad det betyder för finlandssvenska organisationer
 
SEO Do's and Don'ts - Söklandskapet 2018
SEO Do's and Don'ts - Söklandskapet 2018SEO Do's and Don'ts - Söklandskapet 2018
SEO Do's and Don'ts - Söklandskapet 2018
 
Du är vad du läser
Du är vad du läserDu är vad du läser
Du är vad du läser
 
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106
Digitala medier och förmedling, föreläsning på Curatorutbildningen, SU, 121106
 
Kreativa processer, Föreläsning 1 2011
Kreativa processer, Föreläsning 1 2011Kreativa processer, Föreläsning 1 2011
Kreativa processer, Föreläsning 1 2011
 
NEA - The design way 22 jan 2015
NEA - The design way 22 jan 2015NEA - The design way 22 jan 2015
NEA - The design way 22 jan 2015
 
Compare föreläsning och workshop 181121
Compare föreläsning och workshop 181121Compare föreläsning och workshop 181121
Compare föreläsning och workshop 181121
 
Hitta och attrahera rätt kompetens
Hitta och attrahera rätt kompetensHitta och attrahera rätt kompetens
Hitta och attrahera rätt kompetens
 
Dokumenthantering digital summit 2017 05-18
Dokumenthantering digital summit 2017 05-18Dokumenthantering digital summit 2017 05-18
Dokumenthantering digital summit 2017 05-18
 
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museet
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museetSociala medier ur ett museiperspektiv, erfarenheter från Nordiska museet
Sociala medier ur ett museiperspektiv, erfarenheter från Nordiska museet
 
Kajsa hartig digikult_130411
Kajsa hartig digikult_130411Kajsa hartig digikult_130411
Kajsa hartig digikult_130411
 
HT18 - DA156A - Användbarhet (2)
HT18 - DA156A - Användbarhet (2)HT18 - DA156A - Användbarhet (2)
HT18 - DA156A - Användbarhet (2)
 
Transfer Landskrona
Transfer LandskronaTransfer Landskrona
Transfer Landskrona
 

More from Benny Skogberg

More from Benny Skogberg (7)

Net database
Net databaseNet database
Net database
 
Database tutorial
Database tutorialDatabase tutorial
Database tutorial
 
Android Application Development
Android Application DevelopmentAndroid Application Development
Android Application Development
 
Android Application Development
Android Application DevelopmentAndroid Application Development
Android Application Development
 
Website Learnability Study
Website Learnability StudyWebsite Learnability Study
Website Learnability Study
 
Opentaps CRM
Opentaps CRMOpentaps CRM
Opentaps CRM
 
Card Sorting Tools
Card Sorting ToolsCard Sorting Tools
Card Sorting Tools
 

Användbarhet i praktiken

Editor's Notes

  1. Först hittar man delarna: huvudet, öronen, tassarna för att sen skapa sig en helhet av det man ser. I början ser man inte ryggen, svanse eller kroppen. Hur det går till, vet vi inte – men vi vet att det fungerar. Välkommen till Psykologin!
  2. Reification eller på svenska “Förtingligande”. En konstruktiv aspect av uppfattande, där vi skapar en rumslig upplevelse av saker som inte finns. I bilden finns varken triangeln eller klotet – vi skapar det I vårt medvetande.
  3. Multistabilitet; d v s förmågan att skapa olika mönster från samma bild, och få unika uppfatfningar av vad som visas.Konstnären Oscar Reutersvärd är internationellt erkänd för att utnyttja multistabilitet I sina konstverk.
  4. Används för att skilja enheter från varandra för att tydliggöra vilka enheter som hör ihop
  5. Gruppering av element. De behöver inte vara lika för att skapa en logisk enhet.
  6. Objekt som liknar varandra – hör ihop
  7. Ibland blir det otäckt
  8. Närhet. Kolumner och rader
  9. Fisken bildas av fyra helt olika element.Cirklarna är olika, men p g a att ciklarna ligger nära varandra – hänger de ihop i en grupp
  10. Ett formulär som behöver rättas upp
  11. Radioknapparna ska vara vertikala och i linje med textfälten
  12. Knapparna ska följa samma linje som textfälten
  13. Anpassa textfält efter förväntat innehåll
  14. Två grupper ska bli en enhet
  15. Obligatoriska fält markeras med avvikande fält och ibland även med förklarande text i samma färg
  16. Constraints – se till att man inte kan skicka iväg ett formulär utan innehållAlternativ till obligatoriska fält
  17. Underlättar för användaren genom attr stödja hennes kognitiva förmåga, rak linje, anpassade fält och att bara kunna skicka när obligatoriska fält är ifyllda.
  18. Hur hittar användaren det hon söker efter?Genom sök – vidare till navigering – söker igen, kanske på webbplatsens egen sök. Fortsätter till dess användaren hittat det hon söker efter.
  19. Bakåt (Back) är den vanligaste navigeringen på webben
  20. Startisdan används i huvudsak som navigeringsstart – inte för att läsa nyheter eller hitta annat innehåll
  21. Alltid låta användaren veta var hon befinner sig genom att ha en tydlig rubrik och gärna använda breadcrumbs. Navigeringen bör visa på vilken del av webbplatsen man befinner sig. Organisera innehållet innan publicering genom en genomarbetad struktur. Ha ordning och var konsekvent.
  22. Sharepoint, Office, Outlook, CRM-system, Affärssystem, Har förmodligen en iPhone, Bankomat och plastkort med koder, Mikrovågsugnar som inte är intuitiva, fjärrkontrollen och naturligtvis ett tidrapporteringssystem. Allt detta kan skapa kognitiv stress eftersom olika system uppträder på olika sätt – ger olika feedback och uppträder olika.En anställd på en vanlig bensinmack har 25 olika system att hantera – så det MÅSTE vara uppenbart hur man sköter systemen utan att behöva läsa manualen.
  23. Tetra Pak skapade en ikon på sin kontrolpanel – som hade formen av en svala. Vad betyder den?