Designers & Intégrateurs : BFF !

Les sites web, c'est mieux quand on s'y met à plusieurs ! Découvrez comment nous avons optimisé notre manière de travailler pour délivrer plus de qualité dans la joie et la bonne humeur. Talk donné le 29 octobre à Blend Web Mix 2014 à Lyon, France.

Transcript

1. Designers & Intégrateurs BFF Marie-Cécile Paccard Goulven Champenois * * best friends forever
2. Souvent, le quotidien des designers et des intégrateurs, c’est plutôt…
3. Quoi ? Tu te plains alors que tu l’as à peine respectée ? Mais elle sort d’où cette maquette ? Il manque les survols et la version mobile ! Tes découpes étaient mal faites ! J’ai même pas pu ouvrir ton fichier, c’est pas du Photoshop ! Pfff ! C’est du Sketch, t’es vraiment fermé d’esprit ! Tsss !
4. Et c’est ainsi que vos projets
 se passent mal.
5. Et c’est ainsi que vos projets
 se passent mal. Très mal…
6. Nous sommes passés par là. Nous en avons souffert. Et nous avons décidé de changer nos méthodes pour enfin améliorer les choses ! Y2k  Bug  designed  by  Cards  Against  Humanity  from  the  Noun  Project
7. Le constat est amer T_T
8.   Organisations compartimentées Snowman  designed  by  Luis  Prado  from  the  Noun  Project
9.   Organisations compartimentées
 Professions conditionnées Snowman  designed  by  Luis  Prado  from  the  Noun  Project
10.   Organisations compartimentées
 Professions conditionnées ! Méthodes surgelées… Snowman  designed  by  Luis  Prado  from  the  Noun  Project
11.   Ces mots rappelleront à certains des années
 de douleur. Si vous souffrez de cela aujourd’hui, il est largement temps de stopper le massacre ! Snowman  designed  by  Luis  Prado  from  the  Noun  Project
12. OBJECTIF Vous faire travailler autrement : pour plus de qualité, pour de bonnes conditions de travail, pour vous rendre plus heureux <3 DE CETTE PRÉSENTATION
13. Ce n’est pas si compliqué, vous allez voir :)
14. ✓ Utilisables ✓ Navigables ✓ Respectueuses
 des utilisateurs Produire des interfaces… NOUS AVONS UNE MISSION EN TANT QU’ACTEURS DU WEB,
15. Ô GRANDE DIVINITÉ DES INTERNETS MONDIAUX ! DONNE-NOUS LA FORCE !
16. Car nous avons
 le pouvoir et le devoir 
 de changer les choses !
17. C’est parti ! \o/
18. Un vieil adage fait encore des ravages dans beaucoup trop de domaines…
19. « Le Client est Roi. »
20. Nope. NOPE
21. Le besoin du client est roi.
22. Ce besoin doit diriger nos projets : nous sommes des artisans dont le travail est régi par des contraintes.
23. ! ! ! Intégration </> ! ! ! Design graphique ! ! ! Conception ! ! ! Architecture d’information, chemins utilisateurs ! ! ! tion du oin, erche ateurs ! ! ! Mise en production ! ! ! Vie ap lancem En général dans les projets, 
 on est plutôt cascade…
