Conference IIM - TLD 28072023.pdf

2
C1
Internal
ChatGPT : Quel impact dans le Design ?
Animé par Tanguy LE DUFF - Lead UX/UI Design @Mega International
Conférence
Vendredi 28 Juillet 2023
9h – 11h

8
C1
Internal
1. Qui suis-je ?
4. “Je suis Designer et j’utilise ChatGPT” :
pourquoi & comment ?
2. ChatGPT & moi | ChatGPT & vous ?
6. Bilan : atouts & limites ?
3. ChatGPT : les fondamentaux
7. Échange : vos questions
A
G
E
N
D
A
5. Les toutes dernières actualités

9
C1
Internal
1. Qui suis-je ?

14
C1
Internal
Depuis septembre 2022 : un nouveau chapitre PRO

15
C1
Internal
Ancienne étudiante de l’IIM
Mastère Interactivité & UX Design
Diplômée en 2022

16
C1
Internal
Lien : https://www.youtube.com/watch?v=SDohT7ILRp0
Lien : https://www.youtube.com/watch?v=SDohT7ILRp0

17
C1
Internal
2. ChatGPT & moi

18
C1
Internal
Novembre 2022 Décembre 2022 Janvier 2023 Février 2023 Mars 2023
Mon niveau
d’intérêt
pour ChatGPT
Le temps
qui passe
Graphe présentant les résultats d’une étude scientifique menée par des experts, basée sur la méthode dite « du doigt mouillé »
(toute ressemblance avec les résultats d’une autre étude scientifique serait totalement fortuite)

19
C1
Internal
Les prémisses d’une belle histoire
1. Infidélité : début novembre 2022, j’utilise une autre IA (105 images générées)

20
C1
Internal
Les prémisses d’une belle histoire
1. Infidélité : début novembre 2022, j’utilise une autre IA (105 images générées)
2. Premiers prompts doux : courant novembre, plusieurs rdvs mais rien de sérieux…
… et enfin le déclic

21
C1
Internal
Un déclic, c’est-à-dire ?
Des posts sur les RS Des meetups Des webinars

22
C1
Internal
Du concret : passage à l’action
🙄 Comment utiliser
ces nouvelles technologies
dans ma pratique
de Designer ?
😰
Mon job de Product Designer
est-il menacé ?

23
C1
Internal
Talk en interne
avec Lead Data Scientist
(public : la R&D)

24
C1
Internal
Meetup chez eXalt
Prise de parole suivie
d’une table ronde
(mars 2023)
Replay : https://youtu.be/K6u1Gjm6n_8

25
C1
Internal
Meetup avec
UX Republic
Conférence
(mai 2023)
Replay : https://www.youtube.com/live/zZk0Yuviuik

26
C1
Internal
Atelier UX Days
25 mai 2023
Cité des Sciences
Lien : https://uxdays.eu/comment-utiliser-lia-dans-mon-metier-dux/
Intelligence Artificielle

27
C1
Internal
2. ChatGPT & vous ?

28
C1
Internal
Sondage !
Pas de panique : rapide & anonyme 3 minutes pour y répondre

29
C1
Internal
Sondage !
Pas de panique : rapide & anonyme 3 minutes pour y répondre
(pas totalement convaincu mais j’essaie…😇)

30
C1
Internal
3. ChatGPT : les fondamentaux

31
C1
Internal
ChatGPT : LE sujet « tendance »
#buzz (?)
Source : Google Trends

32
C1
Internal
ChatGPT : c’est quoi ? (selon un expert du numérique)
- Développé par OpenAI, société spécialisée dans l’IA, ChatGPT est capable d’échanger sous
forme de messages.
- Il répond à vos questions, mais génère également du contenu écrit en réponse à une
commande écrite de texte précis, appelée « prompt » (initialement uniquement en anglais,
mais plusieurs langues maintenant acceptées, dont le français)
- Le nom « ChatGPT » vient de la combinaison des termes « chat » et « GPT », qui signifient
respectivement « conversation » et « modèle de transduction de langage prédictif ».
Cela reflète la capacité de ChatGPT à simuler des conversations humaines de manière
convaincante.
ChatGPT est un outil conversationnel établi à partir d’une
intelligence artificielle (IA).
Source
https://www.numerama.com/sciences/1200230-cest-quoi-chatgpt-on-a-laisse-chatgpt-repondre-a-la-question.html

33
C1
Internal
ChatGPT : c’est quoi ? (selon ChatGPT)

34
C1
Internal
ChatGPT : comment lui “parler” ? (1/2)
Le prompt est l’input fourni au modèle de langage.
Il peut s’agir d’une suite de mots permettant de demander à un modèle
IA comme ChatGPT de produire le résultat désiré pour une tâche spécifique.

