Relais & Châteaux made by C2iS : retour sur le développement front-end

Par Christian,
dans Actualité digitale

Dans le cadre d’une compétition orchestrée en novembre dernier, le réseau d’hôtels et de restaurants indépendants Relais & Châteaux a retenu le tandem C2iS/Ogilvy One pour opérer une refonte totale de sa plate-forme e-commerce worldwide www.relaischateaux.com. C2iS a été choisie pour être à l’œuvre de  la migration technique et de la réalisation front-end du dispositif. La mise en ligne de ce nouveau dispositif a été effectuée le 11 août dernier.

Nous vous proposons de retrouver les interviews des personnes clés de ce projet chez C2iS. Aujourd’hui Laurent Guitton (@webdevlint), Manager Pôle Front-End (1).

En quoi l’enjeu du développement front-end  possède-il un relief particulier pour le projet Relais & Château ?

Il y a eu dans ce projet une différence avec ce qu’on fait habituellement : la création et la conception UX(2) ont été réalisées par une autre agence. Nous avons du nous adapter à d’autres méthodes de travail – même si dans l’ensemble nos méthodes et celles d’Ogilvy One sont très proches. Nous avons formé une team de co-conception : par exemple, lorsque l’agence de création évoquait un concept, elle nous demandait si cela était techniquement faisable et pertinent. Nous avons manipulé ensemble un objet de conception qui allait ensuite être transformé en maquettes. Nous échangions sur les modules et les worklows, les parcours utilisateur de telle à telle page… « Quand on clique-là, il se passe cela » etc. A ce stade on essaie de construire des scénarios, des cinématiques de progression dans les interfaces. On manipule l’objet avant qu’il ne soit habillé graphiquement. On est encore dans le conceptuel à ce stade. Et cette collaboration a fonctionné comme on le fait d’habitude en interne.

On sent bien que le travail de conception consiste dans la définition des enchaînements logiques de l’interface, et on sent qu’au-delà de la spécificité d’un client, de la typologie de projet , le travail est collaboratif. Est-ce exact ?
Oui, nous cherchons à créer une mécanique, un fonctionnement de l’interface. Sur certains modèles d’interfaces, il a fallu une co-conception des écrans. Sachant que chaque décision UX ou HTML doit être confrontée à des problématiques telle que la charge serveur par exemple. Ergonomiquement c’est aussi très intéressant, est-ce que en back-office on pourra le gérer ? est-ce que le visiteur va comprendre l’interaction de tel élément dans son parcours de recherche… Et puis des questionnements qui paraissent simple : si on met une vidéo sur la home-page, quelles préconisations doit-on faire ?

La conception semble parfois un processus assez abstrait, on sent que le travail collaboratif apporte une manière plus concrète de résoudre les problématiques. On cherche à créer une expérience.
Oui, aujourd’hui on ne peut pas concevoir un tel dispositif sans une équipe conséquente. Le travail de l’agence consiste dans l’orchestration globale des différents acteurs et des différentes étapes de production.

Le fait de dessiner les contours de l’expérience Relais & Châteaux a-t-il impliqué des spécificités ?
Au niveau du code, le site doit être en mesure de supporter les standards courants actuels. Les intégrateurs suivent les parti-pris de la direction artistique. A partir du moment où un axe artistique a été choisi, par exemple les interactions sur les boutons, nous essayons de nous en rapprocher le plus possible. Les interactions sont minimales pour laisser le contenu s’affirmer.
Il y a une suite logique à définir. L’objetif est de répondre à l’exigence de la création en réalisant les adaptations nécessaires au passage en HTML/CSS. On est dans une représentation un peu plus mathématique : une colonne c’est 33,33333%, ce n’est pas un nombre fixe de pixels pour nous. Nous devons répondre à tous les types d’interface. Une des qualités attendues d’un intégrateur, c’est de la rigueur : « appliquer de la mathématique à la création ». Comment décrire la création pour qu’elle réponde au standards, aux différents types d’appareils (ordinateur de bureau, tablettes, smartphones, etc.) Nous construisons la mécanique invisible en mettant en place une structure standardisée pour y recevoir la création artistique sans la freiner.

Vous élaborez donc un autre type de charte en quelque sorte… ?
C’est tout à fait ça, nous réalisons ce qu’on appelle un « styleguide » où l’on définit tous les éléments, une sorte d’inventaire – mesures, cotations, et spécificités de l’interface d’un point de vue html (le logo est comme cela, la typo c’est ça, les couleurs c’est tel code hexadécimal…) On liste toutes les choses nécessaires pour réaliser des gabarits, cela doit suivre des règles graphiques. Ce module doit respecter un certain nombre de contraintes. On répertorie tout, module par module (slider, formulaire, cartographie) et chacun des éléments qui compose ces modules. Mais on aura l’occasion d’en reparler très prochainement 😉

