le design ux

99
Le design UX

Upload: rizomer

Post on 15-Apr-2017

274 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Le design UX

Le design UX

Le design drsquoexpeacuterienceu0lisateur

AtelierEacutecole de communica0on visuelleAix-en-Provence 14-15 avril 2016

Le design drsquoexpeacuterienceu0lisateur

Le design

Le design

Quel(s) sens pour un mot

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 2: Le design UX

Le design drsquoexpeacuterienceu0lisateur

AtelierEacutecole de communica0on visuelleAix-en-Provence 14-15 avril 2016

Le design drsquoexpeacuterienceu0lisateur

Le design

Le design

Quel(s) sens pour un mot

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 3: Le design UX

Le design drsquoexpeacuterienceu0lisateur

Le design

Le design

Quel(s) sens pour un mot

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 4: Le design UX

Le design

Le design

Quel(s) sens pour un mot

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 5: Le design UX

Le design

Quel(s) sens pour un mot

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 6: Le design UX

Le design

Quel(s) sens pour un mot

Contrairement aux ideacutees reccedilues le terme laquo design raquo nrsquoest pas tant un anglicisme qursquoun lanisme (hellip) Il signifie laquo marquer drsquoun signe raquo- Steacutephane Vial Court traiteacute du design

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 7: Le design UX

Le design

Quel(s) sens pour un mot

Cependant le verbe anglais to design a deux sens celui de laquo dessiner raquo () mais aussi celui de projeter en foncgton drsquoun laquo dessein raquo hellip - Steacutephane Vial Court traiteacute du design

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 8: Le design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 9: Le design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 10: Le design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Kids using Dynabook Alan Kay

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 11: Le design UX

Pourquoi ces sens du mot laquo design raquo sont-ils importants lorsqursquoon aborde la ques8on du design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 12: Le design UX

Quels laquo desseins raquo derriegravere lrsquoeacutevolu2ondes interfaces

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 13: Le design UX

Peut-on designer une expeacuterience

design visuel

design drsquointerfaces

design drsquointerac8onarchitecture drsquoinforma8on

speacutecifica8ons fonc8onnelles amp formelles

objec8fs u8lisateur

Selon Jesse James Garret The Elements of User Experience

objec8fs systegraveme interac8f

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 14: Le design UX

Peut-on designer une expeacuterience

compleacute2on

concep2onabstrait

concret design visuel

design drsquointerfaces

design drsquointerac2onarchitecture drsquoinforma2on

speacutecifica2ons fonc2onnelles amp formelles

objec2fs u2lisateur

Selon Jesse James Garret The Elements of User Experience

objec2fs systegraveme interac2f

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 15: Le design UX

Peut-on designer une expeacuterience

surface

skeleton

structure

scope

srategy

Selon Jesse James Garret The Elements of User Experience

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 16: Le design UX

Peut-on designer une expeacuterience

prototyper amp valider

deacutecider

diverger

deacutefinir

deacutecouvrir amp comprendre

Selon Google Ventures adapteacute de IDEO et Stanford Design School

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 17: Le design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

penseacutee plateforme(pla2orm thinking)

design pa6erns

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 18: Le design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

design pa4erns

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UXSource UI Flat Design Mega Collec6ons - h9pwwwshu9erstockcom

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 19: Le design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source Gesture Cards by By Craig Villamor Dan Willis and Luke Wroblewski

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 20: Le design UX

Peut-on designer une expeacuterience

prototypage amp iteacutera4on

paerns amp principes

deacutecouverte amp

compreacutehension

mode(s) drsquointerac4on

Source hpwwwyelvingtoncomfilesplaormpng

penseacutee plateforme(pla8orm thinking)

Nouvelles tendances du design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 21: Le design UX

Peut-on designer une expeacuterience

laquo Now letrsquos talk about that word ldquoexperiencerdquo A lot of people have trouble with this word especially paired with the word ldquodesignrdquo ldquoYou canrsquot call it experience designrdquo they say ldquoHow can you possibly control someone elsersquos experiencerdquo they demand raquo- Jesse James Garret InformaJon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 22: Le design UX