35
C1
Internal
Le prompt est l’input fourni au modèle de langage.
Il peut s’agir d’une suite de mots permettant de demander à un modèle
IA comme ChatGPT de produire le résultat désiré pour une tâche spécifique.

36
C1
Internal
Le prompt engineer est un expert spécialisé dans la communication avec les
systèmes d’intelligence artificielle. Et plus particulièrement les chatbots IA basés
sur les larges modèles de langage, comme ChatGPT et Google Bard.
Pour en savoir plus : https://www.lebigdata.fr/generer-meilleurs-prompts-pour-ia

37
C1
Internal
#secret n°1 : faire sauter le verrou ?

38
C1
Internal

39
C1
Internal

40
C1
Internal

41
C1
Internal
#secret n°2 : générer des images ?

42
C1
Internal
#secret n°2 : générer des images ?

44
C1
Internal
- Toi : « Hey, moi aussi j’veux essayer ! » https://www.frandroid.com/culture-
tech/intelligence-artificielle/1735007_comment-
generer-des-images-gratuitement-dans-chatgpt
- Moi : « C’est cadeau »

46
C1
Internal
ChatGPT : quelques chiffres
● Date de lancement ? 30 novembre 2022
ChatGPT (3.5) rendu accessible au grand public par OpenAI
Source : https://nerdynav.com/chatgpt-statistics/
● Nombre d’utilisateurs ?
A dépassé 1 million d'utilisateurs en 5 jours de lancement et établi le record
de la plate-forme à la croissance la plus rapide en gagnant 100 millions
d'utilisateurs en janvier 2023, atteignant 1 milliard de visites rien qu'en février.
● Date de mise à jour ? 14 mars 2023
Lancement de la version GPT 4, plus puissante et rapide

47
C1
Internal
ChatGPT : ça coute combien ? (à OpenAI)
Les coûts que représentent les calculs opérés par ces
modèles d’Intelligence artificielle sont exorbitants.
Source : https://www.01net.com/actualites/chatgpt-pourquoi-les-ia-
generatives-font-exploser-le-cout-des-recherches-sur-le-web.html
Selon John Hennessy, le président
d’Alphabet (la maison mère de Google)
Coût unitaire d’un appel à un
moteur de recherche classique
(1/5ème de centime)
x 10
=
Coût unitaire d’un appel à une
technologie comme ChatGPT

48
C1
Internal
ChatGPT : ça coute combien ? (à l’utilisateur)
OpenAI entend rentabiliser son chatbot en proposant
une offre payante : ChatGPT Plus.
Ce service offre :
- des temps de réponse plus rapides,
- un accès prioritaire pendant les heures de pointe,
- de nouvelles fonctionnalités
Il intègre la toute dernière version de l'IA GPT-4.

49
C1
Internal
ChatGPT : le coût environnemental ? (1/2)
En tant qu’intelligence artificielle (IA), ChatGPT n’a pas d’empreinte
carbone directe.
Mais son entraînement et son fonctionnement au quotidien sont
très gourmands en énergie, ce qui génère une empreinte
carbone plus que conséquente.
Il est difficile de quantifier précisément l’empreinte carbone de
ChatGPT car cela dépend du type et de la quantité d’énergie utilisée
pour alimenter les serveurs, ainsi que des pratiques de gestion de
l’énergie mises en place par les fournisseurs de services Cloud.

50
C1
Internal
ChatGPT : le coût environnemental ? (2/2)
Estimations du coût de l’entrainement
L’université de Californie a fait les calculs et estime que l’entraînement seul de l’IA pour GPT-3 a
consommé 1 287 MWh qui ont émis 552 tonnes de CO2e, soit plus de 205 vols aller-retour
entre Paris et New-York.
Estimations du coût du RUN
En ce qui concerne l’exécution de ChatGPT, une étude du média Medium, basée sur des
hypothèses, considère que l’empreinte carbone journalière de ChatGPT est de 23,04 kgCO2e.
Ce qui équivaut à 8,4 tCO2e/an, soit 12 années de consommation de chauffage électrique pour
une maison en France de 110m², selon les données de l’ADEME.
Source : https://www.hellowatt.fr/blog/chat-gpt-empreinte-carbone/

51
C1
Internal
ChatGPT : le coût humain ?
Source : https://time.com/6247678/openai-chatgpt-kenya-workers/
Le succès de ChatGPT ne peut pas être entièrement attribué à l’ingéniosité de la Silicon
Valley. Une enquête de TIME a révélé qu’OpenAI a utilisé les services de travailleurs
kényans externalisés qui gagnent moins de 2 $ par heure pour réduire la toxicité
de ChatGPT.
Le travail effectué par ces travailleurs externalisés était crucial pour OpenAI. GPT-3, le
modèle de ChatGPT, possédait la capacité à composer des phrases efficacement, mais
l’application avait tendance à déverser des déclarations violentes, sexistes et racistes

