174
UX och digitala trender Per Axbom Axbom Innovation AB @axbom på Twitter

UX och digitala trender

Embed Size (px)

DESCRIPTION

Föreläsning som gavs på Karolinska institutet den 19 september 2012

Citation preview

Page 1: UX och digitala trender

UX och digitala trender

Per AxbomAxbom Innovation AB

@axbom på Twitter

Page 2: UX och digitala trender
Page 3: UX och digitala trender
Page 4: UX och digitala trender
Page 5: UX och digitala trender
Page 6: UX och digitala trender

“The world as we have created it is a process of our thinking. It

cannot be changed without changing our thinking.”

Page 7: UX och digitala trender
Page 8: UX och digitala trender
Page 9: UX och digitala trender
Page 10: UX och digitala trender
Page 11: UX och digitala trender
Page 12: UX och digitala trender

Ny teknik ger oss nya möjligheter att prata med

människor och skapa visuell information.

Men gör vi det?

Page 13: UX och digitala trender

Vad ser du framför dig när jag säger att vi ska bygga en

webbplats?

Page 14: UX och digitala trender
Page 15: UX och digitala trender
Page 16: UX och digitala trender

Jag ser det här:

Page 17: UX och digitala trender

TACK!

TACK!TACK!

TICK!

Page 18: UX och digitala trender

TACK!3-STEGS-PLANEN

VAR SUPER!

TACK!RECEPTET

VAR LÄCKERT!

Page 19: UX och digitala trender

TACK!JOBBET ÄR STÖRTKUL!

Page 20: UX och digitala trender

TACK!VILKA BRA

IDÉER VI FICK!!

Page 21: UX och digitala trender

TACK!SCHAMPOOT

FUNKAR!

Page 22: UX och digitala trender

Fråga till publiken:Varför producerar vi innehåll?

Page 23: UX och digitala trender

Vanliga frågor man får när man jobbar med

användbarhet och UX:

Page 24: UX och digitala trender

Hur många länkar får det vara i menyn?

Page 25: UX och digitala trender

Hur många ord får jag skriva i min artikel?

Page 26: UX och digitala trender

Hur många personer ska jag testa med?

Page 27: UX och digitala trender

Hur många sekunder måste sidan ladda på?

Page 28: UX och digitala trender

Hur ska vi be om personnummer från

användaren?

Page 29: UX och digitala trender

Akta er för konsulter som har snabba svar på de frågorna.

— men vill ni ha längre svar sedan, fånga mig efter föreläsningen ;)

Page 30: UX och digitala trender

Hur tänker personer som frågar så här?

?

Page 31: UX och digitala trender

MÄNNISKOR ÄR MASKINER

Page 32: UX och digitala trender

MÄNNISKOR ÄR FÖRUTSÄGBARA

Page 33: UX och digitala trender
Page 34: UX och digitala trender

DET FINNS EN MAGISK FORMEL

Page 35: UX och digitala trender

JAG BYGGER EN WEBBPLATS

Page 36: UX och digitala trender

Uppgift(fram med penna och papper)

Page 37: UX och digitala trender

Designa en ny, häftig vas.

Page 38: UX och digitala trender

Hur jag kunde ha formulerat uppgiften annorlunda:

Page 39: UX och digitala trender

Skapa något som gör att Anna trivs bättre i sitt vardagsrum.

Page 40: UX och digitala trender

Vi har fastnat i att skapa vaser.

WebbplatserArtiklarSidor

Page 41: UX och digitala trender

Ofta har vi inte en susning om vilket problem det är vi löser...

Page 42: UX och digitala trender

Det första en nyanställd undrar:

NI HAR VÄL EN REDAKTION SOM SPRUTAR

UT NYA ARTIKLAR PÅ LÖPANDE BAND?

Page 43: UX och digitala trender

Det första en nyanställd undrar:

HUR FÅR JAG BÄST HJÄLP MED ATT KOMMA IGÅNG