Peut-on designer une expeacuterience

laquo Well wait a minute mdash who said anything about control raquo- Jesse James Garret Informaon Architecture Summit 2009

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 23: Le design UX

Peut-on designer une expeacuterience

laquo Experience is too ephemeral they say raquo - Jesse James Garret Informalton Architecture Summit 2009

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 24: Le design UX

Peut-on designer une expeacuterience

The en+re hypothesis of experience design (and it is a hypothesis at this point) is that the ephemeral and insubstan+al can be designed And that there is a kind of design that can be prac+ced independent of medium and across media- Jesse James Garret Informa+on Architecture Summit 2009

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 25: Le design UX

Peut-on designer une expeacuterience

Percep0on

Ac0on

Cogni0on

Eacutemo0on

Compreacutehension

Baseacute sur Jesse James Garret Informa5on Architecture Summit 2009

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 26: Le design UX

Peut-on designer une expeacuterience

Le design thinking- IDEO

Empathize

Prototype

Test

Define

Ideate

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 27: Le design UX

Peut-on designer une expeacuterience

UX is not UI- by Erik Flowers

Define

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 28: Le design UX

Le spectre du design drsquoexpeacuterience u1lisateur

Peut-on designer une expeacuterience

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 29: Le design UX

Eacutetude de cas

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 30: Le design UX

Eacutetude de cas

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 31: Le design UX

Eacutetude de cas par un pe-tdesign ficon

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 32: Le design UX

Un laboratoire drsquoinnovation en politique publique vient de recevoir un financement Il peut maintenant deacutevelopper son projet drsquoapplication Ce projet a comme objectif drsquoinciter lrsquoimplication dans la vie collective et de nouvelles relations entre citoyens drsquoun mecircme quartier Le projet srsquooriente vers une application qui integravegre reacutealiteacute augmenteacutee cartographie interactive et reacuteseau social Il souhaite articuler les phases de design et de deacuteveloppement numeacuterique suivant une approche agile

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 33: Le design UX

Ce laboratoire vous approche afin de deacutefinir un design qui reacutepond aux objectifs du projet bull proteacuteger lrsquoanonymat et la vie priveacutee bull visualiser les donneacutees capteacutees par les objets connecteacutes preacutesents dans lrsquoentourage bull favoriser la participation sociale et la transparence politique bull encourager lrsquoeacuteconomie du partage non-marchand dans le voisinage bull valoriser lrsquoeacuteconomie locale sociale et solidaire

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 34: Le design UX

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 35: Le design UX

Meacutethode - Brainstorming

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 36: Le design UX

Meacutethode - Brainstorming

Comment nouspourrions

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 37: Le design UX

Meacutethode - Brainstorming

Comment pourrions nous

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 38: Le design UX

Meacutethode - Brainstorming

bull Rester ouvertbull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 39: Le design UX

Meacutethode - Brainstorming

bull Rester ouvert Le brainstorming est plus efficace lorsqursquoon ouvre drsquoabord pour recentrer par la suitehellip

bull Rester concentreacute sur le projet

bull Viser la quan8teacute

bull Encourager toutes les ideacutees

bull Voter pour recentrer et preacute-seacutelec8onner

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 40: Le design UX

Meacutethode - Interviews

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 41: Le design UX

Meacutethode - Interviews

ldquoActually we donrsquot use the term user at Facebook We kind of stopped using it because we want to call them people raquo Margaret Gould Stewart Director of product design

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 42: Le design UX

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 43: Le design UX

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 44: Le design UX

Meacutethode - Interviewsu+lisateurs

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 45: Le design UX

Meacutethode - Interviewsu+lisateurs

Analyse de pa+erns (source Shlomo Goltz Smashing Magazine 2014)

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 46: Le design UX

Meacutethode - Interviewsu+lisateurs

