frukostseminarium jan besökarna i fickan

Dina besökarefinns i fickanFrukostseminarium 31 januari 2013

2

DINA BESÖKARE FINNS I FICKANTrafiktillväxten i Sverige för mobila datatjänster

2009

2011

2012

2008Nedladdade terrabyte per år, källa:

Internetstatistik

mailto:http://www.internetstatistik.se/artiklar/101000-terabyte-data-i-mobilnaten-under-2011/

3

DINA BESÖKARE FINNS I FICKANSmartphone-försäljning jämfört med PC-försäljning

2012

2011

2010

2002

4

DINA BESÖKARE FINNS I FICKANTänk mobilt först

»480 miljoner Android-enheter och 400 miljoner iOS-enheter har sålts i världen– Att jämföra med en miljard

datorer med Microsoft Windows

– Att jämföra med att det finns 2,2 miljarder internetanvändare i världen

Källa: Luke Wroblewski

http://www.lukew.com/ff/entry.asp

5

DINA BESÖKARE FINNS I FICKANLuke Wroblewski om att tänka mobilt först

Utgiven av A Book Apart, 2011

6

DINA BESÖKARE FINNS I FICKAN

»Att förstå nya beteendemönster»Tänk mobilt först»Så arbetar en mobil redaktör»En checklista för mobil

utveckling

Agenda

7

Att förstå nya beteendemönster

8

DINA BESÖKARE FINNS I FICKANVad gör användarna med sin mobila enhet?

Källa: Google

Kollar e-post 74%

Facebookar 68%

Surfar 85%

mailto:http://services.google.com/fh/files/blogs/our_mobile_planet_sweden_sv.pdf

9


»Ny amerikansk studie undersöker vårt användande av den nya tekniken– Ipsos har genomfört en

kvalitativ och kvantitativ undersökning på uppdrag av Google under våren 2012

Att förstå användarnas beteendemönster

10


»Besökaren använder olika enheter under en dag och växlar mellan dem hela tiden


11


»Sekventiellt – Vi byter mitt i ett flöde

»Samtidigt – Vi ”multitaskar” eller kompletterar


12


»Fyra faktorer avgör vårt val– Tillgänglig tid– Fysisk plats– Känslan för stunden– … och vårt mål


13

DINA BESÖKARE FINNS I FICKANAtt förstå användarnas beteendemönster

17

30

3943

Så många minuter av vår fritid spenderar vi när vi använder olika enheter på en dag

Källa: The New Multi-Screen World

mailto:http://www.thinkwithgoogle.com/insights/featured/new-multi-screen-world-insight/

14


17

30

39 På jobbet och hemma Uppgiftsorienterat Kräver tid och fokus

På väg, men också hemma Kommunikation och kontakter Kort information på kort tid

Mest hemma Bläddrande och underhållande Avspänt användande på fritiden



15


34%använder mobilen för att den är närmast

Om jag tittar på TV orkar jag inte resa mig upp för att hämta min dator, utan jag tar bara fram telefonen.



16


Söker och surfar

65%

60%

4%

Shoppar

63%

58%

5%

Reseplanerar

47%

45%

3%

Går till banken

59%

56%

3%

Facebookar

66%

58%

8%

1

2

3



17

Att tänka mobilt först

18

DINA BESÖKARE FINNS I FICKANSkillnaden mellan mobilwebb och följsam – responsiv – design

Följsam design MobilwebbFöljsam design för olika skärmstorlekar Smartphoneanpassad design

Allt innehåll presenteras i samma mallar

Utvalt innehåll presenteras i specifika mallar

Utvecklas på standards och öppna ramverk

Specifika lösningar för specifika behov

19

DINA BESÖKARE FINNS I FICKANFör att användarna förväntar sig det

20

DINA BESÖKARE FINNS I FICKANWebbappen

22

DINA BESÖKARE FINNS I FICKANMobilwebben

24

DINA BESÖKARE FINNS I FICKANFöljsam – responsiv – webb

25

Så arbetar en mobil redaktör

29

En checklista för mobil utveckling

30


»Strategin är att tänka mobilt först– Följsam design är en lösning (av många)

Checklista - strategi

Strukturera utifrån innehåll

Utgå från användarna –

inte teknikenUtvärdera plattformar och ramverk

31


»Innehåll är navigation– Topp- och vänstermenyer får en helt annan funktion

Checklista – användarupplevelsen

Basera gränssnitt

på gester och rörelser(också)

Använd intedialogrutor och pop-ups

Basera koncept för både bästa

och sämsta scenariot

32


»Teknikanvändning är en designfråga– Dålig design är det samma som långsamma webbtjänster

Checklista – visuell design

Tänk igenom användning av bilder

Testa tidigt – både inne i appar och i webbläsaren

Tänk i flöden,inte i sidor(kasta Photoshop-mallen)

33


»Designval blir teknikfrågor– Dålig design kan resultat av önsketänkande i utvecklingsprocessen

Checklista – visuell design

Välj kodstandard efter krav påtillgänglighet

Implementera visuell design omsorgsfullt

Ha tydliga prestandakrav och var sparsam med serveranrop

34


1. Ta fram strategier för användbarhet– Analysera målgruppen (inte tekniken) och tänk mobilt först

2. Välj ramverk för ”design för alla”– Ta fram interaktionsdesign baserad på standards och vedertagna metoder

3. Slå fast principer för navigation– Innehållet kommer före formen

4. Designa omsorgsfullt– Ny regler gäller för typografi, bilder, media … och tänk utanför skärmen!

5. Utveckling baserad på standards– Specialanpassning skapar teknisk skuld i den framtida utvecklingen

Sammanfattningsvis – tänk mobilt först

35


»Content is faktiskt fortfarande king

Framöver på Metamatrix

Välkomna den14 februari 2013kl 9.00 – 10.00

metamatrix.seSveavägen 31, 111 34 Stockholm | c/o Malmö Arena, Norra Vallgatan 20, 211 25 MALMÖ

Växel: 08-50 65 33 00

frukostseminarium jan besökarna i fickan

Documents