7 bonnes pratiques pour optimiser la page d’accueil de son application mobile

Récemment, USERADGENTS publiait une étude décryptant les applications mobiles du Top 50 des retailers en France pour en tirer des chiffres clés et bonnes pratiques. Une analyse incontournable pour les DG qui s'interrogent sur la pertinence de l'app dans une stratégie digitale, pour les fonctions marketing qui tentent en vain de prioriser une refonte dans leur roadmap, les chef.fes de projet qui observent des baisses d'efficacité dans les parcours et plus globalement pour tous ceux qui pensent faire tout très bien mais souhaitent quand même se confronter aux meilleurs, pour valider quelques convictions et rectifier certains fashion retail faux pas.

Dans ce top 50, on retrouve des acteurs de la mode, de la beauté, de l’ameublement, de la tech et du luxe, des acteurs pure player ou brick & mortar, des marketplaces et des spécialistes de la seconde main, analysés sur trois écrans essentiels dans la mise en valeur des produits, ceux qui captent le plus de visites et ont un rôle essentiel sur la conversion : 

• l’accueil : homepage (HP), 
• le catalogue produits : Product Listing Page (PLP), 
• la fiche produit : Product Detail Page (PDP).

Dans une trilogie d’articles, nous reviendrons sur les best practices à adopter pour chacune de ces 3 pages inspirées par le top retailers et illustrées avec les conseils de nos designers. Et puisqu’il est plutôt logique de commencer par le commencement, ce premier article vous propose 7 bonnes pratiques pour une homepage inspirante, rythmée et efficace. 

La homepage, c’est en quelque sorte la vitrine de l’application mobile, le point d’entrée vers le parcours client. Elle doit à la fois refléter l’image de marque, être suffisamment claire quant à l’offre proposée, inspirer les visiteurs et favoriser l’interaction pour les inciter à découvrir les produits et services. Alors, comment bien mettre en valeur la barre de recherche ? Comment orienter vers le bon produit, le plus efficacement possible ? Comment mettre l’emphase sur une sélection de produits ? Zoom sur l’optimisation de cette page, de la navigation à la mise en avant d’articles, en passant évidemment par la fonction de recherche qui génère le plus d'interactions de l’utilisateur. 

Une barre de recherche visible, persistante et intelligente

Incontournable, la barre de recherche est présente chez 78% des HP des apps analysées dans le cadre de notre étude. Placée en haut de l'écran et pour la plupart stickée (c’est-à-dire figée en header pour rester visible pendant le scroll), elle doit être suffisamment grande pour être identifiable. Accompagnée d’une icône “loupe”, elle doit aussi proposer une invitation à rechercher un produit ("Essayez chapeau pour enfants", "robe festive à paillettes"...) et ainsi inspirer avec des exemples. Indiquer "Rechercher sur Ebay" ou "Rechercher sur Amazon" n’apporte rien d’utile à l’utilisateur qui sait déjà ce que le moteur de recherche permet de faire.

Les 22% n’ayant pas opté pour le moteur de recherche en homepage sont constitués pour la majorité de Maisons de luxe (OffWhite, Louis Vuitton, Saint Laurent, Burberry) et marketplaces luxe (Farfetch, Yoox), mais aussi de marques de prêt à porter (Mango, Pimkie, Jennyfer) qui privilégient la découverte des nouvelles collections et orientent vers des catégories phares pour lancer une recherche.

Certaines apps qui privilégient voire dédient la HP à l’immersion et l’inspiration déplacent la barre de recherche dans l’onglet catalogue pour ne pas perturber l’expérience sur l'accueil. D’autres optent même pour l’ouverture du catalogue produit au lancement de l’app, pour adresser plus efficacement le besoin utilisateur qui vient consulter des produits (Nike par exemple). Cette approche user centric permet d’adresser plus finement les différents contextes de visite en fonction du besoin du visiteur.

Séverine Dumont, Directrice de l’Expérience Client.

