1.
worldwide
Design d’information
pour le web
Ecole des Gobelins - Décembre 2008

2.
Design d’information pour le web
SOMMAIRE
‣ Introduction : éléments de contexte
‣ 4 axes de conception
‣ 6 questions à se poser
‣ Outils

3.
Design d’information pour le web
“Design is the intermediacy
between information and
understanding”
Richard Grefé
Executive director,
American Institute of Graphic Arts (AIGA)

4.
Design d’information pour le web
“In order to do a better job
of developing, communicating,
and pursuing a strategy,
you need to learn to think like
a designer”
Tim Brown
CEO Ideo,
Strategy by Design, June 2005
http://www.fastcompany.com/magazine/95/design-strategy.html

5.
Design d’information pour le web

6.
Design d’information pour le web
INTRODUCTION
‣ Emergence d’une profession
‣ Eléments du design d’information
‣ Eléments de l’expérience utilisateur

7.
Design d’information pour le web
1. Introduction / Emergence d’une profession
‣ Emergence d’une profession
‣ Contributeurs
‣ Profils

8.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Contributeurs
* Les sciences cognitives regroupent un ensemble
de disciplines scientifiques dédiées à l'étude et la
compréhension des mécanismes de la pensée
humaine, animale ou artificielle, et plus
généralement de tout système cognitif, c'est-à-
dire tout système complexe de traitement de
l'information capable d'acquérir, conserver,
et transmettre des connaissances.
Avec les sciences cognitives* qui établissent les fondamentaux...

9.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Contributeurs
...des recherches appliquées dans de multiples domaines...
Design Représentation Design de Communication Typographie et
d’interface de données matériel éducatif visuelle design graphique
Avec les sciences cognitives* qui établissent les fondamentaux...

10.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Contributeurs
...et des professionnels qui pratiquent en fonction d’intérêts variés...
Rédacteurs
Analystes et
de manuels Chercheurs Designers Vulgariseurs Collectionneurs Inventeurs Documentalistes
systémistes
d’instruction
...des recherches appliquées dans de multiples domaines...
Design Représentation Design de Communication Typographie et
d’interface de données matériel éducatif visuelle design graphique
Avec les sciences cognitives* qui établissent les fondamentaux...

11.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Contributeurs Tiré de : “Information Design”, Robert Jacobson, MIT Press
...une nouvelle profession émerge :
LE DESIGN D’INFORMATION
...et des professionnels qui pratiquent en fonction d’intérêts variés...
Rédacteurs
Analystes et
de manuels Chercheurs Designers Vulgariseurs Collectionneurs Inventeurs Documentalistes
systémistes
d’instruction
...des recherches appliquées dans de multiples domaines...
Design Représentation Design de Communication Typographie et
d’interface de données matériel éducatif visuelle design graphique
Avec les sciences cognitives* qui établissent les fondamentaux...

12.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils
Management
de l’information
Organisation
Stratégie
Séquençage
Standardisation

13.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils
Management
de l’information
Organisation
Stratégie
Séquençage
Standardisation
Technologies
Publication
Formats
Portage
Systèmes
d’information

14.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils
Management Visualisation
de l’information de l’information
Organisation Intégration
Stratégie Design
Séquençage Rédaction
Standardisation Résolution de conflits
Technologies
Publication
Formats
Portage
Systèmes
d’information

15.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils Inspiré par : http://informationr.net
Management Visualisation
de l’information de l’information
Organisation Intégration
Stratégie Design
Séquençage Rédaction
Standardisation Résolution de conflits
Technologies
Publication
Formats
Portage
Systèmes
d’information

16.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils
Management PROFIL EN T Visualisation
de l’information de l’information
Systèmes
d’information

17.
Design d’information pour le web
1. Introduction / Emergence d’une profession
Profils
PROFILS EN T
Management Visualisation Systèmes Visualisation Management Systèmes
de l’information de l’information d’information de l’information de l’information d’information
Systèmes Management Visualisation
d’information de l’information de l’information

18.
Design d’information pour le web
1. Introduction / Eléments du design d’information
‣ Eléments du design d’information
“Information design is the defining, planning, and
shaping of the contents of a message and the
environments it is presented in with the intention of
achieving particular objectives in relation to the
needs of users.”
International Institute for Information Design
http://www.iiid.net/Definitions.htm

19.
Design d’information pour le web
1. Introduction / Eléments du design d’information
‣ Eléments du design d’information
‣ Visualisation de données
‣ Visualisation d’information
‣ Visualisation de concept
‣ Visualisation de stratégie
‣ Visualisation métaphorique
‣ Visualisation composée

20.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation de données
Représentation visuelle de données quantitatives sous forme schématique
Histogram chart
Pie chart Table chart + Pie Chart

21.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation d’information
Utilisation d’une représentation interactive de données pour augmenter la cognition.
Network data map Interactive map

22.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation de concept
Elaboration de concepts qualitatifs, d’idées, de plans d’actions et d’analyses.
Concept Map
Gant Chart

