"My eyes look better in rooms with summer colors."

Si l'impact des couleurs sur le web, sur la recherche d’informations et leur mémorisation et sur la transformation est important (cela fera l'objet d'un post ultérieur) elles sont souvent difficiles à choisir et à assembler.

Aujourd'hui, un court article afin de vous faire partager une découverte :

http://colorschemedesigner.com/

Il s'agit d'un outil génial d'aide au choix de palettes de couleurs.

Colorschemedesigner.com propose en effet des assemblages de couleurs à partir d'une couleur de base.

Couleurs primaires, tertiaires, complémentaires, il existe des règles d'assemblage à respecter. C'est là que colorschemedesigner intervient et vous facilite la tâche... tout en provoquant un wow effect certain.

Comment cela fonctionne -t-il ?

L'interface et les fonctions :

La première étape consiste à choisir la couleur de départ, à partir de votre charte graphique, de vos goûts etc. sur une roue chromatique.

Ensuite il faut choisir le type de modèle à générer : monochromatique, complémentaire, tertiaire, quadruple, analogique et analogique accentué.

Un menu d'aide contextuel (show tooltips) vous aidera à choisir le modèle correspondant le mieux à votre besoin, par exemple : "Le modèle monochromatique est basé sur une seule couleur et utilise uniquement des variations de cette couleur par modification de sa saturation et de sa luminosité ; le résultat est confortable pour la vue, même avec des couleurs criardes ; cependant ce modèle ne permet pas une identification aisée des objets à mettre plus en avant."

Une fois votre couleur sélectionnée, ainsi que votre thème, vous pouvez visualiser une page type utilisant cette palette. Par exemple, pour un modèle complémentaire à partir d'un violet, en déclinaison claire et foncée, cela donne :

Une fois le résultat obtenu, il ne vous reste plus qu'à exporter votre travail. Pour ce faire vous pouvez obtenir, à l'écran, la liste de couleurs ou exporter votre palette directement en HTML + CSS, XML, texte, ACO (palette Photoshop), ou GPL (palette GIMP).

Ayant pensé à tout, le concepteur de cet outil génial a intégré un simulateur d'anomalie de vision des couleurs (dyschromatopsie) très complet gérant deutéranopie (daltonisme), deutéranomalie, tritanopie etc.

Notre même palette, vu par un daltonien donnerait donc :

Dernière chose avant de vous laisser découvrir par vous même colorschemedesigner :

La page n'est pas construite en flash mais en jquery ce qui permet un site très léger (266 ko dont 153 ko de scripts) et accessible à partir d'un Iphone.

Coup de chapeau à Peter Stanicek qui a conçu cet outil et l'optimise depuis 2002.

«If it works, we're right. If he dies, it was something else»

Encore une citation du Dr House pour un autre emprunt à la méthodologie clinique. Sujet du jour : « Comment utiliser les M&M conferences dans le cadre de projets web».

Les «M&M conferences», M&M  pour «Morbidity and Mortality» consistent, dans le monde hospitalier, à passer en revue certains cas, soit de patients décédés, soit de patients dont le parcours de soin a souffert d'erreurs significatives.

Ces conférences ont été théorisées et mises en pratique par le Dr. Ernest Codman au Massachusetts General Hospital de Boston au début du  siècle dernier.

Avant d'en venir à l'application web marketing de ces conférences présentons en rapidement les principes :

Les objectifs :

Analyser les faits et identifier les actions ayant conduit au résultat négatif constaté afin d'en tirer les enseignements permettant, à l'avenir, de ne pas reproduire les mêmes erreurs lors de situations similaires.

Il s'agit avant tout d'apprendre de ses erreurs et de modifier en conséquence comportements et process.

La méthode : 

Ces conférences n'ont pas d'objectif punitif, il ne s'agit pas de mettre au banc des accusés tel ou tel praticien. Ce n'est pas non plus l'occasion de séances d'autocritique expiatrices. Seul le retour d'expérience prévaut.

Afin de ne pas déraper, des règles ont été mises en place pour  la conduite de ces échanges :

- La durée et les cas  :

La réunion ne devra pas durer plus d'une heure et un maximum de 3 cas seront étudiés pendant la conférence. Il s'agit d'aller à l'essentiel et de ne pas se perdre en digressions.

- Les personnes présentes :

Afin que la parole soit libre et pour éviter «l'effet tribunal» la personne présentant les cas dont il avait la charge, le rapporteur, le fait devant ses pairs et non devant ses supérieurs.

- La préparation :

Les cas sont préparés et communiqués à l'avance aux spécialistes convoqués afin qu'ils arrivent en session en ayant connaissance des éléments principaux. Les cas sont documentés et le rapporteur enrichit sa présentation des références issues de la littérature.

- Le retour d'expérience :