52
C1
Internal
ChatGPT, ok … et : quid de GPT ?

53
C1
Internal
ChatGPT : le champ des possibles
API
Le mode « API »
https://openai.com/api/
Votre outil GPT-4
(et non ChatGPT)
Prompt
Réponse
Schéma (très) simplifié

54
C1
Internal
Schéma pas du tout simplifié

55
C1
Internal
ChatGPT : les secteurs d’activité “consommateurs”
Source :
https://fr.statista.com/infographie/29259/nombre-
mondial-d-entreprises-et-d-organisations-utilisant-
les-produits-openai-par-secteur-d-activite/

56
C1
Internal
ChatGPT : les métiers (les plus) impactés
Source : https://www.tomsguide.fr/chatgpt-va-t-il-
vous-mettre-au-chomage-voici-le-classement-des-
metiers-concernes-selon-une-etude/

57
C1
Internal
😇 Sans transition …

58
C1
Internal
😇 Sans transition …

59
C1
Internal
4. “Je suis designer & j’utilise ChatGPT” :
pourquoi & comment ?

60
C1
Internal
1. POURQUOI ?
2. COMMENT ?

61
C1
Internal
Postulat (libéral) de départ ?

62
C1
Internal
Postulat (libéral) de départ ?
https://www.nngroup.com/articles/
chatgpt-productivity/

63
C1
Internal
Postulat de départ ?
& Tanguy Le Duff - MEGA International
« Pour un designer ayant pris
le temps d’apprendre à utiliser
ces nouvelles technologies,
dans certains contextes et
pour certaines tâches, … »

64
C1
Internal
En tant que designer, pourquoi utiliser ChatGPT ?
La double réponse
1. Pour (tenter de) gagner en efficacité et en productivité
Court et moyen terme
2. Pour gagner en compétitivité et booster mon employabilité
(VS un autre designer qui ne maitriserait pas ces nouveaux outils)
Moyen et long terme

65
C1
Internal
La double réponse
1. Pour (tenter de) gagner en efficacité et en productivité
Court et moyen terme
2. Pour gagner en compétitivité et booster mon employabilité
(VS un autre designer qui ne maitriserait pas ces nouveaux outils)
Moyen et long terme
« Pour dédier plus de temps aux tâches dans lesquelles
j’exprime mon plein potentiel de Designer (mon cœur de métier) »
« Pour adapter mes pratiques de Designer aux changements
technologiques et sociétaux (apprendre, découvrir, tester, évoluer…) »

66
C1
Internal
La suite de la discussion
Je compte sur vous pour compléter
cette 1ère réponse avec vos avis
pendant la session de Q/R à la fin

67
C1
Internal
La réponse plus simple et directe
Simplement parce que je
suis quelqu’un de curieux...
… et un peu geek dans
l’âme, avouons-le …
… comme ce chat … comme ce chat

68
C1
Internal
2. COMMENT ?
1. POURQUOI ?

69
C1
Internal
2. COMMENT ?
Mode « direct »
via un prompt sur l’interface
conversationnelle
Mode « indirect »
via une API ou un plugin FIGMA

70
C1
Internal
2 - Prompts pour sensibiliser les non-Designers (acculturation)
ou générer des anti-sèches si je suis étudiant ou Junior dans le Design
Mode « direct » via un prompt sur l’interface conversationnelle
1 - Prompts génériques, utiles à tous les métiers (y compris dans le Design)
4 - Prompts pour les UX Designers
5 - Prompts pour les UX Writers et/ou Content Designers
6 - Prompts pour les UI Designers
7 - Prompts pour la veille UX/UI
8 - Prompts pour l’orientation des personnes intéressées par l’UX
3 - Prompts pour les UX Researchers / UX Designers
Pour la phase de « discovery » et les premières réflexions en conception

72
C1
Internal
1.1 | Pour en apprendre plus sur un
secteur ou un domaine d’activités
que vous ne connaissez pas
MODE
DIRECT 1 - Prompts génériques, utiles à tous les métiers (y compris dans le Design)

74
C1
Internal
1.2 | Pour en apprendre plus
sur une réglementation ou une
loi qui impacte votre projet
MODE
DIRECT 1 - Prompts génériques, utiles à tous les métiers (y compris dans le Design)

76
C1
Internal
2.1 | Pour expliquer
les termes de l’UX
en générant
un glossaire
MODE
DIRECT 2 - Prompts pour sensibiliser les non-Designers (acculturation)

77
C1
Internal
2.2 | Présenter les bénéfices
de démarche UX Design
pour favoriser l’adoption
du top management
et des autres équipes
(DEV, PO, …)
MODE

78
C1
Internal
2.3 | Pour identifier
les différentes étapes
du design process
MODE