23.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation de strategie
Utilisation de représentation visuel dans l’analyse, le développement, la formulation, la communication de
strategie au sein d’une organisation.
Decision discovery diagram
Life Cycle diagram Strategic map

24.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation métaphorique
Utilisation de métaphores visuelles pour véhiculer une vision à partir de la représentation d’information.

25.
Design d’information pour le web
1. Introduction / Eléments du design d’information
Visualisation composée
Composition de différents types de représentations au sein
d’un même schéma.
Graphic facilitation
Cartoon

26.
Design d’information pour le web
1. Introduction / Eléments de l’expérience utilisateur
‣ Eléments de l’expérience utilisateur
The Elements of User Experience
http://www.jjg.net/elements/

27.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

28.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

29.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

30.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

31.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

32.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett http://www.jjg.net/ia/

33.
A basic duality: The Web was originally conceived as a hypertextual information space; 30 March 2000
but the development of increasingly sophisticated front- and back-end technologies has
Design d’information pour le web
fostered its use as a remote software interface. This dual nature has led to much confusion,
as user experience practitioners have attempted to adapt their terminology to cases beyond
the scope of its original application. The goal of this document is to define some of these
terms within their appropriate contexts, and to clarify the underlying relationships among
1. Introduction / Eléments de l’expérience utilisateur
these various elements.
Web as software interface Concrete Completion Web as hypertext system
Visual Design: visual treatment of text,
Visual Design: graphic treatment of interface
elements (the "look" in "look-and-feel") Visual Design graphic page elements and navigational
components
Interface Design: as in traditional HCI: Navigation Design: design of interface
design of interface elements to facilitate elements to facilitate the user's movement
user interaction with functionality
Interface Design Navigation Design through the information architecture
Information Design: in the Tuftean sense:
designing the presentation of information Information Design Information Design: in the Tuftean sense:
designing the presentation of information
to facilitate understanding to facilitate understanding
Interaction Design: development of Interaction Information Information Architecture: structural design
time
application flows to facilitate user tasks,
defining how the user interacts with
Design Architecture of the information space to facilitate
intuitive access to content
site functionality
Functional Specifications: "feature set":
detailed descriptions of functionality the site
Functional Content Content Requirements: definition of
content elements required in the site
must include in order to meet user needs Specifications Requirements in order to meet user needs
User Needs: externally derived goals User Needs: externally derived goals
for the site; identified through user research,
ethno/techno/psychographics, etc. User Needs for the site; identified through user research,
ethno/techno/psychographics, etc.
Site Objectives: business, creative, or other
internally derived goals for the site Site Objectives Site Objectives: business, creative, or other
internally derived goals for the site
task-oriented Abstract Conception information-oriented
This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)
that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a
user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.
© 2000 Jesse James Garrett
périmètre du cours http://www.jjg.net/ia/

34.
Design d’information pour le web
4 CHAMPS DE CONCEPTION
‣ préambule : contexte métier
‣ Conception stratégique
‣ Design fonctionnel
‣ Structuration de l’information
‣ Spécification logique

35.
Design d’information pour le web
2. 4 axes de conception / Préambule
‣ Préambule : Contexte métier

36.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Documentation Conception
Stratégique

37.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Documentation Conception
Etudes
stratégiques
Stratégique

38.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Documentation Conception
Conception
stratégique
Etudes
stratégiques
Stratégique

39.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Design
fonctionnel
Documentation Conception
Conception
stratégique
Etudes
stratégiques
Stratégique

40.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Structuration
de
l’information
Design
fonctionnel
Documentation Conception
Conception
stratégique
Etudes
stratégiques
Stratégique

41.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Structuration
de
l’information
Design
fonctionnel
Spécification
logique
Documentation Conception
Conception
stratégique
Etudes
stratégiques
Stratégique

42.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Structuration
de
l’information
Design
fonctionnel
Spécification
logique
Documentation Conception
Analyses Conception
statistiques stratégique
Etudes
stratégiques
Stratégique

43.
Design d’information pour le web
2. 4 axes de conception / Préambule
Tactique
Structuration
de
l’information
Design
fonctionnel
Spécification
logique
Documentation Conception
Analyses Conception
statistiques Stratégique
Etudes
stratégiques
Stratégique

44.
Design d’information pour le web
2. 4 axes de conception / Préambule
Structuration Design Spécification
Conception
de fonctionnel logique
Stratégique
l’information

45.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique
‣ Conception stratégique
‣ Exploration conceptuelle
‣ Définition du contexte, des besoins, des moyens

46.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique
Mind map
✓ Initier la réflexion
✓ Dépasser les limites du projet
“A mind map is a diagram used to represent words, ideas, tasks, or other items linked to and
arranged radially around a central key word or idea. Mind maps are used to generate, visualize,
structure, and classify ideas, and as an aid in study, organization, problem solving, decision making,
and writing.”
http://en.wikipedia.org/wiki/Mind_Map

47.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Mindmap