Tous les participants sont encouragés à donner leur point de vue.

A la fin de la réunion il est décidé collégialement de la qualité des discussions.

Si le retour d'expérience est significatif, celui-ci est rédigé puis enregistré et communiqué aux autres équipes susceptibles d'être confrontés aux mêmes cas.

Pourquoi et comment utiliser cette méthode en gestion de projets Web ?

Tous les jours, nous menons des projets : idées, conceptualisation, modélisation, maquettage, cahier des charges etc. jusqu'à la mise en prod. Trop souvent la vie du projet s'arrête là et, pris dans le tourbillon quotidien, nous passons à d'autres projets. Pourtant, c'est après la mise en prod que la vie du projet commence ; tout  préalable n'étant que gestation.

De tous ces projets, certains fonctionnent, d'autres moins, voire pas du tout, et, souvent, ceux qui ont échoué sont vite oubliés alors que c'est de ceux-ci qu'il faut apprendre pour ne pas reproduire les mêmes erreurs.

Avantages :

En médecine clinique il est assez évident de déterminer quand un patient est mort ... en web management un peu moins.

C'est le premier avantage : mettre en place des M&M oblige à fixer, en amont des projets, des indicateurs seuils permettant de déterminer a priori la réussite ou l'échec d'un projet ex : "créer 100 000 optins" ou "passer le taux de rebond de 30 à 15 % sur la home". Si l'objectif n'est pas atteint, le projet fera l'objet d'une réunion M&M.

Deuxième avantage : cela  oblige à déterminer un responsable de projet. C'est lui qui met en place ce qu'il faut pour atteindre les objectifs et c'est lui qui présente le cas en M&M si ceux-ci ne sont pas atteints. Un responsable projet = un interlocuteur unique = des projets fluidifiés.

Troisième avantage : l'historisation des projets : Dans un secteur au turn over important, archiver les données projets (objectifs, dispositifs mis en place, résultats et analyses des résultats) permet de ne pas perdre de savoir quand un membre de l'équipe quitte la société.

Limites :

La mise en place de ce procédé peut se révéler difficile et chronophage : rédiger les fiches projets, mettre en place les réunions, rédiger les ordres du jour et comptes rendus, gérer la base de connaissances.... Dans une petite structure ne disposant pas de service qualité c'est une charge qui peut se révéler lourde, surtout à la mise en place initiale.

Malgré les gardes fous évoqués, les réunions peuvent déraper et se transformer en règlements de comptes à O.K. Corral voir en justification de sanctions...

Chacun se fera donc sa propre idée sur l'intérêt de l'implémentation de cette méthode dans le cadre de la gestion de projets web. Si vous utilisez déjà une méthode similaire ou si vous prévoyez de tester les M&M  dans votre entreprise n'hésitez pas nous faire profiter de votre témoignage.

Pour en savoir plus sur les M&M :

1 ) Morbidity and Mortality Conference A Survey of Academic Internal Medicine Departments by Jay D Orlander, MD, MPH & B Graeme Fincke, MD

2)   Investigating the nature of the morbidity and mortality conference. Acad Med.1990;65:420. by Biddle C, Oaster 

3) Evidence-based medicine in practice: The M&M conference  By David Jevsevar, MD, MBA

4) PREPARING A MORBIDITY AND MORTALITY CONFERENCE by Debra Houry, MD, MPH & Michael Gibbs, MD

Ce n’est pas parce que ce n’est pas cliqué que ce n’est pas vu !

Tout d’abord rendons à César ce qui appartient à César : la formule n’est pas de moi mais de Patrick Oualid, un de mes anciens N+1. Il l’avait opposée à l’époque à une de mes analyses de CTR (Click-through rate / Taux de Clic). Son idée était la suivante : un taux de clic faible sur un élément ne veut pas dire qu’il est inutile au sein de la page ; même une page de transformation.

Il avait raison, le CTR, comme tout ratio, est une valeur relative ; un taux de clics n’est jamais bon ou mauvais, il est meilleur ou moins bon. De plus, il n'est pas suffisant pour analyser une page : une page n’est pas composée que d’éléments cliquables.

Nous avons maintenant à notre disposition des outils nous permettant d’analyser assez finement les comportements de clics et les représenter sous une forme facile à appréhender. Les heat maps, qu’elles soient générées par crazyegg ou par l’analyser d’AT internet sont de bons «outils à CoDir» en plus de représenter les zones de clics (je reviendrais sur ce point dans un post ultérieur) et l’eye tracking permet de mesurer l’attractivité des éléments constitutifs d’une page, ainsi que les schémas de déplacements visuels grâce à des sessions de tests qualitatifs.

A ce sujet, je voudrais vous présenter aujourd’hui feng-gui.com. C’est un outil jusque là expérimental, mais commercialisé depuis peu, qui permet de simuler et représenter le comportement normal d’un être humain exposé à un visuel, que ce soit une image, une page web, un email...