OCH GÖRA BRA IFRÅN MIG I MITT ARBETE?

Page 44: UX och digitala trender

Tiden vi lägger på att producera nytt innehåll generellt.

Tiden vi lägger på att uppdatera innehållet för

nyanställda.

Page 45: UX och digitala trender

Tiden vi lägger på att producera innehåll för nyanställda.

Tiden vi lägger på att prata med nyanställda i

syfte att förstå deras behov.

Page 46: UX och digitala trender

Slutsatser

Vi vet inte hur vi prioriterar våra målgrupper.

Vi har inte lyssnat tillräckligt på de vi skapar innehåll för.

Page 47: UX och digitala trender

“Vi vet redan vad folk vill ha.”

Page 48: UX och digitala trender

“Vill du ha uppdaterade nyheter på intranätet?”

Page 49: UX och digitala trender

“Vill du ha uppdaterade nyheter på intranätet?”

Fel!

Page 50: UX och digitala trender

“Hur ser en vanlig arbetsdag ut för dig?”

Page 51: UX och digitala trender

“Vad retar du dig mest på i ditt jobb?”

Page 52: UX och digitala trender

GOOB!

Page 53: UX och digitala trender

“Jahaa!! Är det sååå det funkar!”

“Jahaa!! Är det sååå de tycker!”

Page 54: UX och digitala trender

6-månadersprojektför nytt rekryteringsverktyg.

Page 55: UX och digitala trender

NEJ TACK!

Page 56: UX och digitala trender

2-veckorsprojekt som fixade allt i Outlook.

Page 57: UX och digitala trender

TACK!

Page 58: UX och digitala trender
Page 59: UX och digitala trender

Du har två öron och en mun.

Page 60: UX och digitala trender

Lyssna dubbelt så mycket som du pratar*.

*Ja, prata är att producera/sända information.

Page 61: UX och digitala trender

Skapa relationer

Page 62: UX och digitala trender

Samtidigt löser vi inte de problem vi känner till.

Page 63: UX och digitala trender

FAQ!Bevisföremål:

Page 64: UX och digitala trender
Page 65: UX och digitala trender

Hur ska jag som har frågan för första gången veta att det är en

vanlig, ofta ställd fråga?

Page 66: UX och digitala trender
Page 67: UX och digitala trender

Vår förmåga att lägga komplexiteten hos användaren

(typiskt hos formulär)

Page 68: UX och digitala trender
Page 69: UX och digitala trender

Vad är exempel på att öka komplexiteten?

Page 70: UX och digitala trender
Page 71: UX och digitala trender
Page 72: UX och digitala trender
Page 73: UX och digitala trender
Page 74: UX och digitala trender
Page 75: UX och digitala trender
Page 76: UX och digitala trender

Vad händer när vi ökar komplexiteten?

Page 77: UX och digitala trender

- Det kommer nästan ingen genomden där dörren.Jag visste väl att

webben inte skulle leverera!

Page 78: UX och digitala trender
Page 79: UX och digitala trender
Page 80: UX och digitala trender

Vad händer när du fäller dina användare om och om igen?

Page 81: UX och digitala trender
Page 82: UX och digitala trender
Page 83: UX och digitala trender

NYT

TA

SMÄR

TA

Page 84: UX och digitala trender

Hur gör vi för att minska komplexiteten?

Page 85: UX och digitala trender

Vad menar jag med att ta bort interaktion?

Page 86: UX och digitala trender
Page 87: UX och digitala trender
Page 88: UX och digitala trender
Page 89: UX och digitala trender

HSBC Hong Kong.Från 17 fält till 3.

Från $1M till $20M.Label:

Button

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label:

Label: Label:

Label:

Label:

Label:

Button

Page 90: UX och digitala trender

Design är osynligt till dess att det skapar problem.

Page 91: UX och digitala trender

Trend: Responsive

Page 92: UX och digitala trender

En ny teknisk lösning som ska lösa övergången till mobilt.

Page 93: UX och digitala trender
Page 94: UX och digitala trender