79
C1
Internal
3.1 | Pour obtenir
un résumé suite à
une prise de notes
lors d’une interview
ou d’un test utilisateur
Prompt générique :
« Peux tu résumer en XXX mots maximum le texte suivant :
……………………………………………………………………………………………… »
MODE
DIRECT 3 - Prompts pour les UX Researchers / UX Designers

80
C1
Internal
3.2 | Pour ressortir les
idées principales
d’un corpus suite à
une prise de notes
lors d’une interview
ou d’un test utilisateur
Prompt générique :
« Peux-tu identifier les idées principales du texte suivant :
……………………………………………………………………………………………… »
MODE

81
C1
Internal
3.3 | Pour initier
une réflexion
orientée sur les besoins
MODE

82
C1
Internal
3.4 | Pour initier
une réflexion
orientée sur les user flows
MODE

83
C1
Internal
3.5 | Pour initier
une réflexion
orientée sur les irritants
MODE

84
C1
Internal
3.6 | Comme base de travail
pour créer un (proto) persona
MODE

85
C1
Internal
3.7 | Demander à ChatGPT
de « jouer le rôle »
d’un utilisateur virtuel
MODE

86
C1
Internal
3.8 | Comme base de travail
pour créer une experience map
MODE

87
C1
Internal
4.1 | Pour inspiration
à propos des layouts
MODE
DIRECT

88
C1
Internal
4.2 | Pour prendre du recul
et obtenir un avis
à propos d’une idée
(ex: nouvelle fonctionnalité)
MODE
DIRECT

89
C1
Internal
5.1 | Pour trouver de l’inspiration
(ex : messages d’erreur)
MODE
DIRECT

90
C1
Internal
5.2 | Obtenir rapidement
un 1er niveau de traduction
MODE
DIRECT

91
C1
Internal
5.3 | Pour initier un wording
(et éviter du « lorem ipsum »)
dans un contexte précis
MODE
DIRECT

92
C1
Internal
6.1 | Pour
documenter
un composant
du design system
MODE
DIRECT

93
C1
Internal
MODE
DIRECT
6 - Prompts pour les UI Designers 6.1 | Pour documenter un composant du design system
Source :
https://www.linkedin.com/post
s/aryan09_openai-design-ux-
activity-703302080566448128-
S6zS

94
C1
Internal

95
C1
Internal

96
C1
Internal
Pour documenter
un composant
du design system
MODE
DIRECT

97
C1
Internal
des éléments UI
de réassurance
MODE
DIRECT

98
C1
Internal
6.3 | Pour intégrer
des dark patterns
dans un design
MODE
DIRECT
6 - Prompts pour les UI Designers du dark side

99
C1
Internal
des sites d’inspiration
en UI Design
MODE
DIRECT 7 - Prompts pour la veille UX/UI

10
0
C1
Internal
7.2 | Pour identifier des
livres sur l’UX Design
MODE
DIRECT 7 - Prompts pour la veille UX/UI

10
1
C1
Internal
8.1 | Quelles études
ou quel parcours
pour apprendre l’UX ?
MODE
DIRECT 8 - Prompts pour l’orientation des personnes intéressées par l’UX

10
2
C1
Internal
1) List design and research methods to help [challenge].
2) What’s the best way to design a solution to this brief: [insert brief].
3) Write a brief for [challenge].
4) Brainstorm design ideas around [opportunity].
5) Create wireframes for an [industry] experience for [user].
6) Create an SVG icon for [your client].
7) Write code for a [your project].
8) Write survey questions about [context] for a [user].
9) Write user tasks for a usability test on a [your project].
10) Act as a UX designer. Here is my first question: “[insert question]”.
11) Create study notes on this: [insert text]
12) What are the main user issues with [well-known product]
13) Summarize the problems in these interviews: [insert transcript].
14) Synthesize this text into a new design approach: [insert text].
15) Uncover potential user biases in [context].
MODE
DIRECT Et bien d’autres prompts encore !
(la seule limite, c’est votre imagination…)

10
3
C1
Internal
MODE
DIRECT « Le monde du partage devra remplacer le partage du monde » (Claude Lelouch)
https://mixolydian-timer-
72d.notion.site/492141307e3b4b4b83633aaa168fb
993?v=2616bd8c76f04629a4b828d3b94362e1

10
4
C1
Internal
L’UX Design est mort.
Vive le Prompt Engineering !!
Inspiration : https://www.linkedin.com/posts/yanickjimenez_designcareer-promptengineering-designers-activity-7054800909918171137-rs58/
Bilan : que nous réservera le futur ?
Théorie n°1 : le remplacement
MODE
DIRECT

10
5
C1
Internal Bilan : que nous réservera le futur ?
Théorie n°2 : l’assistant
Un article qui décrit avec justesse
les limites et les pièges de
l’utilisation de ChatGPT en
UX Research
MODE
DIRECT
Source : https://uxdesign.cc/chatgpt-cannot-do-user-research-1c5a34c35abf

