ux not magi swetug 2015

23
UX != Magi Ola Karlsson @o_k [email protected] www.usersandcode.com

Upload: ola-karlsson

Post on 27-Jul-2015

250 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: Ux not magi swetug 2015

UX != MagiOla Karlsson

@o_k

[email protected]

www.usersandcode.com

Page 2: Ux not magi swetug 2015

Vad är egentligen UX

Vad ska vi prata om

Praktiska tips

UX metodiker

Page 3: Ux not magi swetug 2015

UX == Grafisk design

Design == principerDesign != konst

Design är problemlösningKonst är ett uttrycksätt

Grafisk design = X/1

Den stora UX myten

UX > Grafisk design

Page 4: Ux not magi swetug 2015

Vad är UX?? UX

Design

Användbarhet

Grafisk design

Tillgänglighet

UX Design (UXD)

Experience Design (XD)

?Interaction Design (IxD)

Page 5: Ux not magi swetug 2015

User Experience (UX)

Donald (Don) Norman

Elektrisk-ingenjör, Dr Matematisk psykologiKognitionsvetenskap på Harvard 1950-talet

The Design of Everyday Things.User Centered Design

User Experience Architect – Apple 1993

http://en.wikipedia.org/wiki/User_experience

Page 6: Ux not magi swetug 2015

Människa–datorinteraktion (MDI / HCI)

” Människa–datorinteraktion, förkortat MDI, är ett forskningsområde som omfattar planering, design och studier av interaktiva produkter och tjänster.”

Började som interaktionen mellan människor och datorer, via ett användargränssnitt som inkluderar både programvara och hårdvara.

Numera ser man även bortom interaktion med det traditionella gränssnittet, dvs. interaktionen sätts i ett sammanhang.

HCI – Tidigt 1980:tal

http://www.interaction-design.org/encyclopedia/human_computer_interaction_hci.html

Page 7: Ux not magi swetug 2015

Kognitionsvetenskap

”Centrala kognitionsvetenskapliga frågeställningar är hur människan tar till sig och bearbetar information/kunskap, hur hon interagerar med den sociala och materiella omgivningen, hur hon fattar beslut och löser problem och vilken roll emotioner spelar för hennes tankeprocesser.”

http://sv.wikipedia.org/wiki/Kognitionsvetenskap

Kognitionvetenskap – ca mitten 1900:talet

Page 8: Ux not magi swetug 2015

ISO Standard!!

MarknadsföringKöp / Installation

Grafisk designAnvändbarhet

FunktionalitetSupport

"a person's perceptions and responses that result from the use or anticipated use of a product, system or service"

The international standard on ergonomics of human system interaction, ISO 9241-210

Page 9: Ux not magi swetug 2015
Page 10: Ux not magi swetug 2015

UX metoder

User Centered Design

Agile UX

Lean UX

Page 11: Ux not magi swetug 2015

User Centered Design (UCD)

Djup förståelse av användarna - vem, var, när, hur – personas, scenario, use case- intervjuer, observationer

Iterativ process – testa och förbättra

Produkten eller tjänsten skall vara utformad baserad på användarnas kunskaper, situation och behov. Användarna skall inte behöva anpassa sig till produkten.

ISO 9241-210:210 Human-centred design for interactive systems

Fokus på användarna- se utifrån deras synvinkel

Användartester – tidigt, genom hela projektet och efter- enkla prototyper, senare riktig kod

Page 12: Ux not magi swetug 2015

Agile UX

“One sprint ahead”

Analys

Koncept

Sprint 0 Sprint 1 Sprint 2

UX

Samarbete om koncept Samarbete - Sprint 1 Samarbete - Sprint 2

DEV

Wireframes Sprint 1

Användbarhets test – sprint 1

Research – Sprint 2

Wireframes Sprint 2

Användbarhets test – sprint 2

Research – Sprint 3

Wireframes Sprint 3

Användbarhets test – sprint 3

Research – Sprint 4

Arkitektur

Utvecklingsmiljö / Setup

Utveckla - Sprint 1

Testa – Sprint 1

Deploy – Sprint 1

Utveckla - Sprint 2

Testa – Sprint 2

Deploy – Sprint 2

o.s.v.

Page 13: Ux not magi swetug 2015

Lean UX – Vad?

Affärsnytta

“lean start-up”, “lean manufacturing” minimera “slöseri”

“Learning loops” (bygg – testa/mät - lär)

Validera

Minimum Viable Product (MVP)

Hypotes

Page 14: Ux not magi swetug 2015

Lean UX – i praktiken

Mindre specialister – mer generalister

“Lättviktigtare artefakter”

Page 15: Ux not magi swetug 2015

Lean UX – i praktiken

Användarintervjuer

Page 16: Ux not magi swetug 2015

Lean UX – i praktiken?

Personas

Page 17: Ux not magi swetug 2015

Lean UX – i praktiken

Användartester

Page 18: Ux not magi swetug 2015

Lean UX – i praktiken

Design – Design Studio5 min

5 min

Page 19: Ux not magi swetug 2015

Vad är egentligen UX

Vad har vi pratat om

Praktiska tips

UX metodiker

Page 20: Ux not magi swetug 2015

Att ta med

Funktion över form

UX != Grafisk design!

Page 21: Ux not magi swetug 2015

Att ta med

Förstå dina användare

Page 22: Ux not magi swetug 2015

Att ta med

Tänk!

Page 23: Ux not magi swetug 2015

Ola Karlsson@o_k

[email protected]

www.usersandcode.com

"Cognitive Science Hexagon" - Licensed under Creative Commons Attribution-Share Alike 3.0 via Wikimedia Commons - http://commons.wikimedia.org/wiki/File:Cognitive_Science_Hexagon.svg#mediaviewer/File:Cognitive_Science_Hexagon.svg

"Donald Norman at AWF05" by jordanfischer - http://flickr.com/photos/jordanfischer/61429449/. Licensed under Creative Commons Attribution 2.0 via Wikimedia Commons - http://commons.wikimedia.org/wiki/File:Donald_Norman_at_AWF05.jpg#mediaviewer/File:Donald_Norman_at_AWF05.jpg

”Lean UX” - https://www.flickr.com/photos/rosenfeldmedia/3978302604/

"Agile Manifesto" - Cropped by OK - https://www.flickr.com/photos/visualpunch/8745184787/

640px-FANUC_6-axis_welding_robots.jpg, Licensed under Creative Commo wikipedia http://en.wikipedia.org/wiki/File:FANUC_6-axis_welding_robots.jpg

"User experience design" - Andy Bright -https://www.flickr.com/photos/flat61/3883611709/

"Persona - UX" by Francisco Tosete - https://www.flickr.com/photos/ftosete/6168815114/

"Proto-Persona" - by visualpun.ch - https://www.flickr.com/photos/visualpunch/8746183950/

Fatboy-Meeting.jpg By Jacob Bøtter (Flickr) [CC-BY-2.0 (http://creativecommons.org/licenses/by/2.0)], via Wikimedia Commons

"Incremental persona post validation" by Adrian Howard - https://www.flickr.com/photos/adrianhoward/8710475545/

"Job interview 0001" by bpsusf - http://www.flickr.com/photos/usfbps/4607149870/. Licensed under Creative Commons Attribution 2.0 via Wikimedia Commons - http://commons.wikimedia.org/wiki/File:Job_interview_0001.jpg#mediaviewer/File:Job_interview_0001.jpg

Image attributions: