Hestiae
Webdesign
Accueil
Portfolio
À Propos
Contact
Mon CV

Hestiae
Webdesign

Accueil
Portfolio
À Propos
Contact
Mon CV

Artisan de l'audition

Réalisation du site internet pour le client artisan de l’audition, et création d’un prototype d’application.

Durée

≈ 6 semaines

Équipe

Chavanne Marie-Camille
Marie Rosalie

Rôle(s)

Web designer/ Web marketing
Graphiste

Outils

  • Figma
  • Figjam
  • Photoshop
  • Illustrator
  • WordPress
  • Elementor
  • Jotform
  • Notion

Introduction

Qui est “Artisan de l’audition” ?

Il s’agit de professionnels de l’audition cherchent à partager des informations précieuses sur la prise en main et la gestion des appareils auditifs. Les personnes atteintes de troubles auditifs ont souvent besoin d’un accompagnement spécifique pour comprendre et utiliser leurs appareils. C’est pourquoi la création d’un site internet est essentielle, car il propose des informations.

Contexte

Ce projet a été réalisé pour un client professionnel lors de mon expérience en tant que Web designer dans une agence web. Mon travail a consisté à élaborer la charte graphique du site internet en collaboration avec ma collègue, puis à créer le site en lui-même.

En plus de la création du site web, pour aller plus loin, j’ai proposé un prototype d’application conçu avec Figma, qui s’inscrit dans la continuité des services proposés par le site web.

Objectifs

Les objectifs de ce projet étaient multiples. Tout d’abord, il s’agissait de fournir des informations claires et précises sur l’audition en général, dans le but d’aider les visiteurs à mieux comprendre le fonctionnement de cet organe.

Ensuite, le projet avait pour ambition d’offrir un accompagnement adapté aux personnes atteintes de troubles auditifs, en leur fournissant des informations et des conseils sur la prise en main et la gestion de leurs appareils auditifs. Par ailleurs, l’objectif était de concevoir une expérience utilisateur agréable et efficace, en veillant à la facilité de navigation et à la clarté des informations proposées sur le site.

Découverte des besoins

01. Découverte des besoins

Avant de commencer toute création ou conception graphique, il est essentiel de comprendre les besoins du client et les objectifs qu’il souhaite atteindre mais aussi identifier le ton, le style et les émotions qu’il souhaite transmettre. Dans ce cadre, une rencontre initiale a été organisée entre le client ma collègue et moi afin qu’il puisse exprimer ses attentes et ses exigences.

Cet échange nous a permis de poser les bases de la création de la charte graphique en déterminant les besoins et attentes du client. Cette étape est essentielle pour assurer une bonne communication avec le client et garantir la satisfaction de ce dernier. Le client avait établi que la couleur principale de son identité visuelle devait être respectée.

Analyse

Nous avons effectué un benchmark pour analyser le marché, les concurrents et les tendances actuelles en matière de design. Cette analyse nous a permis d’identifier les opportunités et les contraintes de conception.

Nous avons constaté que le marché de l’audition était concurrentiel mais de niche, ce qui pouvait offrir un avantage concurrentiel à la marque si elle se spécialisait dans un type d’appareils auditifs ou un type de troubles auditifs.

Cependant, il est important de noter que le marché des appareils auditifs est réglementé. Pour créer l’identité de marque et le site internet, il est crucial de respecter les normes et les réglementations en vigueur. Ces contraintes peuvent avoir un impact sur la conception.

En outre, étant donné que les appareils auditifs sont des produits techniques, la présentation de ces produits sur le site internet peut être limitée par des contraintes techniques. Il est donc essentiel de prendre en compte ces limites lors de la conception du site internet et de l’identité de marque.

Charte graPhique

02. Identité visuelle

Suite à l’analyse du marché et à l’identification des opportunités et des contraintes de conception, nous avons commencé à travailler sur la création de l’identité visuelle d’Artisan de l’Audition. Nous avons débuté par la création de plusieurs concepts d’identité visuelle en prenant en compte la couleur imposée par le client.

Ensuite, nous avons présenté les différents concepts au client pour qu’il puisse les évaluer et donner son avis. Après délibération, nous avons sélectionné l’un des concepts et travaillé sur la création de la charte graphique complète.

Nous avons déterminé les typographies, les images et les différents éléments visuels définitifs qui allaient composer l’identité visuelle de la marque. Nous nous sommes assurés que tous les éléments étaient cohérents avec l’image de marque et les valeurs d’Artisan de l’Audition.

Site internet

03. Création du site internet

Le client avait exprimé plusieurs exigences pour la création de son site internet, telles que le nombre et l’intitulé des pages, la fonctionnalité de prise de rendez-vous directement sur le site, un blog et l’utilisation de textes spécifiques. Afin de s’assurer d’une vision partagée avec le client, j’ai réalisé une maquette rapide de la page d’accueil en prenant en compte les objectifs du client, notamment la prise de rendez-vous. J’ai ensuite structuré la maquette et sélectionné les éléments clés des pages, tels que les titres, les CTA, les images et les icônes.
Après la validation de la maquette par le client, j’ai procédé à l’achat du nom de domaine sur OVH et à l’installation de WordPress avec les plug-ins requis pour la construction du site, notamment :

