UI UX Design, le duo indispensable pour un site e-commerce

Vous avez un site e-commerce et vous n’obtenez pas le taux de conversion que vous auriez espéré ? Vous êtes-vous demandé, si votre webdesign était pensé « expérience utilisateur » ?

Aujourd’hui, il est impératif d’utiliser l’UI et l’UX Design pour offrir à vos visiteurs un site ergonomique et fluide, leur permettant de trouver des informations rapidement, et ainsi, de pouvoir convertir plus.

Maintenant, comment faire pour optimiser votre site e-commerce ? Comment et quoi modifier sur votre boutique en ligne pour que vos visiteurs convertissent davantage ?

Dans cet article, nous répondrons à toutes ces interrogations et nous vous donnerons également, quelques astuces concrètes à mettre en place sur votre site e-commerce.

Mais tout d’abord, commençons par le commencement …

 

 

 

Quelle est la différence entre l’UI et l’UX Design ?

Dans la conception de site internet, on parle très souvent d’UX design pour l’expérience utilisateur (User eXperience) et d’UI design (User Interface) pour l’interface utilisateur, le design graphique.

Encore aujourd’hui, ces deux notions sont parfois confondues, alors qu’elles représentent deux compétences bien distinctes et spécifiques.

Laissez-moi vous éclairer …

 

Qu’est-ce que l’UX Design ?

L’UX Design ou l’Expérience Utilisateur, est l’ensemble des éléments mis en place pour concevoir un site web qui répond totalement aux besoins d’un utilisateur, concernant son utilisation.

Concrètement, il s’agit de créer une interface web agréable et fluide en prenant en compte les attentes et les besoins de l’internaute, pour l’amener à établir une interaction, sans trop d’efforts et de difficultés.

Selon Magnus Revang, architecte UX, l’expérience utilisateur se résumerait en 6 étapes clés :

• Visibilité: le site doit être facile à trouver, le référencement est donc nécessaire.
• Accessibilité: le site doit être lisible sur tous les supports, il faut donc prévoir le responsive.
• Attractivité: le design doit donner envie et l’ergonomie doit être agréable.
• Facilité: le site doit être intuitif pour que les visiteurs se repèrent facilement.
• Crédibilité: le site doit être crédible et véhiculer l’image de la marque.
• Efficacité : l’internaute doit rapidement trouver ce qu’il cherche.

 

Qu’est-ce que l’UI Design ?

Quant à l’UI Design ou interface utilisateur, c’est simplement de l’une des composantes de l’expérience utilisateur. Il s’agit de créer un environnement graphique, agréable, pratique et qui inspire confiance, pour permettre à l’internaute d’atteindre son but.

Concrètement, l’UI Design c’est :

• Créer une identité visuelle : création de logos, définition de couleurs, de typographie, …
• Créer des animations, des effets, …
• Mettre en place une hiérarchie visuelle.
• Appliquer les principes d’ergonomie web.
• Susciter une émotion.

 

 

 

L’UX n’est pas l’UI, mais, l’UI, c’est l’UX

Tous les deux nécessaires lors de la réalisation d’un site e-commerce (ou de toute autre interface web), l’UI et l’UX Design sont complémentaires, mais, attention à ne pas les confondre.

Se contenter de l’UI design, c’est-à-dire, la partie graphique, reviendrait à avoir un joli paquet cadeau sans rien à l’intérieur … Pour la conception de votre site internet, c’est la même chose, avoir un site esthétique c’est bien mais répondre aux besoins de vos visiteurs, c’est mieux !
L’inverse est identique, pensez simplement UX sans UI ne donnerait pas une interface ergonomique et fluide aux internautes, ils seraient donc susceptibles de partir plus rapidement.

Pour ces deux raisons, il est nécessaire de pousser la réflexion plus loin. Posez-vous les bonnes questions avant de commencer la création de votre site, définissez votre stratégie :

• Qui sont vos cibles ?
• Quels sont leurs besoins ?
• Quels sont mes objectifs pour la création de ce site ?
• …

 

Pour la création ou la refonte de votre site internet, il est donc nécessaire de mêler les deux notions : UX et UI Design. Avec une interface web fonctionnelle et ergonomique, qui répond à ses promesses et qui convient à vos visiteurs, vous aurez plus de chance de toucher votre cœur de cible et de répondre directement ses besoins. Ainsi, vous serez plus en phase avec la réalité de votre marché et vous diminuerez toutes les chances que votre activité ne fonctionne pas.

 

 

 

Mettre en place une stratégie orientée expérience utilisateur : UX Design

Maintenant, que vous avez compris ce qu’est l’UI et l’UX Design, il est temps de mettre en place votre stratégie d’expérience utilisateur pour votre site e-commerce.

Avez-vous déjà vu cette vidéo ? Si non, regardez là jusqu’à bout et vous comprendrez à quel point elle illustre parfaitement l’expérience utilisateur lors d’un achat sur un site e-commerce.

Plutôt long et compliqué non … ?

Dans un magasin physique, tout est fait en sorte pour que l’achat se fasse rapidement et sans souci particulier : caisses rapides, files d’attente moins longues, caisses spéciales pour un nombre d’articles précis, …

Pour le web, c’est la même chose, et c’est ici qu’entre en jeu l’UX Design : comprendre le comportement de vos visiteurs et concevoir une interface web répondant à leurs besoins, en leur permettant de faire une action sans trop de difficultés et de contraintes.

Il est donc nécessaire d’améliorer le parcours utilisateur et le rendre le plus agréable possible aussi bien techniquement qu’ergonomiquement et graphiquement (UI).

 

 

Définissez votre stratégie

Avant de vous lancer dans la conception de votre site e-commerce, mettez en place votre stratégie. Il est nécessaire de comprendre votre environnement, votre marché et vos cibles.

• Qui êtes-vous ?
• Qui sont vos concurrents ?
• Quelles sont vos cibles ?
• Quels sont les besoins de vos cibles ?
• Quelles sont les motivations de vos cibles ? Quels sont leurs freins ?
• Quels sont vos objectifs avec la création de ce site e-commerce ?
• Quels résultats précis souhaitez-vous atteindre avec ce site ?
• …

 

Toute réflexion préalable est nécessaire pour savoir comment vous allez construire votre site e-commerce. Un site qui n’est pas réfléchi et qui n’est pas penser UX lors de sa création, obtiendra peu de visite, peu de chance de toucher sa cible et donc peu de chance de gagner de l’argent …

Pour répondre au mieux aux différents besoins de vos cibles, vous pouvez créer vos personas, qui vous permettrons de « personnifier » vos cibles.

Pour en savoir plus sur les personas, je vous invite à lire notre article sur le Content Marketing.

 

 

Réalisez vos premiers schémas

Vous avez défini votre stratégie, vous connaissez votre environnement, votre marché, vos concurrents et vous avez construit vos personas.

Durant cette étape vous allez élaborer la structure de votre site :

• Quelles pages allez-vous construire ?
• Comment allez-vous les concevoir ?
• Quels enchaînements sont prévus entre les pages ?
• Comment placer vos blocs de contenus, afin qu’ils soient pertinents pour l’utilisateur ?
• La navigation est-elle intuitive entre vos blocs ? Entre vos pages ?
• …

C’est ici que vous allez réaliser vos wireframes (ou zonings). Il s’agit de dessiner toutes les maquettes de votre site e-commerce, de façon simple, afin de mettre en évidence l’emplacement des différents blocs qui composeront vos pages.

Elles vous aideront à mettre sur papier toute votre réflexion stratégique et à mettre en évidence toutes les problématiques liées à l’ergonomie d’un site e-commerce.

 

 

Créez votre graphisme

Votre stratégie est au point, vos wireframes sont prêts, c’est ici qu’entre en jeu l’UI Design.

Il s’agit de créer graphiquement toutes vos maquettes selon les réflexions que vous avez eu avec vos zonings : respect de votre charte graphique, ajout de pictogrammes, de photos, de couleurs, choix des typographies utilisées, …

 

Cela semble peut-être flou et compliqué d’élaborer tout cela seul. Pas de panique ! N’hésitez pas à vous faire accompagner par une agence en stratégie UX, pour vous aider à réaliser votre site e-commerce. Chez Performance Agency, nous vous accompagnons durant toutes ces étapes.

 

 

 

Nos conseils pour avoir un site e-commerce orienté UX Design

Prévoyez une navigation intuitive

Vous pouvez avoir un site e-commerce avec un design tendance et de très beaux visuels, mais si la navigation de votre site internet n’est pas assez rapide et intuitive, vous n’obtiendrez pas beaucoup de ventes …

Or, c’est ici le problème, votre objectif premier pour la création de votre site, est très certainement de gagner de l’agent, et ce n’est pas avec de simple « wooow c’est joli » que vous allez en gagner …

Il est donc nécessaire de prendre cela en compte à chaque moment d’interaction que vous avez prévus pour vos visiteurs. Ils doivent comprendre clairement et rapidement toutes les informations qu’ils sont venus chercher et dont ils ont besoin, par exemple :