Nous préconisons également la saisie automatique ou prédictive, proposée par exemple par notre partenaire Algolia (spécialiste de la recherche alimentée par l’IA), pour assister l’utilisateur et mieux spécifier sa recherche, l’affichage de ses dernières recherches, la commande vocale (6%) et enfin last but not least, le scan de produits ou l’import de photos, proposé par 34% des acteurs. Une fonctionnalité couplée à la reconnaissance visuelle qui permet de passer de l'idée à l'achat en un éclair, en tirant partie des fonctionnalités natives du smartphone, et qui sert également l'omnicanalité. Sur simple scan d'étiquette en magasin, on peut par exemple imaginer consulter des infos produits, commander une taille indisponible en stock… 

Devenir incontournable, c'est tout ce que l'on recherche lors de la conception d'une expérience mobile : être aussi bien pertinent dans un salon que dans un rayon, c'est ainsi qu'on augmente l'usage de son app.

Michel Buonomo, Directeur Conseil

Ce type de fonctionnalité nécessite d’optimiser régulièrement ses algorithmes de reconnaissance visuelle pour garantir des résultats précis et pertinents.

Avec le déploiement de l'IA générative, la recherche est vouée à persister voire à profondément se transformer pour engager des parcours nouveaux. GPT-4o par exemple va augmenter ses capacités omniscientes pour permettre une interaction nourrie de l'ensemble des capteurs disponibles sur le mobile et accessibles grâce aux apps ! Pour le retail, ce sont des nouveaux parcours qui se créent, une nouvelle ère pour l'expérience, celle de l'agentic UX.

Hugo Subil, Directeur du Pôle Conseil

Des catégories pour guider l’utilisateur, en plus du moteur de recherche

Qu’elles soient data-driven (catégories populaires par exemple) ou éditorialisées (exclusivités, partenariats, temps forts, nouvelles collections...), les catégories mises en avant sous le moteur de recherche permettent de mieux cibler la recherche. Une pratique qui s’observe également sur les PLP, notamment chez les marketplaces pour aider à affiner sa recherche.

On retiendra et conseillera pour notre part différentes façons de traiter visuellement ces catégories : icônes labellisées, barre d'onglets, visuels (en vignettes façon stories ou cards).

Les apps proposent des clés d’entrées dans le catalogue de plus en plus contextuelles et personnalisées, parfois générées en temps réel, pour une expérience vraiment singulière. Un autre moyen de démontrer la profondeur et la diversité du catalogue, mais aussi de mettre en avant des nouveautés de plus en plus éphémères dans certains secteurs.

Séverine Dumont, Directrice de l’Expérience Client.

Des variations dans le sens de scroll pour créer du rythme

À date, 70% des acteurs offrent une navigation en carrousel et 20% ont recours au scroll infini. Cela concerne principalement les marketplaces. 

Le scroll horizontal permet de créer du rythme dans la page en faisant découvrir une courte sélection de produits / avantages sur lesquels on pourrait intégrer des éléments habituellement présents en PLP (l’ajout aux favoris, les avis,...) ? Il est important d'avoir une limite d'éléments à montrer pour éviter un balayage sans fin et de prévoir un bouton "Voir plus" donnant accès à une page dédiée montrant tous les items. Une pratique à favoriser également pour des raisons d’éco-conception et d'accessibilité.

Sur l'accueil, le carrousel pleine largeur a tendance à disparaître pour une très bonne raison : la conversion qui décolle très rarement au-delà du premier élément... Jouons plutôt les logiques de "cards" où le contenu principal prend 2/3 de la largeur de l'écran et où le contenu suivant apparaît en amorce, donnant envie de le découvrir

Michel Buonomo, Directeur Conseil

Un filtrage naturel des produits grâce à la connaissance client

La personnalisation de la HP en fonction des préférences, tailles ou historique de navigation / commandes permet à l'utilisateur de se sentir plus proche de la marque, qui l'aide ainsi à trouver plus facilement et rapidement ce qu'il veut.

