Adepem - Repenser la structure UI/UX du site e-commerce

Logo de Adepem.
UI & UX Design

À propos d’Adepem

Industries :
E-commerce
Services :
UI & UX Design
Durée du projet :
1 semaine

Depuis plus de 40 ans, Adepem accompagne des milliers de particuliers et professionnels à redonner vie à leurs appareils électroménagers.

Lave-linge, aspirateurs, fours, réfrigérateurs… Ils proposent plus de 200 000 pièces détachées accessibles en ligne. Leurs missions ? Prolonger la durée de vie des équipements, réduire le gaspillage, et rendre la réparation facile et rapide pour tous.

Alliant expertise technique, service client humain et logistique efficace, Adepem est aujourd'hui une référence pour ceux qui préfèrent réparer plutôt que jeter.

Smartphones affichant une pièce détachée sur le site Adepem, entourés d’un câble orange.Smartphones affichant une pièce détachée sur le site Adepem, entourés d’un câble orange.

Le défi à relever

Riche de plus de 200 000 produits, le fameux catalogue est régulièrement mis à jour, sachant que les modèles évoluent. Adepem souhaitait offrir à ses utilisateurs une expérience plus fluides et intuitive. Nous avions comme mission d’intervenir sur deux pages stratégiques : accueil et fiche produit.

Les enjeux étaient clairs :
Faciliter l’accès aux produits dès la page d’accueil
Structurer les informations clés sur les pages produits
Simplifier la navigation pour guider efficacement les parcours d’achat

Le défi était donc de rendre la recherche, la compréhension et l’ajout au panier plus simples et plus rapides, tout en respectant l'identité et la technicité d’Adepem.

Présentation de la typographie "Outfit" avec alphabet complet et chiffres.Palette de couleurs Adepem avec les noms et codes hexadécimaux : beige, orange, bleu, bleu foncé, bleu très foncé.Technicien en chemise à carreaux manipulant une hotte aspirante dans une cuisine moderne.Technicien en chemise à carreaux manipulant une hotte aspirante dans une cuisine moderne.
Trois smartphones affichant différentes vues du site Adepem, avec la recherche de pièces détachées, des filtres de marques et un aperçu des produits.Trois smartphones affichant différentes vues du site Adepem, avec la recherche de pièces détachées, des filtres de marques et un aperçu des produits.

La page Accueil

Sur la page d’accueil, nous avons recentré l’UX autour des points d’entrée prioritaires :

Faciliter l’accès aux produits dès la page d’accueil
Structurer les informations clés sur les pages produits
Simplifier la navigation pour guider efficacement les parcours d’achat

L’architecture visuelle a été revue pour réduire la charge cognitive et faciliter l’accès rapide à l’ensemble du catalogue, même sans connaissance produit.

Vous avez un projet ?
Icône flèche.Icône flèche.
Portrait d’un technicien barbu en bleu de travail, bras croisés, avec outils à la ceinture.Pied de page du site Adepem montrant les moyens de paiement, liens utiles et informations de contact.Vue d’un ordinateur portable affichant la page d’accueil du site Adepem avec le message "Toutes les pièces détachées pour réparer vos appareils ménagers".Vue d’un ordinateur portable affichant la page d’accueil du site Adepem avec le message "Toutes les pièces détachées pour réparer vos appareils ménagers".

La fiche Produit

Sur un site comme Adepem, la fiche produit est au cœur du parcours d’achat. Elle doit être à la fois claire, rassurante et accessible, même face à une information technique dense. Nous avons entièrement repensé cette page pour en faire une interface plus structurée, plus guidante, et adaptée aux usages actuels.
Vous avez un projet ?
Icône flèche.Icône flèche.
Page produit du site Adepem présentant un ventilateur tangentiel pour four, avec visuels du produit et options d’achat.
Une zone haute pensée pour la décision rapide

Dès l’arrivée, l’utilisateur accède aux éléments essentiels : nom du produit, prix, évaluation, livraison, disponibilité, avec un bouton "Ajouter au panier" visible immédiatement. Cette zone a été pensée pour réduire le temps de décision, en affichant les informations importantes dès le premier écran.