48.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Mindmap
Ressources
Commandes
Online training
Cahiers d e tendances Previews
Libres blancs
Peclers "Connect" Etudes d e c a s
Articles
Accès conférences fiches
p a r thématiques
Conférences Objets
Evènements Couleurs
Petits-déjeuners Conseil p a r format
Publications
Sons / ambiance
Training / séminaires Extension d e s cahiers
p a r saison
Photos / diapo rama
Accompagnement s ur fiches
missions inspirations
Coaching
PECLERS
Blog "current brieffing"
Ecoles d e design et mod e
Newsletter
Network étudiants Mentoring Veille interactive
Podcasts
Laboratoire participatif
Trend L a b 2.0
Devenez correspondant
("Trend watcher")
Veille
cf. Energie L a b
Etudes
Cahiers sociétaux
Processus d e conception p a r cible
Analyses
p a r marchés
Design
interviews portraits
Métier
Equipe
Index p a r thèmes
Accessibilité
spécialités p a r mot-clés
Référencement Recherche thématique
Visibilité indexation d e s cahiers d e
Périodicité d e s contenus tendance
Missions
Diffusion Questionnaire créatif
testimonials

49.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Mindmap

50.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Mindmap

51.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique
Framework
✓ Définir le périmètre de l’expérience utilisateur
✓ Servir de lguide à la conception des fonctions

52.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

53.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework
Extimate
What I do
Who I meet
Where I go
Who I am
Intimate
1
My account
My profile
My avatar
2
My bedroom
The school
Adventure places
3
Members
Friends
4
Edutainment modules
Media
Games

54.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Cas Peclers Paris
Cas : AFII

55.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework
Information &
documentation
Mise en Intégration
relation réseaux

56.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

57.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

58.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

59.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

60.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Framework

61.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Cas Peclers Paris
Cas : Michelin

62.
SMART
USER DRIVERS MICHELIN
NETWORK

63.
INDIVIDUAL
PERSONAL PREFERENCES
EQUIPMENT
USER ENVIRONMENT
MICHELIN
TRAFFIC
COMMUNITY
COLLECTIVE

64.
INDIVIDUAL
}
PERSONAL PREFERENCES
USER DATA
} EQUIPMENT
ENVIRONMENT
DATA MICHELIN
TRAFFIC
COMMUNITY
COLLECTIVE

65.
My Account Brand website
Brand website
INDIVIDUAL
PERSONAL PREFERENCES
EQUIPMENT
USER MICHELIN
ENVIRONMENT
Dealers input Dealers input
TRAFFIC
COMMUNITY
User AskAsk Michelin,
Michelin,
COLLECTIVE Wikimedia
communities Wikimedia

66.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique
Modèle conceptuel
✓ Définir les besoins et les usages
✓ Définir les moyens
✓ Expliquer, éduquer

67.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Schéma conceptuel

68.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Schéma conceptuel
Plateforme Gifted
2D
post-achat
User concept model
Commande Livraisons
achat Produit
Feedbacks
pré-achat
Conseiller
personnel
Ambassadeurs
+ Groupes
Contenus et offres
personnalisées coach
recoit
suit
conseillent des
personnalise nouveautés peut renvoyer
Boutiques en ligne
Interface donne
customisée reçoit 2D
personnalise
crée
Gifted User browse, achète, Wishlist
Profil personnalise des produits
crée
Magazine crée
en ligne consulte Garde ajout de
organise produits
robe
crée 3D
consultent,
conseille essaient
visite partagent
Avatar
Espaces regarde,
virtuelles non- participe
marchands
Gifted Friends
consulte l!avatar
Evénements de ses amis
virtuels
envoie
des cadeaux
conduit à
Service cadeaux
3D
lundi 21 septembre 2009

69.
Design d’information pour le web
2. 4 axes de conception / Conception stratégique / Schéma conceptuel
Mum!s experience concept model I WANT TO TELL OTHERS
I WANT TO PERSONALIZE
I WANT TO KNOW MORE
specific answer
specific answer
My
pregnancy
specific answer calendar
I WANT ANSWERS display My
maternity
display checklist
Growth
display curves My
Brand campaigns Food diary
specific answer understand
Product info understand First time & track
display
Mum Guide get
get practical
advices organized
mum
track & learn
Semantic Calculators
want to have product convert user
search
information understand
convert user understand the what my baby
First time what to feed baby needs
ask questions in natural Mum Guide mum
language IFP mum
My
want quick answers convert user convert user baby!s
mum check
get ideas for what to do growth
with baby curve
IFP
want quick answers get help with
give opinion
daily routine
understand trust products
baby track and Nestlé
Healthy start cherish
want to find best milk activities First
Milk milestones
want to retrieve Baby reader / Quality and organize
find solutions for special comparison album
informations about Translator security inspiration
needs
local maternities and trend
Baby spotting
want recipe ideas
QuickFinder routine save
want to save for Infant
money
handbook money
Maternity finder Formula My baby
handbook
inform
eCoupons
Recipe content Baby
drive to a fidelity program
eLoyalty naming tool
share
delegate
share
inform
share
family, friends