Concrètement, un ensemble d’algorithmes traite une image uploadée (créa, screenshot de page web…) et renvoie une heat map telle qu’elle aurait été générée par une étude d’eyetracking traditionnel ou une étude de zone de clics.

Fonctionnement :

Fen-gui va analyser les couleurs, les orientations, les densités et contrastes, les positions, les poids, les courbes, etc. de votre création et simuler la réaction normale d’un être humain pendant les 5 premières secondes d’expositions au visuel.

Avantages :

Bien évidement la rapidité et le prix qui en font un intéressant outil de «pré-test» : avant de se lancer dans de couteuses campagnes d’analyses en eye tracking (échantillonnage, recrutement, sessions, analyses...) ou de se lancer dans de l’A/B testing en prod, vous pouvez effectuer un premier filtre à peu de frais. Il suffit d’uploader une image et de valider, puis d'attendre quelques secondes le résultat que vous pouvez ensuite exporter.

Depuis peu la solution est passée payante mais reste encore très abordable (+/- 1$ par test).

L’autre intérêt est de pouvoir travailler seul : à partir de la réception de la maquette à valider, pas besoin de développeur pour de l’A/B testing, pas besoin de réunir de comité de pilotage ; vous soumettez la créa à l’outil et vous récupérez immédiatement un résultat exploitable.

Limites :

Jusqu’à présent les limites de la solution étaient surtout techniques : en dehors des critères d’analyse cités plus haut, l’outil de faisait pas la distinction entre deux textes :

LOREM IPSUM ou IPHONE OFFERT représentaient pour lui sensiblement la même chose.

Il ne faisait pas non plus la différence entre un visage en dessin ou en photo…

Maintenant que la solution est devenue payante, elle intègre la reconnaissance faciale et bientôt la reconnaissance de texte; c’est une belle avancée mais qu’en est-il des langues autres que l’anglais ? Pour les visages, arrivera-t-elle à faire le distinguo entre homme et femme, ou encore entre une femme lambda et Natalie Portman (ou encore entre George Clooney et moi) ?

Il reste donc bien entendu des optimisations possibles, mais cette solution permet à des coûts très minimes d’effectuer des pré-tests de visuels et d’ajouter un peu de démarche scientifique au «gros bon sens ».

Un petit exemple de résultat :

It's Never Lupus!

DDX et KPI ? C’est vrai, j’aurais pu trouver plus simple… et peut-être plus clair. Un blog de webanalytics  qui commence avec une URL et un titre incompréhensible ce n’est pas gagné. Du coup je profite de ce premier post pour expliquer rapidement le concept.

DDX et KPI : deux acronymes qui résument ma manière d’aborder l’expérience utilisateur d’un site web et son optimisation : KPI pour Key Performance Indicator, jusque là rien de bien nouveau, et DDx  pour Differential Diagnosis ou Diagnostic Différentiel.

J’avoue, l’idée est venue en regardant les épisodes de Dr House : la réunion, le brainstorming, le paperboard ; je me suis rendu compte que les professionnels du marketing online et les diagnosticiens partagent les mêmes outils, alors pourquoi ne pas partager les mêmes méthodes ? Profiter de la rigueur scientifique afin de réduire l’incertitude de la méthode « au feeling » et ainsi réduire les coûts. Tout est parti de là ; adopter une démarche éprouvée pour résoudre des problématiques de webanalytics et webmarketing.

Notre patient :

Un site web, un process, une promo, une opération de jeu concours…

Les symptômes :
Baisse des pages vues, des visites, des ventes ; trop d’abandons panier ; pas assez d’optin…

La méthode :

En mode brainstorm, réunir les membres de l’équipe, chacun spécialisé dans son domaine : e-mailing, CRM, technique, commercial, etc. Puis poser le problème et noter toutes les causes possibles pouvant mener aux symptômes constatés : problèmes de serveurs, prix de livraison affichés trop tard, mises en avant peu attractive, etc.

Une fois que nous avons toutes nos causes possibles, comme l’équipe de House, on procède par élimination. Il faut, pour chaque cause possible, déterminer un test qui permettra de définir si elle est, en tout ou partie, à l’origine de la « maladie ».

Les tests, eux, relèvent des outils classiques de l’optimisation de site : A/B testing, eye tracking, focus group, enquête en ligne, recoupements statistiques… Avec, à chaque fois, la détermination a priori des indicateurs à surveiller et des seuils permettant de qualifier le test de positif ou de négatif.

Ensuite, par itération successive, on soigne le patient jusqu’à la résolution du problème.

La différence avec House ? Pour nous le patient ne sort jamais de l’hôpital et chaque jour amène son lot de petits bobos ou de grosses pathologies.