Page produit du site Adepem présentant une vitre intérieure Pyrolytic pour four avec ses caractéristiques détaillées.
Informations techniques lisibles et hiérarchisées

Les caractéristiques du produit sont désormais organisées en blocs identifiés, avec une hiérarchie visuelle qui facilite la lecture. Les alertes importantes (produit similaire mais non compatible, précautions de montage) sont mises en valeur sans perturber la lecture.

Présentation de l'interface utilisateur du site Adepem sur fond bleu, avec options de recherche, vue produit, et informations de contact.Présentation de l'interface utilisateur du site Adepem sur fond bleu, avec options de recherche, vue produit, et informations de contact.
Aide à la compatibilité et contenu pédagogique

Un module permet aux utilisateurs de rechercher leur appareil et de vérifier sa compatibilité. Nous avons aussi intégré une section "Nos contenus" pour proposer des articles ou tutoriels vidéo en lien avec le produit pour accompagner la réparation et réduire les demandes au service client.

Une page complète mais fluide

La fiche produit rassemble de nombreux blocs fonctionnels. Nous avons veillé à maintenir une hiérarchie visuelle cohérente et des espaces de respiration, pour que l’utilisateur navigue facilement dans cette richesse d’information, sans se sentir perdu ou submergé.

Smartphone affichant une page produit de pièces détachées Whirlpool sur le site Adepem, avec un fond épuré et un étui orange.Smartphone affichant une page produit de pièces détachées Whirlpool sur le site Adepem, avec un fond épuré et un étui orange.

La navigation principale

Nous avons repensé la navigation d’Adepem pour qu’elle soutienne mieux la recherche rapide de produits dans un catalogue dense. Elle a été complètement retravaillée : elle passe d’un système surchargé, en double colonne, à une structure plus lisible, avec une meilleure séparation des familles de produits, et une navigation plus intuitive, aussi bien sur desktop que sur mobile.

Grille d'icônes blanches représentant divers appareils électroménagers et outils, sur fond bleu foncé.Smartphone suspendu par une corde d’escalade, affichant la page d’accueil mobile du site Adepem.Smartphone suspendu par une corde d’escalade, affichant la page d’accueil mobile du site Adepem.Menu déroulant du site Adepem montrant les catégories de gros électroménager et les pièces associées à un four.
Homme allongé sous un évier en train d’effectuer une réparation de plomberie.Homme allongé sous un évier en train d’effectuer une réparation de plomberie.
Livraison du projet
À travers une page d’accueil allégée, une fiche produit plus structurée et une navigation clarifiée, l’interface permet désormais :
Un accès plus rapide aux bons produits
Une prise de décision plus fluide
Une meilleure lecture sur mobile (canal n°1 pour Adepem)
Les livrables ont été remis sous Figma, prêts à l’intégration. Le projet a posé de nouvelles bases solides pour une expérience e-commerce plus efficace, plus lisible et plus adaptée aux usages actuels.
Vous avez un projet ?
Icône flèche.Icône flèche.
Comparaison entre l'ancienne et la nouvelle page d'accueil du site Adepem, avec mise en avant des produits et des catégories d'appareils.Comparaison entre l'ancienne et la nouvelle page d'accueil du site Adepem, avec mise en avant des produits et des catégories d'appareils.Ancienne version d'une fiche produit sur le site Adepem présentant un joint de hublot de lave-linge avec contenu associé.Nouvelle version d'une fiche produit sur le site Adepem présentant une poignée de hublot blanche pour lave-linge.
Icône guillements

Kévin de Lapotion a brillamment réalisé la maquette de notre site adepem.com, alliant parfaitement UI élégante et UX efficace. Son attention aux détails malgré nos nombreux retours et sa communication fluide ont rendu la collaboration rapide et efficace. Nous referons appel à ses services pour nos futurs projets sans aucune hésitation.

Icône guillemets
Portrait de Benjamin Guez, CTO de Adepem.
Benjamin Guez
CTO, Adepem
Repensons votre site web pour qu’il serve vos enjeux marketing
Et si votre site devenait un réel levier de conversion ? Parlez-nous de vos objectifs, on vous aide à construire une base solide et durable.
Discutons-en
Icône flèche.Icône flèche.
Bientôt votre site web ?