10
6
C1
Internal
Source : https://uxdesign.cc/chatgpt-cannot-do-user-research-1c5a34c35abf
Bilan : que nous réservera le futur ?
Théorie n°2 : l’assistant
Un article qui décrit avec justesse
les limites et les pièges de
l’utilisation de ChatGPT en
UX Research
MODE
DIRECT

10
7
C1
Internal
2. COMMENT ?
Mode « direct »
conversationnelle
Mode « indirect »

10
8
C1
Internal
API
Via une API
Vous avez dit « API » ?
https://openai.com/api/
Votre outil GPT-4
(et non ChatGPT)
Prompt
Réponse
MODE
INDIRECT

10
9
C1
Internal
API GPT intégrée dans une feuille Google Sheet
Testé : c’était fonctionnel !
… mais maintenant, il faut payer
Via une API
MODE
INDIRECT

11
0
C1
Internal
Mes idées d’intégration dans Google Sheet
Métier Description 3 principaux
jobs to-be-done
Persona UX
(motivation, irritants…)
job1
job2
job3
job4
job5
💡Pour en apprendre plus sur le métier de mes utilisateurs
💡Pour initier rapidement une liste de proto-persona (base de discussion avec les PO)
Via une API
MODE
INDIRECT

11
1
C1
Internal
Mes idées d’intégration dans Google Sheet
Texte à
retravailler
Traduction Formulation inclusive Reformulation FALC
texte1
texte2
texte3
texte4
texte5
💡 Pour traduire un texte, le reformuler de façon plus inclusive ou en FALC
FALC : le Facile A Lire et à Comprendre
https://www.culture.gouv.fr/Thematiques/Developpement-culturel/Culture-et-handicap/Facile-a-lire-et-a-comprendre-FALC-une-methode-utile
Via une API
MODE
INDIRECT
FALC & ChatGPT : un intérêt à nuancer ?
https://com-access.fr/intelligence-artificielle-pour-la-redaction-en-falc/

11
2
C1
Internal
1/ Plugin QoQo ❤️
Via un Plugin FIGMA
MODE
INDIRECT

11
3
C1
Internal
Un bon premier set de fonctionnalités
orientées UX et non UI
Discover
• Product brief
• User interview
Define
• Persona
• User journey mapping
Design
• UX copywriting
• Design checklist
Une équipe accessible
et ouverte aux feedbacks
https://www.figma.com/community/plugin/1189158575928509194/QoQo
Via un Plugin FIGMA
MODE
INDIRECT

11
4
C1
Internal
Exemple de génération de persona
(ancienne version du plugin)
Via un Plugin FIGMA
MODE
INDIRECT