laquo When the creators of soware-based products examine their handiwork they overlook how bad it israquo - Alan Cooper The Inmates Are Running The Asylum

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 47: Le design UX

Meacutethode - Interviewsu+lisateurs

laquo Programming is such a difficult and absorbing task that it dominates all other considera6ons including the concerns of the user raquo - Alan Cooper The Inmates Are Running The Asylum

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 48: Le design UX

Quel eacutecho ont aujourdrsquohui ces propos alors qursquoeacutemergent des enjeux autour de technologies telles lrsquointernet des objets ou lrsquointelligence ar9ficielle

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 49: Le design UX

Meacutethode - Persona

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 50: Le design UX

Meacutethode - Persona

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 51: Le design UX

Meacutethode - Persona

BiographieMo+va+on ou objec+f

Design deacutedieacute

Sceacutenario drsquousage ou drsquointerac+on

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 52: Le design UX

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 53: Le design UX

Meacutethode - Persona

Preacutenom

BiographieMovaon ou objecf

Design deacutedieacute

Sceacutenario drsquousage ou drsquointeracon

Une journeacutee dans la vie de

Tagline

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 54: Le design UX

Meacutethode - Persona

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 55: Le design UX

laquo We believe that basing personas on real data is well worth the effort

hellipin terms of establishing credibility and achieving successful outcomes raquo - John Prui+ and Jonathan Grudin - Design Studies Human-Centered Design

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 56: Le design UX

laquo We donrsquot use personas We use ourselves raquo

laquo I believe personas lead to a false sense of understanding at the deepest most criltcal levels raquo - Jason Fried Founder of 37signals Signal vs Noise blog

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 57: Le design UX

laquo For a start personas donrsquot subs1tute the need to do your homework

helliptalk to real people and test your assump1ons on a live audienceraquo- Andy Budd UX Designer and founder of Clearle7

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 58: Le design UX

Pourquoi considegravere-t-on ce0e forme de synthegravese de la recherche sur les u7lisateurs

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 59: Le design UX

Meacutethode - Bodystorming

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 60: Le design UX

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 61: Le design UX

Meacutethode - Bodystorming

people by irene hoffman the Noun Project

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 62: Le design UX

Meacutethode - Bodystorming

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 63: Le design UX

Meacutethode - Bodystorming

bull Se leverbull Le faire

bull Consideacuterer des accessoires

bull Reacutepar9r les rocircles

bull Documenter en images et en sonsbull Observer et noter

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 64: Le design UX

Meacutethode - Bodystorming

We bodystorm to generate unexpected ideas that might not be realized by talking or sketching- Standford

DSchool

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 65: Le design UX

Meacutethode - Bodystorming

Un bodystorm permet drsquoimaginer et de deacutefinir en contexte et agrave travers des comportements

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 66: Le design UX

Meacutethode - Bodystorming

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 67: Le design UX

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Mental Notes Cardsde Stephen P Anderson

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 68: Le design UX

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Game Design A Deck of Lensesde Jesse Schell

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 69: Le design UX

Ce contexte interacf peut ecirctre perccedilu agrave travers diffeacuterentes laquo lenlles raquo

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 70: Le design UX

Meacutethode - Cartographie dexpeacuterience

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 71: Le design UX

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PDFescape

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 72: Le design UX

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