Problem med responsive

Page 95: UX och digitala trender
Page 96: UX och digitala trender
Page 97: UX och digitala trender

Mobile first, eller just mobile.

Page 98: UX och digitala trender

Hur läser ni nyheter?

Page 99: UX och digitala trender

Så här konsumerar jag nyheter...

Page 100: UX och digitala trender
Page 101: UX och digitala trender

1 kolumn är bäst just nu!

Page 102: UX och digitala trender
Page 103: UX och digitala trender

20xlängre

30%bättre

Page 104: UX och digitala trender

Mobilt.Bärbart.

Fler apparater.The Internet of Things.

Page 105: UX och digitala trender

WEBB

Page 106: UX och digitala trender

WEBB WEBB WEBB

WEBB

WEBBWEBBWEBBWEB

BWEBBWEBB

Page 107: UX och digitala trender

WEBB WEBB WEBB

WEBB

WEBBWEBBWEBBWEB

BWEBBWEBB

Page 108: UX och digitala trender
Page 109: UX och digitala trender
Page 110: UX och digitala trender
Page 111: UX och digitala trender
Page 112: UX och digitala trender
Page 113: UX och digitala trender

Quantified Self

Page 114: UX och digitala trender

Hur många steg har ni gått idag?

Page 115: UX och digitala trender

withings.comfitbit.com

Zombies, Run!

Page 116: UX och digitala trender

Hur har ni sovit?

Page 117: UX och digitala trender
Page 118: UX och digitala trender

Hur glada var ni förra måndagen?

Page 119: UX och digitala trender
Page 120: UX och digitala trender

Språk! (roligt och intresseväckande)

Page 121: UX och digitala trender
Page 122: UX och digitala trender

vroom

Sök företag

Prospekt

Urval individer

Dina favoritaktiviter

Företag

Person

Begagnat

Karl AlexanderssonVAG Bromma

! logga ut

Datum Typ Namn visa | ändra ta bort

2010-09-27 Företag Sed volutpat porttitor blandit (17) visa | ändra ta bort

2010-08-12 Person Proin lacus risus, cursus vel auctor (5) visa | ändra ta bort

2010-02-03 Prospekt Nullam ullamcorper risus eget (14) visa | ändra ta bort

2009-12-04 Annat Duis vestibulum magna sit amet (3) visa | ändra ta bort

Dina sparade sökningar / bevakningar

Ny kampanjVägvisaren

Karl AlexanderssonSeptember

Datum Typ Namn visa | ändra ta bort

2010-09-27 Företag Sed volutpat porttitor blandit (17) visa | ändra ta bort

2010-08-12 Person Proin lacus risus, cursus vel auctor (5) visa | ändra ta bort

Dina prospektlistor

Start Välkommen Karl! Vad vill du göra idag? Söka företag | Dela med mig av vroom |  Titta på film

telefon: 08-55 60 35 90support vardagar 9-17

!Galaxer i mina braxer!Vill du radera “Set volutpat”?Nej, behåll den | Ja, ta bort den

Friday, October 8, 2010

Page 123: UX och digitala trender

Ljud!

Page 124: UX och digitala trender
Page 125: UX och digitala trender

Video.

Page 126: UX och digitala trender
Page 127: UX och digitala trender

Hur ofta skriver ni text utan att illustrera

texten?

Page 128: UX och digitala trender

Varför audiovisuellt funkar

KognitivtEmotionellt

Känslor spelar en viktig roll i beslutsfattande och inlärning. De påverkar mekanismerna i

rationellt tänkande.

1. Fler förstår. 2. Fler besöker. 3. Fler delar med sig.4. Det blir synligt i fler kanaler.

Page 129: UX och digitala trender

Att föra anteckningar 2012

Page 130: UX och digitala trender

Nyheter 2012

Page 131: UX och digitala trender

#tahrirhttp://tracker.clima.me/

Page 132: UX och digitala trender
Page 133: UX och digitala trender

Lärande 2012

Page 134: UX och digitala trender
Page 135: UX och digitala trender

ALLT går att återuppfinna

Page 136: UX och digitala trender
Page 137: UX och digitala trender

“If no one hates your website, there's a good chance no one

loves it either.”

http://per.ax/lingtalk YouTube

— Ling Valentine

Page 138: UX och digitala trender

SEB Innovation Awards

Page 139: UX och digitala trender
Page 140: UX och digitala trender

hej SEB!

Page 141: UX och digitala trender

bcxfqJvsen betalning

klassiska problem:

dalig

planering

fanns inte

pengar

ovantade

utgifter

Page 142: UX och digitala trender

losning:

vi bygger en robot som letar

efter monster i betalningarna

Page 143: UX och digitala trender

...och talar om hur det ser ut:

Snart månadsskifte!1. Det ser ut som

om du har 2000 kr mer i räkningar denna månad.

2. Du brukar betala cirka 500 kr till Telia varje månad men du har inte matat

in en sådan räkning...

FORTSÄTT

Page 144: UX och digitala trender

Räknar du med att betala till Telia

varje månad?

Du betalar cirka 8000 i räkningar. Vill du bli varnad

när du överskrider?

...och staller smarta fragor:

JA NEJ

JA NEJ

6 *) .-J

Page 145: UX och digitala trender

det kan ocksA bli vackra diagram:

.1hQNM

0

50

100

150

200

jun jul aug sep

Page 146: UX och digitala trender

.

roboten och kunden lever

lyckliga tillsammans.

Page 147: UX och digitala trender

tack SEB!

Page 148: UX och digitala trender
Page 149: UX och digitala trender

Människan i fokusSkapa en relation

Visualisera för förståelseMinimera interaktion

Visa målbilden (“Tack SEB!”)

Idéer utanför företaget

Page 150: UX och digitala trender

Välja avsändare...

Page 151: UX och digitala trender

SCA Packaging

Page 152: UX och digitala trender

Vad händer när vi är proaktiva (i framtiden)

Page 153: UX och digitala trender

Ledtråd

Varje nödvändig interaktion är en

smärtpunkt

Page 154: UX och digitala trender

Att se

Page 155: UX och digitala trender

Att lyssna

— “Jag sa ju till min fru förra veckan att gungan i parken är trasig, har ni inte fixat den?”

Page 156: UX och digitala trender

Att möjliggöra

Page 157: UX och digitala trender

Deltagande

— En kille på Solgatan skickade in ett helt nytt designförslag på en sittgunga som funkar för rörelsehindrade barn. Den ser grym ut!

Page 158: UX och digitala trender

Kostnadseffektivitet

— Jag går ner till Alberts Sko- och nyckelservice, och skriver ut gungan!

Page 159: UX och digitala trender

Att ge mandat

— ...eller vänta, de har visste redan gjort det!

Page 160: UX och digitala trender

Som ger resultat

Page 161: UX och digitala trender
Page 162: UX och digitala trender
Page 163: UX och digitala trender
Page 164: UX och digitala trender

Dina reglage

Människa-dator interaktion

Sinnen / multimedia

Lyssna efter problem

Gå nära / skapa relation (Lös problemen)

Page 165: UX och digitala trender

Det du älskar att

skapa

Det någon annan vill ha

Page 166: UX och digitala trender

2 tjänster att börja använda direkt

•Jing — per.ax/jing

•Piktochart — per.ax/pikto

Page 167: UX och digitala trender

Det bästa tecknet på att du gjorde ett bra jobb:

Page 168: UX och digitala trender

TACK!

Page 169: UX och digitala trender

Jag heter Per Axbom.Om något jag sa fick dig att

tänka till får du gärna tala om det. För mig eller hela världen.

axbom.se/ki Tack!

Page 170: UX och digitala trender
Page 172: UX och digitala trender

STOPP

Nu har du bläddrat för långt...

Page 173: UX och digitala trender
Page 174: UX och digitala trender