11
5
C1
Internal
(version actuelle du plugin : cf. tutoriel https://youtu.be/rujy8TKrfYU)
Via un Plugin FIGMA
MODE
INDIRECT

11
6
C1
Internal
(version actuelle du plugin : cf. tutoriel https://youtu.be/rujy8TKrfYU)
Via un Plugin FIGMA
MODE
INDIRECT

11
7
C1
Internal
Le prix
Via un Plugin FIGMA
MODE
INDIRECT
Mon avis
+ un plugin à la fois utile (sur le périmètre UX) et
bien réalisé (pas de bugs, temps de réponse OK)
+ une approche incrémentale en amélioration
continue : des ajouts de fonctionnalités et des
améliorations apportées de façon régulière
➢ Si vous comptez utiliser l’IA dans votre pratique,
un bon investissement !
➢ Prévoir un REX dans 1 an ?

11
8
C1
Internal
2/ Plugin PROMPT2FIGMA
https://www.prompt2design.io/
La promesse
Ask anything with human language, the
plugin generate your interface in figma.
Tarif mentionné
9,99/mois
Initiative FR
Cocorico !
Pas encore disponible
Béta ouverte actuellement
Via un Plugin FIGMA
MODE
INDIRECT

11
9
C1
Internal
2/ Plugin PROMPT2FIGMA : la vidéo de présentation
Via un Plugin FIGMA
MODE
INDIRECT
Source : https://www.youtube.com/@prompt2figma409

12
0
C1
Internal
2/ Plugin PROMPT2FIGMA : la démo officielle !
Via un Plugin FIGMA
MODE
INDIRECT
Source : https://www.youtube.com/watch?v=4Gt1NMfVlGQ

12
1
C1
Internal
2/ Plugin PROMPT2FIGMA : bilan de mes tests
Via un Plugin FIGMA
MODE
INDIRECT
Avec un regard bienveillant car il s’agit d’une béta
Fonctionnement assez
opérationnel sur le périmètre
annoncé sur le site

12
2
C1
Internal
Projet très prometteur de Diagram, mais pas encore disponible
https://diagram.com/account
Lien pour rejoindre la Waitlist
3/ Plugin GENIUS 🤖
Via un Plugin FIGMA
MODE
INDIRECT

12
3
C1
Internal
La promesse !
Un pas de plus de franchi dans les Design Language Systems
avec Diagram de Jordan Singer qui lance Genius, un « Ai » assistant
qui vous accompagne dans la création d’interface, directement
dans Figma en suggérant des composants de votre DLS !
Via un Plugin FIGMA
MODE
INDIRECT

12
4
C1
Internal
Mode « indirect » via une API ou un plugin FIGMA
Source : https://youtu.be/oiTt3dEUVp4

12
5
C1
Internal
Exemple
d’utilisation de
Genius dans
Figma
Version
« work in
progress »
Via un Plugin FIGMA
MODE
INDIRECT

12
6
C1
Internal
4/ Plugin GALILEO AI
https://www.usegalileo.ai/
La promesse
Galileo AI creates delightful, editable UI
designs from a simple text description.
It empowers you to design faster than
ever.
Pas encore disponible
Inscription à la waitlist :
https://airtable.com/shrJeO0kB53yJoAqE
Via un Plugin FIGMA
MODE
INDIRECT

12
7
C1
Internal
5/ Plugin MAGICIAN
https://www.figma.com/community/
plugin/1151890004010191690/Magician
La promesse
Cast Magic Spells
Each magic spell works
alongside you to expand your
creativity and imagination as
you design.
Includes:
• Magic Icon – Text to AI-generated vector icon
• Magic Copy – Generate AI-suggested copy
• Magic Image – Text to AI-generated image
• More spells coming soon
Via un Plugin FIGMA
MODE
INDIRECT

12
8
C1
Internal
5/ Plugin MAGICIAN
https://www.figma.com/community/
plugin/1151890004010191690/Magician
Les tarifs !
(la magie n’est
pas gratuite)
Via un Plugin FIGMA
MODE
INDIRECT

12
9
C1
Internal
6/ Plugin ATTENTION INSIGHT
https://www.figma.com/community/plugin
/968765016617421513/Attention-Insight
La promesse
Découvrez les performances de vos
conceptions avant même de les
développer !
L'intelligence artificielle prédit
instantanément comment les utilisateurs
réagiront en découvrant vos designs en
générant des cartes de chaleur.
Via un Plugin FIGMA
MODE
INDIRECT

13
0
C1
Internal
Via un Plugin FIGMA
MODE
INDIRECT
Source : https://www.youtube.com/watch?v=s50HvJ3JciA

13
1
C1
Internal
Via un Plugin FIGMA
MODE
INDIRECT

13
2
C1
Internal
Et bien d’autres plugins
Article à lire !
• https://bootcamp.uxdesign.cc/7-ai-based-figma-plugins-that-i-use-as-a-product-designer-8b1c645435cb
Via un Plugin FIGMA
MODE
INDIRECT

13
3
C1
Internal
Et bien d’autres plugins
https://www.figma.com/community/plugin/1145446664512862540/Ando---AI-Copilot-for-Designers
Via un Plugin FIGMA
MODE
INDIRECT

13
4
C1
Internal
MODE
INDIRECT « Le monde du partage devra remplacer le partage du monde » (Claude Lelouch)
993?v=2616bd8c76f04629a4b828d3b94362e1

13
5
C1
Internal
2. COMMENT ?
Mode « direct »
conversationnelle
Mode « indirect »

13
6
C1
Internal
2. COMMENT ?
Mode « direct »
conversationnelle
Mode « indirect »
EXEMPLE CONCRET : CAS D’UTILISATION SUR UN PROJET UX

13
7
C1
Internal
Inspiration / Partage
EXEMPLE CONCRET : Cas d’utilisation sur un projet UX
Lien : https://uxdays.eu/comment-utiliser-lia-dans-mon-metier-dux/
Atelier UX Days

13
8
C1
Internal
Brief : concevoir une application mobile pour faciliter l’organisation
de vacances d’une famille en transports en commun

13
9
C1
Internal
Synthèse des cas d’application de ChatGPT
adressés au fil de l’avancement du projet
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

14
0
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Votre objectif : Etoffer vos connaissances sur le sujet
- Existe-t-il des solutions concurrentes sur le marché ? Lesquelles ?
- Quels sont les points forts et les faiblesses de ces solutions ?
- Quels sont les avis des utilisateurs de ces solutions ?
- Imaginer des Proto-Personae, avec leurs besoins, leurs motivations,
leurs problèmes et difficultés, leurs préférences, leurs comportements…
Concrètement, comment faire ?
- Il est important de permettre à ChatGPT de connaitre le
contexte de votre projet
- Dit autrement, on ne pose pas les questions directement à
ChatGPT, la 1ère étape consiste à « alimenter » l’outil
STEP 1

14
1
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
https://miro.com/app/board/uXjVMA1
bxOw=/?share_link_id=523473687
STEP 1

14
2
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
STEP 1

14
3
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
STEP 1

14
4
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
STEP 1

14
5
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

14
6
C1
Internal
Préparer …
un entretien, un
test, un
questionnaire
STEP 2
Vos objectifs :
1) Rédiger un guide d’entretien avec l’aide de ChatGPT
2) Tester le guide d’entretien avec ChatGPT en lui demandant
de jouer le rôle d’un utilisateur fictif (commande « agis comme… »)
Exemple de prompt
pour objectif 1 :
rédiger un guide
d’entretien avec
l’aide de ChatGPT

