Échanges et exemples pratiques pour vos futurs projets web. Quelles sont les tendances du design d'interface pour 2017 ? Quelles sont les nouvelles armes des designers d'interfaces ? Comment réussir un design adapté à son client et aux utilisateurs ? Animé par Arnaud Steckle, WebdesignerTrends.com

1. Explorations à travers le design d'interfaces, la créativité et l’expérience utilisateur
Atelier Convention Medialibs - Poitiers / 23 septembre 2016
Bienvenue
post-webdesign
dans l’ère

2. Arnaud Steckle
DA Digital / Web Designer
@wdtrends

3. webdesignertrends.com

4. izhak.fr

5. Atelier du jour
● L’ère post-webdesign, WTF ?
● Web design, quelles tendances pour 2017 ?
● 5 clés d’une expérience mémorable
pour l’utilisateur

6. L’ère
post-webdesign

7. La fonction première du design
est d’améliorer l’expérience du
produit ou du service*
*Wow, en fait, c’est pas juste de la déco !

8. Constat n°1 :
Déployer un produit web est devenu
“bon marché”

11. Constat n°2 :
Le design est présent à tous les étages

13. Constat n°3 :
Les interfaces disparaissent (Invisible UI)

14. ● Google Now
● Apple Siri
● Windows Corona

15. Constat n°4 :
Nous sommes à la préhistoire...

18. Le web
design
est-il mort ?!

19. D’où viennent
les tendances ?

20. *Google + Apple + Facebook + Amazon
L’influence forte
des GAFA* sur le design

22. Mais aussi :
● Des galeries d’inspiration
● De la mode, du design, de l’architecture
● Des besoins des utilisateurs
● Des évolutions technologiques

23. 5 tendances 2017

24. 1. Animations maestro !
● Héritées des applications mobiles
● Merci CSS3, Javascript et les navigateurs
● Simples, même invisibles

26. 2. Scrolling
● Parcours utilisateur vertical
● Influencé par le mobile
● Attention à la linéarité de l’expérience

27. http://www.gosolar.com/

28. 3. “Hero video”
● Interface immersive
● Capte l’attention
● Génère de l’émotion

29. http://www.visithumboldt.com/start

30. 4. Long stories
● Immersif & interactif
● Impact sur l’utilisateur

32. 5. Skeumorphisme 2.0 ?
● Présence d’éléments réels dans les interfaces
● Simulation 3D & VR / AR sur le web

34. Tendances 2017 en bref :
1. Animations
2. Scrolling
3. Hero video
4. Long stories
5. Skeumorphisme 2.0

35. 5 clés d’un design
mémorable pour
l’utilisateur

36. But et règles du jeu :
● Trouver les réponses à 5 problématiques
UI & UX
● Écrire ensemble 5 règles à appliquer
à nos projets

38. Où se “situe” l’UX ?
Source JDN
Valeurs du site
et de l’utilisateur
Culture, créativité, authenticité,
empathie, éthique, liberté, originalité,
partage, respect, partage...

39. Où se “situe” l’UX ?
Source JDN
UI
Concept graphique,
esthétique, design, typo, style,
message, wording, branding...

40. Où se “situe” l’UX ?
Source JDN
UX
Utilité, efficacité, ressenti,
ergonomie, accessibilité,
crédibilité, architecture

41. Question n°1 :
Comment faire bonne impression
et capter l’attention de l’utilisateur ?

42. En créant une expérience positive
Hypothèse n°1 :

45. Question n°2 :
Comment créer un design efficace
qui dure dans le temps ?

46. En arrêtant de créer des interfaces.
Créons plutôt des expériences !
Hypothèse n°2 :

49. Question n°3 :
Comment créer un design diffusant
au mieux les valeurs d’une marque ?

50. En incarnant réellement les valeurs
de la marque ou du produit
Hypothèse n°3 :

52. Question n°4 :
Une fois captée, comment maintenir
l’attention et faire revenir l’utilisateur ?

53. En impliquant l’utilisateur dès la
conception pour créer de l’émotion
Hypothèse n°4 :

54. Inversion du process de conception
Commanditaire
Utilisateurs
Prise en compte des besoins
du commanditaire
Commanditaire
Utilisateurs
Prise en compte des
BESOINS des utilisateurs
Inspiré par Laurent Demontiers

55. Question n°5 :
Comment rendre l’expérience
repérable et partageable ?

56. En allant à l’essentiel : donner la bonne
information au bon endroit
Hypothèse n°5 :

59. En bref
● Faire une première très bonne impression
● Créer une expérience avec un design flexible
● Incarner la marque et l’infuser sur le dispositif
● Créer de l’émotion en engageant l’utilisateur
● Délivrer la bonne info au bon endroit

60. 5 clés d’un design mémorable
1. Désirable
2. Utile & pérenne
3. Crédible
4. Émotionnel
5. Repérable & partageable

61. Questions ?
@wdtrends - webdesignertrends.com

62. Merci à tous
@wdtrends - webdesignertrends.com