24. t ! ! ! Intégration </> ! ! ! Design graphique ! ! ! Conception ! ! ! Architecture d’information, chemins utilisateurs ! ! ! tion du oin, erche ateurs ! ! ! Mise en production ! ! ! Vie ap lancem Cette bonne vielle cascade qui peut se transformer en torrent de montagne ! Retourner en arrière ? NOPE NOPE NOPE !
25. ! ! ! Intégration </> ! ! ! Design graphique ! ! ! Conception ! ! ! Architecture d’information, chemins utilisateurs ! ! ! Définition du besoin, Recherche utilisateurs ! ! ! Mise en production ! ! ! Vie après le lancement Changeons !
26. ! ! ! Intégration </> ! ! ! Design graphique ! ! ! Conception ! ! ! Architecture d’information, chemins utilisateurs ! ! ! Définition du besoin, Recherche utilisateurs ! ! ! Mise en production ! ! ! Vie après le lancement Changeons ! Il est possible de favoriser un processus en parallèle, pour que chaque phase puisse démarrer sans attendre qu’une autre soit terminée.
27. Par exemple, il nous arrive de commencer l’intégration en même temps que le design graphique, pour peu que l’intégrateur ait participé à la phase de prototypage !
28. Quelques conseils pour y arriver \o/
29. Remettons-nous en question 1
30. Sortons de nos intitulés de poste 1 REMETTONS-NOUS EN QUESTION Nos professions nous conditionnent souvent malgré nous. Mais qui a dit qu’un cursus scientifique interdisait de concevoir, et qu’un diplôme artistique empêchait d’apprendre à coder ?
31. Mettons-nous à jour 1 REMETTONS-NOUS EN QUESTION Depuis que nous avons terminé nos études, le Web a continué d’évoluer. Finis les sites en tableaux imbriqués ou en full-Flash : n’oubliez pas de maintenir vos connaissances en ligne avec le Web d’aujourd’hui.
32. Apprenons de nouvelles choses 1 REMETTONS-NOUS EN QUESTION Restons curieux des nouveaux outils et langages qui apparaissent. Sketch commence à faire parler de lui ? Peut-être serait-ce profitable de voir ce qu’il peut nous apporter !
33. Changeons notre attitude 1 REMETTONS-NOUS EN QUESTION Face à une ambiance tendue, retrouvons le sourire. Apprenons à formuler la critique, et surtout à la recevoir ! Au lieu de dire « non », mettons-nous à dire « Oui, et… »
34. Réchauffons nos méthodes 2
35. Étudions nos outils respectifs 2 RÉCHAUFFONS NOS MÉTHODES Penchons-nous sur le workflow de chacun pour comprendre comment les livrables sont fabriqués : peut-être avons-nous des astuces à nous donner ?
36. Intégrons l’intégrateur (LOL?) 2 RÉCHAUFFONS NOS MÉTHODES à la phase de conception pour une meilleure prise en compte des contraintes techniques, pour faire la version mobile et mieux gérer l’architecture de contenu, pour les emails/ mailings afin de bien gérer le faisable/ infaisable.
37. Travaillons ensemble 3
38. BAH OUI. Déjà parce qu’on ne livre jamais le HTML d’un côté et le design de l’autre.
39. Partageons notre veille, nos fiertés, nos astuces, nos galères 3 TRAVAILLONS ENSEMBLE Notre veille pour se donner de bonnes idées respectives, nos fiertés pour mieux savoir ce que font les autres, nos astuces et nos galères pour améliorer la collaboration et détecter les problèmes.
40. Mettons à plat nos méthodes 3 TRAVAILLONS ENSEMBLE Ajuster les détails peut améliorer beaucoup de choses. Essayons de déceler ce qui peut être amélioré dans la chaîne de production : un changement ? Git ? Sketch ? Étudions les impacts sur le travail des autres.
41. Faisons des points réguliers 3 TRAVAILLONS ENSEMBLE Chaque semaine, chaque jour, plusieurs fois par jour si le projet le demande ! Prenons goût aux « stand-up meetings » pour se tenir informés de ce qui a changé depuis le dernier point et ce qui impacte le planning.
42. Rapprochons nos bureaux 3 TRAVAILLONS ENSEMBLE Une des causes de mésentente et de rigidité réside dans le manque de communication. Rapprochez-vous, bougez votre poste de travail le temps d’un projet !
43. Plus de 9 mètres entre vos bureaux de ne jamais vous croiser. 9 10 chances sur
44. Osons travailler autrement 4
45. Montrons que c’est possible 4 OSONS TRAVAILLER AUTREMENT Si l’un de nos changements a contribué à faire réussir un projet, alors parlons-en à nos confrères et consoeurs : il deviendra plus réel et plus atteignable pour eux !
46. Dispersons le virus chez les SysAdmins,
 directeurs/trices artistiques, commerciaux… 4 OSONS TRAVAILLER AUTREMENT Eux aussi sont concernés par des phases du projet : invitez-les à se tenir informés de l’évolution du projet, prévenez les SysAdmins de vos futures mises en production…
47. Intégrons-les aux estimations 4 OSONS TRAVAILLER AUTREMENT Ces différents acteurs peuvent tous avoir un apport intéressant dans la phase d’estimation, qu’il soit technique ou pratique.
48. Convainquons notre hiérarchie ! 4 OSONS TRAVAILLER AUTREMENT Rien ne sert de se débattre si votre manager ou votre dirigeant ne comprend pas le bien-fondé de tous ces changements. Exposez-leur les bénéfices et demandez-leur de vous soutenir !
49. EUH, ça marche vraiment, vos trucs ?
50. Notre réalité
51. Dans une ambiance que nous voulons agréable et bienveillante pour chacun, nous appliquons un maximum de bon sens à nos actions et nos choix. Nous faisons confiance à chaque membre de l’équipe et valorisons son apport. ! Nous ne faisons plus de « devis », mais des « estimations » avec une fourchette tarifaire. Chaque acteur participe à l’estimation, et le plus souvent, le montant final se trouve dans la fourchette prévue !
52. Nous tentons autant que possible de paralléliser les phases de travail. Très souvent, l’intégration commence peu après le début de la phase de conception. Nos designers sont à côté 
 de nos développeurs. ! Résultat : nos clients nous font confiance. Nous nous permettons même de contacter certains pour prévoir avec eux les futurs projets !
53. OUI MAIS… Ça vaut que pour les petites boites, non ?
54. Petite ou grande entreprise, équipe de 3 personnes comme de 20, il n’y a jamais plus d’une personne devant chaque ordinateur. L’essentiel est d’assurer une excellente communication au sein de l’équipe,
 et de s’assurer que chacun adhère 
 aux mêmes valeurs. NOPE.
55. Dès la semaine prochaine, mettez en place ces trois petites choses : EN RÉSUMÉ
56. Travaillez ensemble
57. :-) Intégrez les intégrateurs
58. <3 Rapprochez- vous !
59. Merci ! @mcpaccard @goulvench Tweetez-nous vos changements ! @ThinkInnovWeb LE 29 OCTOBRE 2014