La carte documente de faccedilon exhaus2ve lrsquoexpeacuterience (interac(ons canaux) qursquoune personne peut avoir avec un produit ou un service et elle sert de base agrave la phase de design - Sylvie Daumal Design dexpeacuterience ugtlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 73: Le design UX

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo Pour construire ce-e cartographie il convient drsquoeacutetablir lrsquoinventaire de tous les points de contact raquo- Sylvie Daumal Design dexpeacuterience ultlisateur

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 74: Le design UX

Meacutethode - Cartographie dexpeacuterience

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

PENSE ET SENS

FAIS

ENTENDS

VOIS

ESPACES

EacuteTAPES

PERSONA

Cartographie drsquoexpeacuterience

adapteacute du JX DESIGN KIT by tlabmars

(QUI )

(OUgrave )

(QUOI )

(QUOI )

(COMMENT)

(POURQUOI)

DESIGNER

DATE

VERSION

laquo The ac(vity of mapping builds knowledge and consensus across teams and stakeholders and the map as ar1fact allows you to create and support belter customer experiencesraquo- Adap4ve Paths Guide To Experience Mapping

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 75: Le design UX

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 76: Le design UX

Meacutethode - Wireframing

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 77: Le design UX

Meacutethode - Wireframing

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 78: Le design UX

Meacutethode - Wireframing

Les wireframes sont des structures scheacutema0ques drsquointerfaces

Ils communiquent la rela0on entre les eacuteleacutements perccedilus par lrsquou0lisateur

Ils peuvent avoir diffeacuterents niveaux de laquofideacuteliteacuteraquo par rapport agrave lrsquointerface finale

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 79: Le design UX

Meacutethode - Wireframing

A wireframe is a low fidelity representa3on of a design It should clearly show

ndash the main groups of content (what)

ndash a descrip3on and basic visualisa3on of the user ndash interface interac3on (how)

- Marcin Treder CEO de la plateforme UXPin

ndash the structure of informa3on (where)

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 80: Le design UX

Meacutethode - User Stories

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 81: Le design UX

Meacutethode - User Stories

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 82: Le design UX

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 83: Le design UX

Meacutethode - User Stories

- Lindsay Ratcliffe and

Marc McNeill

Agile Experience Design

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 84: Le design UX

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 85: Le design UX

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 86: Le design UX

Meacutethode - Social Business Canvas

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 87: Le design UX

Meacutethode - Social Business Canvas

Le business canvas permet de structurer la conversa1on autour drsquoune vision entrepreneuriale

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 88: Le design UX

Meacutethode - Social Business Canvas

Des versions du business canvas penseacute par Alexander Osterwalder existent pour diffeacuterents types de projets

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 89: Le design UX

Une derniegravere note pour la routehellip

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 90: Le design UX

Les diverses meacutethodes du design UX megravenent donc agrave la creacutea8on de divers livrableshellip

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 91: Le design UX

Ces livrables perme-ent de communiquer les face-es drsquoun projet aux collaborateurs (informaques financiers graphiques etc)

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 92: Le design UX

Les livrables ont deacutefini la pra2que du design UX Mais le design UX ne se reacutesume pas agrave ses livrables

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 93: Le design UX

laquo Value has ulmately been placed on the deliverable not on the experience being created With interacve experiences evolving rapidly the deliverable is just not enough raquo- Jeff Gothelf Lean UX - Ge=ng out of the deliverables business

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 94: Le design UX

laquo You canrsquot hide behind your monitor any moreSeriously Itrsquos 9me to come outGet it out there FastIn public (Yes where people can see it) raquo- Jeff Gothelf Lean UX - Ge5ng out of the deliverables business

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 95: Le design UX

Ressources amp Reacutefeacuterences

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 96: Le design UX

Ressources amp Reacutefeacuterences

Court traiteacute du design

The Elements of User Experience

IDEO Design KitsInVision e-courses

Boxes and Arrows Designers interacDfs

UX MaGers

Standford DSchool IA InsDtute amp Summit

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 97: Le design UX

Smashing Magazine

Smashing Magazine

Google Design SprintDesign Fic6onrsquos Vimeo Channel

The Inmates are Running the Asylum

Get the SWAG on

Design drsquoexpeacuterience u6lisateur

Agile Experience Design

UX Republic

Ressources amp Reacutefeacuterences

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 98: Le design UX

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer

Page 99: Le design UX

Palee de couleurs de 2001 Odysseacutee de lrsquoespace (source moviesincolorcom)

Merci pour votre par-cipa-onDjela Djamba OkokoDesigner drsquointerac-on

hltprizomerorgdjelarizomerorgrizomer