Nous étions les invités de l'incubateur Pulsalys le mardi 11 mai 2021 pour animer un atelier autour de la communication digitale et de l'innovation. Pulsalys est un incubateur d'innovations Deep Tech créé en 2013 dont les projets d'entreprise sont principalement issus de découvertes scientifiques des laboratoires de l’Université de Lyon.
Nous avons partagé pendant cette séance les meilleures pratiques pour présenter une innovation au travers d'une expérience web, du concept jusqu'à sa conversion en produits ou services.
2011 03 07 Convaincre et fidéliser la clientèle en optimisant son site web - ...
Atelier startup « communiquer sur son innovation Deep Tech pour mieux convaincre »
1. Vulgariser un concept scien
ti
fi
que,
convaincre inves
ti
sseurs & prospects
Mai 2021
1
2. SOMMAIRE
• Expérience digitale et concept scien
ti
fi
que : les spéci
fi
cités
• Expérience u
ti
lisateur : facteurs clé de succès
• Clarté du mé
ti
er, clarté du concept
• Contenu & interac
ti
vité
• Iden
ti
té visuelle
• Quelques conseils
3. En quoi un site qui présente une
découverte ou un concept
scientifique est-il différent ?
PRÉSENTATION D’UN CONCEPT SCIENTIFIQUE OU TECHNOLOGIQUE
5. Wri
ti
ng techniques
- Shorten
ti
tles as much as possible.
- Use subsec
ti
ons with clear headings to create structure.
- Provide succinct summaries.
- Remove or layer introductory content.
- Include charts and
fi
gures.
- Don’t overdo the visual design.
NIELSEN NORMAN GROUP : HOW TO PRESENT SCIENTIFIC FINDINGS ONLINE
6. Domain experts reported preferring to
fi
rst scan
scien
ti
fi
c papers, to get a high-level overview of
the content and decide if they need to read it in
detail.
“The way scien
ti
sts read ar
ti
cles, is they read the abstract, look
through the
fi
gures, read the conclusion and the introduc
ti
on, and
then decide if they’ll read the middle. Almost nobody starts by
reading the whole ar
ti
cle. […] Why should I read all of something
that I’m not terribly interested in?” – Research oceanographer
NIELSEN NORMAN GROUP : HOW TO PRESENT SCIENTIFIC FINDINGS ONLINE
7. NIELSEN NORMAN GROUP
CONCISE, SCANNABLE, AND OBJECTIVE: HOW TO WRITE FOR THE WEB
Studies of how users read on the Web found
that they do not actually read: instead, they
scan the text.
A study of
fi
ve di
ff
erent wri
ti
ng styles found that a sample Web
site scored 58% higher in measured usability when it was wri
tt
en
concisely, 47% higher when the text was scannable, and 27%
higher when it was wri
tt
en in an objec
ti
ve style instead of the
promo
ti
onal style used in the control condi
ti
on and many current
Web pages. Combining these three changes into a single site that
was concise, scannable, and objec
ti
ve at the same
ti
me resulted
in 124% higher measured usability.
h
tt
ps://www.nngroup.com/ar
ti
cles/concise-scannable-and-objec
ti
ve-how-to-write-for-the-web/
h
tt
ps://www.math.unipd.it/~massimo/corsi/tecweb2/Eyetrack-III.pdf
11. « Although it is not usually described as such, scien
ti
fi
c wri
ti
ng
tells a story. Within a good paper, conference presenta
ti
on, or grant
applica
ti
on, there are answers to the following ques
ti
ons : What
did you/are you going to do? Why is this important? How did you/
are you going to accomplish it? »
« First and foremost, a pitch is not purely scien
ti
fi
c story. A pitch is
a business story, in which the science plays a suppor
ti
ng role. In
scien
ti
fi
c communica
ti
on, the story is built around a hypothesis of
how something works ».
« The biotech and medtech
fi
elds have huge impacts on human
health, so the emo
ti
onal side of the story is more straightforward
than for many other types of startups. »
4 WAYS TO TRANSLATE SCIENCE COMMUNICATION SKILLS INTO A WINNING PITCH
12. Faire-valoir de l’entreprise, le site
doit être à la hauteur de son
ambition et de la portée de son
innovation.
Le risque : minimiser l’impact.
PRÉSENTATION D’UN CONCEPT SCIENTIFIQUE OU TECHNOLOGIQUE
13. NAWA TECHNOLOGIES Une technologie de rupture dont le site peine à révéler le poten
ti
el.
Nawa Technologies a réussi à lever 13 millions d’euros pour révolu
ti
onner les
ba
tt
eries automobiles.
15. EXPÉRIENCE UTILISATEUR
Clarté du mé
ti
er / raison d’être
Expression claire du mé
ti
er, de la raison d’être
et des valeurs de l’entreprise avec l’inten
ti
on
de le rendre explicite pour le plus grand
nombre.
Architecture & naviga
ti
on
Une architecture de l’informa
ti
on claire, des
contenus structurés pour que vos di
ff
érents
pro
fi
ls de visiteurs circulent vite et sans
entrave au sein des pages qui leur sont
consacrées.
Iden
ti
té visuelle
Ce
tt
e iden
ti
té visuelle doit être durable,
singulière, a
tt
rac
ti
ve, basée sur des choix
inspirés de mise en page et de typographie,
détachée des e
ff
ets de mode qui favorisent
l’obsolescence.
Contenu / interac
ti
vité
Engager l’u
ti
lisateur. Une proposi
ti
on de
contenus d’intérêts, dont le traitement est
adapté à une u
ti
lisa
ti
on / lecture à l’écran.
Expérience mobile
Consultable sur mobile ne signi
fi
e pas adapté
pour le mobile. Avec près de 50% de visiteurs
sur mobile, un travail spéci
fi
que est souvent
nécessaire : quels contenus proposer et pour
quels contextes d’u
ti
lisa
ti
on ?
Choix technologiques
Des technologies sélec
ti
onnées pour leur
agilité et surtout pour le confort qu’elles
procurent aux contributeurs et aux visiteurs.
A
tt
en
ti
on aux temps de chargement, ils sont
désormais intégrés aux scores de qualité
délivrés par les moteurs de recherche
16. EXPÉRIENCE UTILISATEUR
Clarté du mé
ti
er / raison d’être
Expression claire du mé
ti
er, de la raison d’être
et des valeurs de l’entreprise avec l’inten
ti
on
de le rendre explicite pour le plus grand
nombre.
Architecture & naviga
ti
on
Une architecture de l’informa
ti
on claire, des
contenus structurés pour que vos di
ff
érents
pro
fi
ls de visiteurs circulent vite et sans
entrave au sein des pages qui leur sont
consacrées.
Iden
ti
té visuelle
Ce
tt
e iden
ti
té visuelle doit être durable,
singulière, a
tt
rac
ti
ve, basée sur des choix
inspirés de mise en page et de typographie,
détachée des e
ff
ets de mode qui favorisent
l’obsolescence.
Contenu / interac
ti
vité
Engager l’u
ti
lisateur. Une proposi
ti
on de
contenus d’intérêts, dont le traitement est
adapté à une u
ti
lisa
ti
on / lecture à l’écran.
Expérience mobile
Consultable sur mobile ne signi
fi
e pas adapté
pour le mobile. Avec près de 50% de visiteurs
sur mobile, un travail spéci
fi
que est souvent
nécessaire : quels contenus proposer et pour
quels contextes d’u
ti
lisa
ti
on ?
Choix technologiques
Des technologies sélec
ti
onnées pour leur
agilité et surtout pour le confort qu’elles
procurent aux contributeurs et aux visiteurs.
A
tt
en
ti
on aux temps de chargement, ils sont
désormais intégrés aux scores de qualité
délivrés par les moteurs de recherche
17. Clarté du métier :
→ Présenter un concept
scientifique ou technique
avec enjeux et perspectives.
18. Au commencement…
- Dé
fi
nir ses publics cibles : scien
ti
fi
ques, industriels, journalistes,
inves
ti
sseurs, partenaires, ins
ti
tu
ti
onnels, grand public, etc.
- Présenta
ti
on de l’enjeu + expliquer pourquoi on devrait résoudre
cet enjeu;
- Dé
fi
nir le ou les message-s- que votre public doit retenir.
20. Formuler
- Percée ou avancement scien
ti
fi
que;
- Résolu
ti
on d’un enjeu technique, de vitesse, de précision;
- Réfuta
ti
on ou con
fi
rma
ti
on d’une théorie, d’une hypothèse;
- Démen
ti
d’un préjugé;
- Réponse à une interroga
ti
on, à un problème;
- Meilleure compréhension d’un phénomène;
- Applica
ti
ons pra
ti
ques possibles d’une innova
ti
on sociale ou
technologique.
23. Contenu & interactivité :
→ Engager l’utilisateur,
savoir simplifier, faciliter la
projection, illustrer, etc.
24. Une dose de story-telling
- Débuter par une phrase forte.
- Exemples d’amorces : la forme interroga
ti
ve, la mise en contexte,
le lien avec l’actualité, un appel à l’expérience vécue, une
cita
ti
on, etc.;
- Parsemer votre récit d’anecdotes vécues, d’un brin d’humour et
d’émo
ti
on;
- Tirer par
ti
de l’intérêt porté aux dessous d’une découverte.
25. ONWARD ONWARD développe une s
ti
mula
ti
on épidurale ciblée (TESS), implantable pour
des pa
ti
ents sou
ff
rant de lésions médullaires incomplètes.
27. Simpli
fi
er mais pas trop
- Enlever tous les mots et les informa
ti
ons non nécessaires;
- Tricoter les par
ti
es plus complexes avec des informa
ti
ons plus
simples, plus factuelles;
- Amener la complexité par couches successives.
28. Concré
ti
ser, vulgariser
- Donner des exemples concrets : des nombres, des quan
ti
tés,
des coûts, des sta
ti
s
ti
ques, des ordres de grandeur;
- U
ti
liser le moins possible de termes techniques, et si
nécessaire, les expliquer;
- Se servir d’analogies : « Si une toile d’araignée géante était
installée dans un stade de football, elle pourrait arrêter un avion
de ligne en pleine vitesse. »
30. ONWARD ONWARD développe une s
ti
mula
ti
on épidurale ciblée (TESS), implantable pour
des pa
ti
ents sou
ff
rant de lésions médullaires incomplètes.
31. METABOLIC EXPLORER Donner des exemples concrets : des nombres, des quan
ti
tés, des coûts, des
sta
ti
s
ti
ques, des ordres de grandeur.
32. La vulgarisa
ti
on scien
ti
fi
que par
l’a
ffi
che
Ce guide de 77 pages, rédigé par Réjane Gélinas,
rappelle les di
ff
érentes normes de présenta
ti
on
d’une a
ffi
che scien
ti
fi
que en milieu universitaire ou
en entreprise. L’auteure aborde les aspects visuel,
informa
ti
f, rédac
ti
onnel et oral de l’a
ffi
che. Elle
aborde également les fondements de la
vulgarisa
ti
on scien
ti
fi
que et les principes généraux
de la communica
ti
on par a
ffi
che. Une grille
d’évalua
ti
on d’une a
ffi
che scien
ti
fi
que est aussi
proposée.
h
tt
ps://accros.etsmtl.ca/a
ffi
che_scien
ti
fi
que/
guide.pdf
33. Misez sur une iconographie
de qualité, une expérience digitale
est avant tout une expérience
visuelle.
34. Misez sur une iconographie
de qualité, une expérience digitale
est avant tout une expérience
visuelle.
37. 23ANDME Complémentarité e
ffi
cace entre le texte et le visuel.
Illustra
ti
on simpli
fi
ée qui facilite la lecture.
Format approprié aux standards d’une page web.
38. ONWARD La photographie : le meilleur moyen de générer de la ma
ti
ère visuelle. Parfaitement
adapté pour le médical, l’environnement.
39. Tirer profit des possibilités en
matière d’interaction pour inciter
l’utilisateur à explorer.
44. Identité visuelle :
→ Traduction visuelle
et concrète d’un concept
qui peut être abstrait ou
complexe.
45. Merck par Future Brand
‘Vibrant Science and Technology’ was the crea
ti
ve
platform for expression. This came to life by looking
at the ‘in
fi
nite world under the microscope’, as it
was felt to be par
ti
cularly true to the brand.
The vibrant iden
ti
ty was developed to be a brave
departure from the ‘sea of sameness’ Merck were
mired in, and a breakthrough piece of work for the
category. It included progressive elements such as
monospaced typography on a technical grid, using
fl
uid forms as a balance of art and science.
The ‘Vibrant M’ became a key signi
fi
er of the brand
and an inven
ti
ve way of presen
ti
ng a consistent
symbol worldwide without con
fl
ic
ti
ng with ‘the
other Merck’.
By making the shift from a chemical and
pharmaceu
ti
cal company to one of vibrant science
and technology, Merck now have the brand iden
ti
ty
that allows them to show the world their true
colours.
46.
47.
48.
49. L’iconographie est un sujet
d’identité.
Quelle représentation graphique
pour illustrer des notions
scientifiques élémentaires ou
avancées. Quel traité ? Quel niveau
de détail ?
50.
51.
52.
53. LA TECHNOLOGIE LIBRE DE DROIT
Ces visions fantasmées empruntes de réalité augmentée délivrent une
représenta
ti
on naïve et peu crédible lorsqu’il s’agit de parler haute
technologie.
54. En attendant le succès,
quelques conseils pour un
premier site simple et
efficace :)
55. QUELQUES CONSEILS
- Lisibilité : e
ff
ort de formula
ti
on, de synthèse et
d’organisa
ti
on du contenu.
- Mise en page simple qui s’appuie sur une
typographie e
ffi
cace.
- Respect des standards : format des images,
largeur de paragraphe, pensé pour le mobile.
- Cohérence des visuels (crédibilité, réalisme,
traité, etc.)
56. ÉVITER LA STRUCTURE PORTAIL Peu favorable au récit, elle impose une zone supérieure peu maniable et une
fragmenta
ti
on des contenus. Plus adaptée au modèle entreprise mature que
start-up.
57. ICONOGRAPHIE / IDENTITÉ Éviter les e
ff
ets graphiques maladroits et les images libres de droit qui risquent de
desservir l’e
ffi
cacité du propos.
58. ICONOGRAPHIE / IDENTITÉ Limiter les styles graphiques et sélec
ti
onner un traité capable de couvrir
l’ensemble des besoins.
59.
60.
61. ANNEXES : ARTICLES ET ÉTUDES
How to Present Scien
ti
fi
c Findings Online
h
tt
ps://www.nngroup.com/ar
ti
cles/scien
ti
fi
c-
fi
ndings-online/?lm=how-li
tt
le-do-users-
read&pt=ar
ti
cle
Why Does a Design Look Good?
h
tt
ps://www.nngroup.com/ar
ti
cles/why-does-design-look-good/
Web Design is 95% Typography
h
tt
ps://ia.net/topics/the-web-is-all-about-typography-period
5 Tips for E
ff
ec
ti
vely Pitching Science and Biotech Clients
h
tt
ps://www.bradfordgroup.com/blog/5-
ti
ps-for-e
ff
ec
ti
vely-pitching-science-and-biotech-
clients/
62. ANNEXES : SITES AVEC EXPÉRIENCES RICHES
h
tt
ps://www.i-sep.com/
h
tt
ps://www.evozyne.com/
h
tt
ps://www.anemoimarine.com/
h
tt
ps://solu
ti
ons.centogene.com/
h
tt
ps://waymo.com/
h
tt
ps://www.accenta.ai/
h
tt
ps://www.onwd.com/
63. ANNEXES : LE GUIDE DU SITE CORPORATE
Le guide du site corporate :
les meilleures pra
ti
ques
UX/UI et les erreurs à ne
pas comme
tt
re
• Iden
ti
té, posi
ti
onnement & o
ff
re.
• Architecture & naviga
ti
on.
• U
ti
lisabilité & ergonomie.
• Contenus & interac
ti
ons.
• Technologie & accessibilité.
h
tt
ps://ultro.fr/le-guide-du-site-corporate-remarquable/