14
7
C1
Internal
Préparer …
un entretien, un
test, un
questionnaire
STEP 2
Vos objectifs :
1) Rédiger un guide d’entretien avec l’aide de ChatGPT
2) Tester le guide d’entretien avec ChatGPT en lui demandant
de jouer le rôle d’un utilisateur fictif (commande « agis comme… »)
Exemple de prompt pour
objectif 2 : ChatGPT joue le
rôle d’un utilisateur fictif
pour tester votre guide
d’entretien

14
8
C1
Internal
Préparer …
un entretien, un
test, un
questionnaire
STEP 2

14
9
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

15
0
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur
Votre objectif :
- Suite à des vos entretiens avec un panel représentatif d’utilisateurs,
vous souhaitez analyser ces entretiens avec l’aide de ChatGPT
- En particulier, ChatGPT peut vous servir à :
▪ produire un résumé de l’ensemble des entretiens,
▪ identifier les 5 thèmes principaux abordées lors des entretiens,
▪ classifier les thèmes et sous-thèmes,
▪ générer une représentation visuelle (par ex : mind mapping)
résumant les thèmes et tous-thèmes abordés en entretiens

15
1
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur
Comment faire ?
- Dans l’exemple, on imagine que l’équipe Research
a centralisé les résultats des entretiens dans un board Miro

15
2
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur
Comment faire ?
- Dans l’exemple, on imagine que l’équipe Research
a centralisé les résultats des entretiens dans un board Miro

15
3
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur

15
4
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur Comment faire ?
Utiliser la plateforme « draw.io »
(éditeur de diagrammes, gratuit)

15
5
C1
Internal
STEP 3
Traiter et
analyser …
des
informations en
recherche
utilisateur
Exemple de résultat
obtenu avec :

15
6
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts,
pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

15
7
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Votre objectif n°1
- Découvrir et s’inspirer de l’UI d’autres solutions
numériques existantes avec l’aide de ChatGPT

15
8
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Votre objectif n°1
- Découvrir et s’inspirer de l’UI d’autres solutions
numériques existantes avec l’aide de ChatGPT

15
9
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Votre objectif n°2
- Générer des idées pour le layout et les
composants à intégrer dans l’interface

16
0
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Possible d’avoir des réponses plus fines, par persona

16
1
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Votre objectif n°3
- Dessiner l’interface en s’inspirant
du layout proposé par ChatGPT

16
2
C1
Internal
STEP 4
Idéation
pour la
conception
(features,
layouts, pages…)
Votre objectif n°4
- Utiliser la plateforme Uizard.io pour générer
une maquette + réaliste à partir du dessin

16
3
C1
Internal
Exemple d’utilisation de https://app.uizard.io/

16
4
C1
Internal

16
5
C1
Internal

16
6
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien, un
test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

16
7
C1
Internal
STEP 5
Créer du
contenu …
Fini le lorem
ipsum
Votre objectif n°1
- Trouver le nom de
l’application mobile
avec l’aide de ChatGPT

16
8
C1
Internal
STEP 5
Créer du
contenu …
Fini le lorem
ipsum
Votre objectif n°2
- Chercher des idées de
contenus et de wording
avec ChatGPT

16
9
C1
Internal
STEP 5
Créer du
contenu …
Fini le lorem
ipsum
Votre objectif n°3
- Traduire les contenus
avec ChatGPT

17
0
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien, un
test, un
questionnaire
Traiter et
analyser …
des
informations en
recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
VOTRE PROJET UX

17
1
C1
Internal
STEP 6
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
Plugin
ATTENTION
INSIGHT
https://www.figma.com/com
munity/plugin/968765016617
421513/Attention-Insight
Votre objectif :
- Tester vos maquettes avec une pré-analyse basée sur l’IA
(pour simuler la réaction de vos utilisateurs, en particulier
les 5 premières secondes de scan et de découverte des écrans)