Afin que le client ne reçoive pas que des propositions similaires aux articles qu'il a déjà recherchés et passe à côté de nouvelles propositions inédites, nous préconisons de conserver un fil d’actualités composé d’items variants de ses envies habituelles.

Les apps mobiles permettent de faire de la personnalisation de contenus y compris lorsque l’utilisateur est en mode non identifié (non connecté à son compte client), sans nécessiter l’implémentation de SDK ou d’identifiant. C'est l’un des bénéfices clés de l'expérience proposée par l'app mobile, en tant que véritable flagship où l’on se sent (re)connu et où tout est à portée de main facilement, presque sans avoir à chercher.

Hugo Subil, Directeur du Pôle Conseil

Du visuel en plein écran pour immerger dans l'univers de marque

Les vidéos (ou gif) de quelques secondes sont toujours utiles pour attirer l'attention et immerger dans un univers. 16% des acteurs du top y ont d’ailleurs recours en homepage. Cependant, elles risquent d'ennuyer l'utilisateur si l'application est utilisée fréquemment ou s'il n'y a pas de moyen d'arrêter la boucle. Dans un souci d’accessibilité, prévoyez un dispositif pour stopper l’effet ou un dispositif pour le masquer / l’afficher.

Tout comme les vidéos, les visuels qui occupent tout l’écran, ou en tout cas sa majeure partie, sont plus immersifs et plus inspirationnels. Privilégiez des visuels créatifs et léchés, issus de photoshoots.

Attention cependant à la lisibilité des éléments d’interfaces, textes, call-to-action et à faire varier régulièrement les contenus pour éviter la lassitude. Ils doivent permettre de mettre en valeur des temps forts, opérations spéciales…

Le recours à une vidéo n’est pas sans impact sur le poids de l’application. Or, une bonne pratique de conception d’une app est d’en réduire le poids au maximum. C’est en se donnant comme contrainte de respecter un poids cible pour son application que le recours aux vidéos doit être pensé. Cette contrainte pousse à se poser les bonnes questions : quel effet doit-elle produire ? crée-t-elle réellement de la valeur pour l’utilisateur ? peut-on faire autrement pour obtenir le même effet ?

Fabienne Latxague, Lead UX Strategist

Le produit présenté et raconté comme dans un magazine

Éditorial, visuels de photoshoots, tendances, storytelling autour des articles, quick access vers les fiches produits...?Tel un média, certains acteurs misent à fond sur l’inspiration avec le combo visuel de qualité, titre d’article ou de rubrique et courte description introductive.

Une pratique idéale selon nous pour parler d'un style ou d’une tendance, donner des détails sur un produit, en particulier pour les secteurs de la mode ou encore de la décoration d’intérieur. 

L'inspiration façon Stories

Les codes des réseaux sociaux sont très souvent appliqués à la découverte produit chez les retailers. Cette feature ancrée dans les habitudes permet dans un espace réduit (des bulles de stories) d’afficher les tendances du moment puis de disposer d’un écran entier pour héberger des vidéos, des photos, des articles et plus encore.

Un mode d’interaction utile pour pousser une dose d’inspiration quotidienne et ainsi créer de la récurrence d'usage mais aussi dans une vocation branding, pour raconter les processus de fabrication, partager les engagements de la marque, etc.

Les apps sont tiraillées entre les codes du print, façon magazine avec des mises en pages très différenciées des sites web et de l’autre les codes des réseaux sociaux, très inspirationnels, aux contenus éphémères.

Marie Billon, Directrice des études

Pour plus de bonnes pratiques, d’exemples et de chiffres exclusifs, l’étude est en libre téléchargement et peut vous être présentée en format conférence. 

Besoin d’un audit UX-UI, un projet de refonte d’app ou de site, de TMA, USERADGENTS vous accompagne ! Discutons-en.