• Sur quelle page se situent vos visiteurs ?
• Où se situe l’arborescence, pour pouvoir naviguer sur toutes les pages ?
• Un bouton « retour », est-il prévu pour revenir en arrière ? Un fil d’ariane ?
• Y a-t-il des filtres et une recherche rapide ?
• Comment vos visiteurs peuvent-ils vous contacter ?
• Le temps de chargement des pages, est-il suffisamment court ?
• Y a-t-il un moyen pour sauvegarder des articles et revenir plus tard pour les acheter ?
• Avez-vous prévu des avis clients, qui permettraient de rassurer vos visiteurs ?
• …

Chaque bouton ou lien de redirection joue un rôle significatif dans la navigation de votre site. Il vous permettra de faire gagner du temps à vos visiteurs durant leur acte d’achat. Dans des marchés concurrentiels, vous vous devez d’offrir la meilleure expérience utilisateur possible à vos visiteurs, s’ils n’ont pas l’information ou l’article qu’ils sont venus chercher ou que le temps de chargement de vos pages est trop long, … Ils iront sûrement acheter chez vos concurrents.

 

 

Présentez efficacement vos articles

Votre objectif premier est de vendre. Pour cela, la présentation de vos produits sur la page d’accueil et la disposition des éléments dans vos pages produits, sont à prendre en compte.

Attention de ne pas surcharger d’informations vos visiteurs : donner les informations essentielles de vos produits, ne détourner pas leur attention par des éléments secondaires.

Sur votre page d’accueil, n’hésitez pas à mettre un petit descriptif de votre produit, ou de prévoir un aperçu rapide du produit et de la description.

Vous l’avez compris, les utilisateurs veulent l’information tout de suite et ne sont pas prêt à naviguer sur plusieurs pages pour pouvoir l’obtenir.

 

 

Utilisez l’UI Design

Nous l’avons vu plus haut dans l’article, faire un site tendance avec de beaux visuels, c’est bien, mais sans contenu intéressant ou sans analyse UX au préalable, cela ne fonctionnera pas.

L’inverse est identique : votre réflexion UX est bien construite, mais vous n’avez en aucun cas prévu d’UI … Les visiteurs ne seront pas au rendez-vous.

Souvenez-vous, l’UI Design est de créer un environnement graphique, agréable, pratique et qui donne des émotions. Le style est donc une étape importante à ne pas oublier lors de la conception de votre site e-commerce. Voici quelques conseils :

• Prévoir une harmonie générale du site : qui donnera à vos visiteurs un sentiment de satisfaction esthétique et qui favorisera l’expérience utilisateur.
• Respecter la charte graphique et les couleurs de votre entreprise : afin de donner à vos visiteurs une cohérence et une assurance qu’ils sont bien sur votre site.
• Mettre en place une hiérarchie visuelle des différentes zones que vous avez conçus.
• Définir un style qui correspond aux produits que vous vendez : il faut qu’en quelques secondes seulement, les visiteurs puissent comprendre quels produits sont vendus sur votre site.

 

 

Optimisez votre version mobile

Il est important de comprendre que sur mobile, l’expérience utilisateur est différente que sur desktop. Alors que se passe-t-il si vos clients accèdent sur votre site, mais sur leur téléphone ? Ce n’est pas parce que votre expérience utilisateur est optimisée sur ordinateur qu’elle le sera forcément sur les appareils mobiles …

Pour cela, nous nous donnons quelques conseils à suivre, pour adapter votre expérience utilisateur sur mobile :

• Concevez vos wireframes spécialement pour le mobile: vous pourrez ainsi répondre à toutes les problématiques que les utilisateurs pourront rencontrer en utilisant leurs téléphones ou leurs tablettes.
• Mettez en évidence les éléments les plus importants: le menu, l’accès à leur compte, …
• Assurez-vous que vos pages produits se chargent rapidement, vos utilisateurs mobiles sont particulièrement impatients, faites-en sorte qu’ils restent sur votre site.
• Contentez-vous des informations utiles: vos visiteurs sur mobiles sont susceptibles d’être interrompus très facilement, supprimez les éléments inutiles et utilisez au minimum les éléments décoratifs.
• …

 

 

 

Pour résumer l’essentiel, il est aujourd’hui nécessaire de concevoir un site e-commerce pensé expérience utilisateur. Vous devez offrir à vos visiteurs ce qu’ils viennent chercher en alliant la rapidité, le design et la cohérence.

Si vous souhaitez être accompagné par une agence dans la réalisation de votre site e-commerce orienté : expérience utilisateur, n’hésitez pas à nous contacter, nous pourrons étudier votre projet ensemble.