17
2
C1
Internal
STEP 6
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
Point d’attention
- Il s’agit bien d’une pré-analyse basée sur l’IA
- Il est judicieux de ne pas baser toute sa recherche sur l’IA
et de compléter le dispositif de test avec un travail réalisé
par un expert humain (UX Researcher)

17
3
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations
en recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
BILAN
VOTRE PROJET UX

17
4
C1
Internal
Enquête
Exploratoire
(concurrents,
Proto-
personae,…)
Préparer …
un entretien,
un test, un
questionnaire
Traiter et
analyser …
des
informations
en recherche
utilisateur
Idéation
pour la
conception
(features,
layouts, pages…)
Créer du
contenu …
Fini le lorem
ipsum
Analyser …
un écran
(une maquette
Figma)
avec l’eye
tracking
BILAN
CHAT GPT = un ASSISTANT UTILE
VOTRE PROJET UX

17
5
C1
Internal
D’autant plus utile pour adresser
des questions importantes et
répondre aux enjeux éthiques
▶ Protection de la vie privée
▶ Équité & non-discrimination
▶ Accessibilité
▶ Durabilité & tourisme responsable
▶ Transparence & intégrité
▶ Responsabilité sociale

17
6
C1
Internal
6. Bilan : atouts & limites ?

17
7
C1
Internal
Avis
L’IA, telle qu’elle existe aujourd’hui, ne remplace pas le designer🔥

17
8
C1
Internal
Avis
L’IA, telle qu’elle existe aujourd’hui, ne remplace pas le designer🔥

17
9
C1
Internal
Principal atout 🚀
L’IA peut être un assistant utile et efficace, dans la réalisation de certaines
tâches UX/UI et donc aider le designer
- pour les différentes casquettes : Researcher, Designer, Writer…
- à différents moments du projet
- de façon fluide et intégrée (ex: plugins Figma)

18
0
C1
Internal
Principale limitation ⚠️
Au cœur du Design, se trouve l’humain
(dans toute sa complexité)

18
1
C1
Internal
https://www.nngroup.com/articles/ux-without-user-research/

18
2
C1
Internal
Autres limitations
Il se base sur des données datant de 2021.
Il ne se base que sur des sources disponibles sur internet.
Il génère parfois des réponses grammaticalement correctes, mais dénuées de sens.
Il ne cite pas ses sources.
… et il a été entrainé avec un prisme très « américano-centré »
😇 Ce n’est pas
moi qui le dit !

18
3
C1
Internal
Faire sauter le verrou !
En utilisant un moyen de
contournement officieux
En utilisant une feature officielle

18
4
C1
Internal
6. Dernières actualités

18
5
C1
Internal
Événement : juin 2023

18
6
C1
Internal
Événement : juin 2023 https://www.figma.com/fr/whats-new/

18
7
C1
Internal
Plein de belles annonces …

18
8
C1
Internal
… qui ont généré de vives réactions dans la communauté … #hype

18
9
C1
Internal
… quand soudain !!

19
0
C1
Internal
Des annonces sur l’IA

19
1
C1
Internal
Des annonces sur l’IA

19
2
C1
Internal
FIGMA x DIAGRAM
Source : https://www.figma.com/fr/blog/ai-the-next-chapter-in-design/

19
3
C1
Internal
FIGMA x DIAGRAM

19
4
C1
Internal
FIGMA x DIAGRAM

19
5
C1
Internal
FIGMA x DIAGRAM : illustré en vidéo
1) AI could help summarize ideas...

19
6
C1
Internal
2) AI could surface design recommendations

19
7
C1
Internal
3) AI could generate production-ready code for build.

19
8
C1
Internal
FIGMA x DIAGRAM : mon avis

19
9
C1
Internal
LE MOT DE LA FIN
Projection : les next steps

20
0
C1
Internal
VOUS
A très court terme : me poser des questions sur cette conférence
A court terme :
- poser des questions à ChatGPT
- tester des plugins FIGMA basés sur l’IA
- visiter ma page NOTION dans laquelle je vous partage le contenu
A moyen terme : intégrer (ou pas) ChatGPT dans votre pratique de Designer
A long terme : devenir « prompt designer » ? 😉

20
1
C1
Internal
PROMPT DESIGNER ?
+ jetez aussi un œil à : https://www.promptdesigner.fr/
https://formations.nolimits-inc.com/prompt-designer
https://www.producthunt.com/products/prompt-designer

20
2
C1
Internal
Keep in touch
https://www.linkedin.com/in/tanguyleduff/
tanguy.leduff@gmail.com
tanguyleduff.fr

Conference IIM - TLD 28072023.pdf

Recommandé

Recommandé

Contenu connexe

Similaire à Conference IIM - TLD 28072023.pdf

Similaire à Conference IIM - TLD 28072023.pdf (20)

Conference IIM - TLD 28072023.pdf