On sent qu’on atteint le niveau de rigueur que l’on pouvait avoir dans l’édition print en PAO au début des années 90…? Pour un livre on avait une feuille de style (l’expression vient de là) où l’on définissait tout, typo, taille, couleurs, marges, espacements…
Exactement ! C’est ce qui fait que l’on passe dans un processus de quasi industrialisation au sens où il faut coter tous les composants. Cette rigueur est nécessaire pour parvenir à réaliser un objet complexe. L’intégration HTML est donc quelque chose de sensible et de souple. Une maquette est aboutie, arrêtée dans ses contours. La production HTML est dans la contrainte nécessaire d’être un langage interprété, et notamment interprété différemment par les navigateurs, les résolutions, les OS… Le styleguide fait donc référence auprès du client et des membres de l’équipe de développement pour plus de cohérence globale. C’est un référentiel précis. L’interface est tendue au « quatre vents »… il y a Safari Mac, Firefox Linux, moi je déboule avec IE8… Il faut être en mesure d’afficher le contenu dans tous ces cas de figure qui seront définis par la capitainerie du projet…

Ces détails impliquent-ils également une forte maturité du client ?
Oui en effet ! La  maturité numérique du client est un enjeu capital de la réussite d’un projet. Les interlocuteurs Relais & Châteaux possèdent une culture digitale, une culture du développement et une expertise de la stratégie commerciale, ils étaient ouverts à la dimension collaborative : nous pouvions argumenter nos choix techniques qui pouvait être expliqués à leur Direction.

C’est le début de ce qu’on appelle la transformation digitale des entreprises ?
Oui, c’est cette capacité qu’a le client de travailler avec des experts et de se faire son expertise au passage, ou, d’en avoir déjà une, de la conforter à des spécialistes. Une agence est toujours en direct sur l’évolution du numérique et des technologies. La transformation digitale c’est de la co-construction avec tous les acteurs.
L’autre pan de cette transformation c’est le niveau de prise de risque du client face à de nouveau enjeux technologiques. Il fallait répondre à une certaine modernisation nécessaire du dispositif et se rapporter à ce qui se fait de mieux aujourd’hui. C’est ce qu’a fait Relais & Châteaux.

Airbnb occupe beaucoup les esprits en ce moment, comment peut-on faire face ?
Cela peut être une source d’inspiration mais en l’espèce nous ne sommes pas face à la même cible, aux même produits ni à la même exigence de service. Il y a une autorité de la marque considérable pour Relais & Châteaux …

On peut rapprocher cela du 3eme pilier de la philosophie de marque Apple, érigé par Mike Markkula sous le concept d’incarnation : Comment l’image de marque va se diffuser à tous les niveaux de l’entreprise, dans la conception, les RH… et pas uniquement le produit ou le design…
Il y a un made by Relais & Château spécifique et reconnu. Et ce savoir-faire doit en effet être perceptible à tous les niveaux, et aujourd’hui particulièrement au niveau digital.

… L’audience de ce type de marque est en attente de ce niveau de perception qualitative ?
Le site web est une part du produit final, c’est là où l’expérience commence, l’expérience d’un label unique commence par le digital aujourd’hui.

Relais & Château c’est donc déjà, au delà d’un label ou d’un réseau,  une plateforme communautaire avant l’heure si on veut faire un clin d’œil…
Exactement !

En quoi une agence possède-t-elle des qualités uniques ? Est-ce dans le fait qu’on s’adresse aux makers du web ?
Oui, chaque personne est qualifiée pour pouvoir répondre sur son périmètre d’intervention et même souvent au-delà ! On ne « monte » pas une page HTML, on construit du sens dans le faire, le « faire » questionne. Notre grande différence c’est que nous ne sommes pas dans la simple exécution ! Il y a une philosophie de la relation client derrière et un respect des règles du W3C. Il y a des frameworks qui naissent tous les jours, notre monde est très orienté « technologies ». La technologie semble accessible à beaucoup. C’est la raison pour laquelle une agence doit savoir et pouvoir arbitrer sur des choix et ne pas forcément suivre. Et tout cela en restant au fait permanent des nouveaux paradigmes techniques comme AngularJS qui diffuse du contenu brut dans des contenants différents… enfin bref…

On a le sentiment que la page web n’existe plus désormais… on serait plutôt dans contenus qui doivent se structurer selon des formats et des contextes ?
Pour Relais & Château le contenu doit en effet être « livré » dans un contexte ! Nous sommes dans un dispositif, quelque chose qui communique, un objet qui donne les bonnes réponses à l’internaute. Ceci est d’autant plus remarquable que le client de Relais & Château peut se connecter n’importe où, n’importe quand, dans le monde entier, depuis tout type d’appareils et dans toutes les langues ! Les points de contacts sont complexes et se situent dans une contextualisation qui va de plus en plus loin. Chaque établissement local a son contenu. L’appropriation par le client doit être complète : par exemple, dans un formulaire de contact on dépasse les traditionnels « Madame, Monsieur ». En anglais, on a « Sir », en allemand le « Dr »… il faut pouvoir gérer ces titres différents ! Dans certain pays il n’y a pas de prénom mais plusieurs « noms » en fonction de sa parenté, etc. L’interface devient le miroir digital du haut niveau de qualité de service de Relais & Château !

(1) Le champ de compétence du développement Front-End se situe au niveau des technologies et langage HTML, CSS, Javascript.
(2) Domaine de conception centré sur l’expérience utilisateur.

par Christian

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Rechercher