Elementor

Un constructeur de thème visuel pour WordPress qui permet de créer des pages et des articles personnalisés sans avoir besoin d'écrire du code.

WooCommerce

Un plug-in permettant de créer et de gérer une boutique en ligne avec des fonctionnalités avancées pour la vente de produits et de services.

WPRocket

Un plug-in de cache pour WordPress qui permet d'optimiser les performances du site en accélérant son temps de chargement.

Yoast SEO

Un plug-in de référencement naturel pour WordPress qui permet d'optimiser les contenus du site pour les moteurs de recherche.

Wordfence

Un plug-in de sécurité pour WordPress qui permet de protéger le site contre les attaques, les malwares et les tentatives de piratage.

Amelia

Un plug-in de réservation pour WordPress qui permet aux visiteurs de réserver des rendez-vous et des services en ligne.

L’organisation

Ensuite, j’ai organisé mon travail en commençant par l’intégration des textes et des images de la landing page, de Notre audition, Qui somme-nous, et de la page Contact. Puis, j’ai intégré le blog, la page de prise de rendez-vous, ainsi que les fiches techniques des différents appareils auditifs. Pour cela, j’ai respecté le balisage des titres (h1, h2, h3, etc.) et des paragraphes, en mettant en avant les mots-clés.

J’ai également intégré les fiches techniques des appareils auditifs dans WooCommerce, ce qui s’est avéré rapide. Cependant, la création du fichier sources afin de les intégrer a été plus longue à réaliser. J’ai également créé la page de prise de rendez-vous avec le plug-in Amelia et le blog en utilisant un modèle de base pour les articles et en les publiant à des dates spécifiques définies par le client.

J’ai effectué des tests réguliers pour optimiser le site pour tous les appareils et améliorer sa facilité de navigation pour les visiteurs. J’ai optimisé le site en utilisant des chargements différés, en compressant les images en format de nouvelle génération et en ajoutant des balises alt, entre autres.

L’application Bêta

04. L’application Bêta

Pour aller plus loin dans l’accompagnement du client, j’ai proposé un prototype d’application conçu avec Figma. Cette application s’inscrit dans la continuité des services proposés par le site web et avait pour but d’offrir une expérience utilisateur encore plus immersive et pratique.

Cette application aurait permis aux utilisateurs de prendre rendez-vous avec un audioprothésiste en ligne, par chat ou vidéo, ou en boutique afin de régler leurs problèmes avec leurs appareils auditifs. Des tutoriels auraient également été proposés pour aider les utilisateurs à utiliser pleinement les capacités de leurs appareils auditifs.

J’ai mis un point d’honneur à concevoir une interface utilisateur claire et intuitive, offrant une expérience utilisateur fluide pour les utilisateurs de tous âges. J’ai pris en compte l’ergonomie et la simplicité d’utilisation pour faciliter l’expérience utilisateur et permettre aux visiteurs de naviguer facilement. Pour ce faire, j’ai intégré des icônes facilement identifiables qui permettent de rendre les interactions avec les utilisateurs plus intuitives et efficaces.

Les résultats

Quel est l’avenir de “L’artisan de l’audition” ?

01.Amélioration de l’expérience utilisateur :

Bien que le site soit déjà conçu pour être accessible, clair et intuitif, il est toujours possible de l’améliorer pour une expérience utilisateur encore plus agréable et fluide. Cela peut inclure l’optimisation de la navigation, l’amélioration du temps de chargement des pages, ou la simplification des formulaires de contact.
02. Intégration de nouvelles fonctionnalités : 

Pour rester compétitif et offrir des services toujours plus pratiques, il serait intéressant d’ajouter de nouvelles fonctionnalités à la fois sur le site internet. Par exemple, la possibilité d’acheter des accessoires pour les appareils auditifs directement depuis le site.

Ce que je retiens 🧐 :

L’importance de l’organisation
La réussite du projet était en grande partie due à l’organisation mise en place. Pour atteindre les objectifs fixés, j’ai opté pour une approche méthodique consistant à travailler page par page. J’ai commencé par les pages qui devaient être mises en place en premier lieu pour assurer le bon fonctionnement du site web, avant de me consacrer aux pages moins prioritaires.

Cette méthode m’a permis d’optimiser l’utilisation de mon temps et de mes ressources, en m’assurant que les aspects les plus importants du projet étaient traités en premier.

J’ai également veillé à ce que chaque étape du processus soit clairement définie et communiquée à l’équipe et au client afin que nous puissions avancer de manière efficace et cohérente tout au long du projet.
Proposition rejetée mais proposition essentielle
J’ai suggéré la création d’un prototype d’application avec Figma pour étendre les services proposés par le site web. Cependant, malgré mon enthousiasme pour cette idée, le client n’a pas été convaincu par cette proposition.

Je pense qu’il est important de noter que bien que ce prototype d’application n’ait pas été retenu, le processus de conception et de proposition de nouvelles fonctionnalités reste essentiel pour améliorer l’expérience utilisateur et la satisfaction du client.

En tant que web designer, il est de ma responsabilité de proposer des idées créatives et innovantes qui correspondent aux besoins et aux attentes de mes clients tout en étant techniquement réalisables et rentables.