étude de cas

LH, interfaces du site d'un maître d'œuvre

En 2018, j'ai commencé à effectuer des recherches de constructeurs de maison et de maîtres d'œuvre dans le cadre d'un projet personnel avec ma compagne. Les avis étaient partagés lorsque nous allions sur les sites : les réalisations étaient peu mises en valeur et rendaient difficile la projection, des précisions manquaient pour nous donner envie de les contacter et, pour certains, le formulaire était difficile à trouver, voire le numéro de téléphone.

Cette expérience personnelle m'a donné envie de m'intéresser à l'interface d'un site d'un maître d'œuvre, je vous propose de découvrir ce projet ci-dessous 😃


01 —
démarche

La démarche itérative

Avant de se lancer dans la réalisation des interfaces, il était important de travailler sur différentes étapes pour anticiper les besoins et répondre au mieux aux objectifs d'un site d'un maître d'œuvre situé sur Rennes, un marché très concurrencé et en pleine expansion. Je me suis basé sur les phases du processus de conception, présentées notamment dans le livre "Méthodes de design UX" de Carine Lallemand et Guillaume Gronier.

Planification et exploration

  • définition des objectifs business du site et étude du secteur d'activité
  • réalisation du rétro-planning
  • réalisation de l'arborescence
  • réflexion des parcours utilisateurs

Conception graphique et éditoriale

  • croquis/wireframes
  • maquettes graphiques/prototypes
  • rédaction des contenus
  • prise de vues et captation vidéos

Développement et évaluation

  • cahier des charges
  • intégration des interfaces en responsive design aux CMS/CRM
  • recettage et tests


03 —
process

Le marché de la construction

Rapide focus sur le marché de la construction individuelle. Un des principaux facteurs qui ont favorisé l'achat et la construction de maisons individuelles est la baisse des taux d'intérêt. Malgré des prévisions obscures (absence d'aide à l'accession en 2020) et des tendances à la baisse (-20% pour le secteur), les maisons individuelles ne cessent de d'apparaître. Cela permet l'évolution de certaines communes autour de Rennes et de dynamiser le territoire.


04 —
process

Conduite du projet

La phase de cadrage a nécessité du temps obligatoire pour construire l'arborescence, réfléchir aux parcours, aux contenus et anticiper le développement et les contraintes liées au CMS et CRM potentiels.

En amont du déploiement des opérations, j'ai imaginé un rétro-planning qui intégrait l'ensemble des étapes importantes de la refonte d'un site liées aux différentes expertises : de la définition du besoin, en passant par l'audit lexical (SEO) ou encore le paramétrage de GTM (Google Tag Manager) pour arriver jusqu'à la mise en ligne et aux optimisations post-mise en production.


05 —
design

Co-conception

La partie liée au webdesign est toujours très attendue, car également point de départ de la refonte des supports web, voire print. Les interfaces devaient permettre de faciliter la navigation, la lecture du contenu et de présenter des pages visuellement attrayantes bien entendu, en particulier pour les réalisations.

Pour faciliter la création des pages, la mise en place d'optimisations et plus largement l'administration du site, le travail a été réalisé selon le principe de l'Atomic Design. Des composants ont ainsi été créés pour facilement s'adapter en fonction des terminaux (mobile, tablette, desktop), éléments qui ont permis de concevoir les gabarits des différentes pages.


06 —
UI

Interface utilisateur

Je vous invite à découvrir ci-dessous un aperçu des interfaces réalisées au format mobile et desktop sous Adobe XD.


07 —
The end

LH, maître d'œuvre sur Rennes

Dans le cadre de ce projet fictif, certaines phases n'ont pas été réalisées telle que la rédaction du contenu ou encore le plan de marquage. Cependant, après quelques tests auprès d'utilisateurs proches qui recherchaient un constructeur de maisons ou un maître d'œuvre, les retours ont permis de constater que le choix de visuels plus importants permettaient de se projeter davantage.
Le formulaire, bien que complet, semblait par exemple plus acceptable à renseigner. Des points sont sûrement à creuser davantage, mais j'ai beaucoup apprécié travailler sur ce projet d'UX et d'UI 😄