💡 Découvrez notre Guide Complet pour bien choisir votre Agence Shopify

👉 Nous vous invitons également à lire notre Guide sur comment choisir son Expert Shopify

 

Voici une nouvelle liste de boutiques Shopify. Cette fois, notre sélection est basée sur des critères esthétiques : design, UX (expérience utilisateur) & photographie. Les sites listés ci-dessous ne sont pas rangés selon un classement. Glitty n'est donc pas forcément notre store favori. Mais il fallait bien commencer par l’un d’entre eux :).

1. Glitty

Glitty propose des iCoques/Protections haut de gamme en bois pour produits Apple. Leur démarche en matière de design ? Minimalisme

Les critères de cette approche vous apparaîtront immédiatement lorsque vous constaterez le nombre réduit de pages de cette boutique Shopify : Accueil, Qui Sommes-Nous, Produits et pages individuelles de produits.

L’atout principal de Glitty est qu’ils excellent dans la présentation de leurs produits, chaque page contient tous les éléments nécessaires, tous harmonieusement présentés :

• Des options soigneusement séparées et une parfaite utilisation de l’espace.
• Les délais d’expédition sont indiqués via un message accrocheur et inspirant.
• Production responsable (bois certifié FSC),
• Avis
• Preuve sociale via Instagram.
• Notifications via messagerie Facebook plutôt que par e-mail.
• FAQ
• Photos simples.

Voici quelques captures d’écran :

Conseil de Pro

Sur Shopify, il est très facile d’intégrer de nouvelles applications à votre site Web et à vos pages de produits. Mais les chances sont faibles pour que votre thème Shopify prêt à l’emploi puisse gérer tous les éléments supplémentaires que vous souhaitez ajouter sans perdre de points en terme d’UX design. Notre conseil est donc de :

• Lister toutes les fonctionnalités nécessaires à votre boutique et aux pages de produits.
• Si vous en avez trop, éliminez les éléments les moins importants.
• Demandez à une agence de vous personnaliser un thème (ou d’en créer un nouveau) en gardant ces exigences à l’esprit. Évitez d’ajouter des choses par vous-même au fur et à mesure.

Nous avons trop souvent vu des pages de produits se transformer en cauchemar UX à cause d’une utilisation irresponsable d’intégrations qui se chevauchent et distraient l’utilisateur plutôt que l’attirer. Alors, faites attention, less is more (le moins, le mieux).

 

2. 54celsius

Un superbe site de e-commerce qui vend des bougies créatives et artistiques. D’une manière générale, le site passe avec brio la plupart des critères d’UX design Shopify, mais ce qui a vraiment attiré notre attention ce sont LES PHOTOS DES PRODUITS :

• Elles mettent en scène les produits alors même qu’ils sont utilisés.
• Les photos sont incroyablement interactives, il suffit de les survoler pour déclencher un diaporama vidéo.

3. Tinker Watches

Le site propose des montres personnalisables, et offre, dans l’ensemble, l’une des meilleures expériences utilisateur que nous avons pu voir jusque-là. Tout est bien pensé et parfaitement à sa place sur la boutique Shopify.

Conseil de Pro

Dans de nombreuses entreprises de e-commerce, les produits personnalisables font partie intégrante de l’offre de base. Qu’il s’agisse d’un achat ponctuel de produit ou d’un abonnement, les deux doivent être rationalisés et conçus de la manière la plus simple qui soit. Pourquoi ? Parce que votre client potentiel a une durée d’attention très courte, et selon Google, entre autres, l’utilisateur perçoit chaque clic sur une nouvelle page comme une tâche à accomplir. Et vos visiteurs n’aiment évidemment pas ça !

Si vous essayez de proposer une expérience similaire, essayez d’éliminer toutes les étapes inutiles ou les personnalisations mineures qui pourraient complexifier votre interface.

Voici quelques captures d’écran issues du processus de personnalisation de Tinker :

 

4. Dodo case

Toujours dans la catégorie personnalisation, Dodo propose, pour tous ses produits, une expérience de personnalisation complète. Même si nous trouvons l’interface un peu surchargée, on peut dire qu’elle joue correctement son rôle, et on retrouve tous les éléments requis :

• Barre de progression
• Boutons « Précédent/Suivant ».
• La personnalisation s’applique en temps réel sans aucun délai.

Conseil de Pro

C’est un autre exemple de ce que vous pouvez faire si vos exigences sont similaires pour vos produits. Si vous aimez l’UX de Dodo, et que vous envisagez de suivre leur exemple, nous vous recommandons quelques améliorations au niveau de l’interface :

• Utilisez l’intégralité de l’écran, et ne concentrez donc pas les options au milieu.
• Utilisez une couleur de fond neutre.
• Ne répétez pas les différents éléments (prix, commandes...), l’espace étant une denrée précieuse.

Cela étant dit, ces modifications constituent la cerise sur un gâteau déjà merveilleux. Voilà à quoi ça ressemble :

5. Seedlipdrinks

Parlons peu, parlons bien. C’est un site web qui mérite un 10/10. Droit au but, simple, soigné et beau. Un site d’une seule page qui vend 2 produits, et qui le fait très bien.

Conseil de Pro

Si vous avez une gamme de produits réduite et que vous souhaitez opter pour quelque chose de similaire, tenez compte des recommandations suivantes :

• Le référencement ou SEO est-il essentiel à votre stratégie sur le long terme ? Vous devez travailler plus dur pour assurer la promotion de votre site et créer davantage de backlinks de bonne qualité pour compenser le manque de contenu sur votre site.
• Pensez à Analytics, les données sont votre principal atout. Les sites Web d’une seule page doivent avoir une configuration personnalisée de Google Analytics pour le suivi des affichages et des clics. Sinon, vous ne pourrez pas observer correctement les activités sur votre site et vous aurez beaucoup de mal à améliorer vos taux de conversion.

À part ça, nous n’avons pas grand-chose à ajouter, l’art est fait pour être admiré. Nous vous laissons seul juge.

6. Super team deluxe

Ce site offre une expérience utilisateur absolument jouissive. En effet, le design, l’UX et les animations sont parfaitement en phase avec la marque :

• Boutons en dégradé et arrière-plans animés
• Navigation facile d’un produit à l’autre
• Slider avec preuves sociales vraiment cool.
• Super positionnement du logo.
• Animations sublimes.

Vous ne vous lasserez jamais de vous amuser avec ce site Web.

Conseil de Pro

Notez toutefois que ces couleurs et interactions s’adressent à un public spécifique à la recherche de produits particuliers. De plus, les UX de même type sont davantage adaptées à des sites Web avec un nombre de pages réduit. Donc, si vous avez une boutique de vêtements chics, ou que vous proposez de grandes collections, nous ne vous recommandons pas ce type de structure. Cependant, si vous optez pour un design personnalisé, une bonne agence de design devra travailler en profondeur et créer une expérience utilisateur uniquement axée sur l’esprit de votre marque. Alors, choisissez judicieusement.

Voici quelques captures d’écran du site de Super Team Deluxe :

 

 

 

7. Bombas

Bombas vend des chaussettes, et uniquement des chaussettes, l’histoire de leurs débuts et de leur financement est assez impressionnante. Mais ce n’est pourtant pas la raison pour laquelle ils font partie de cette liste, c’est à leur conversion UX qu’ils doivent leur présence dans cet article. Voici ce qu’ils ont fait :

1. Ils ont utilisé la section barre de défilement inutile dans l’en-tête de la page d’accueil.

Saviez-vous que les sliders/carrousels ne sont d’aucune utilité sur votre page d’accueil ? Nous avons mené de nombreuses expériences auprès de nos clients et, quoiqu’il arrive, les résultats sont les mêmes, ils génèrent un engagement très faible (moins de 2 % du trafic). Si vous n’êtes pas convaincu, visitez ce site Web dédié : http://shouldiuseacarousel.com/ qui vous le démontrera.

Ce que Bombas a réalisé est très simple : proposer uniquement des liens de navigation utiles au visiteur.

Si vos clients veulent aller droit au but, vous devez les y aider.

Avez-vous remarqué le petit texte en bas à gauche ? Il s’agit de leur politique philanthropique sociale ainsi que d’autres informations utiles. Du point de vue du client, atteindre sa destination est l’objectif premier, apprécier les autres aspects de votre site Web est donc facultatif.

2. Simplification des options des produits

Ils ont réussi à réduire au maximum les frictions dans l’expérience d’achat. Leurs chaussettes ont 2 options : la couleur et la taille. Voici ce qu’ils ont fait :

• Puisque du point de vue du client la couleur est l’option principale, ils incluent directement ce critère dans la fiche produit, à chaque fois.
• « Ajouter au panier » apparaît en survolant le produit.
• Une fois encore, c’est seulement lorsque vous passez la souris sur « Ajouter au panier » que vous verrez apparaître les différentes tailles disponibles.

Cette astuce UX est absolument géniale, et est de plus en plus utilisée dans les interfaces modernes. Pourquoi présenter une longue liste d’options au client quand vous pouvez leur proposer 1 seul choix à la fois.

Ils se sont également intéressés à de nombreux petits détails pour parfaire leur site. Nous vous laissons les trouver vous-même.

8. LuxyHair

L’élément qui nous a convaincus de faire figurer LuxyHair dans cette liste est leur guide conçu intelligemment. L’objectif est de guider les clients potentiels d’une manière transparente et fluide vers le produit qu’ils recherchent au lieu d’énumérer tous les produits en même temps et de perdre les clients parmi tous les choix proposés. Voici quelques captures d’écran :

Vous pouvez vous poser la question : pourquoi n’ont-ils pas permis aux clients de sélectionner des produits directement après la deuxième étape. Deux raisons motivent ce choix :

• Améliorer le SEO
• Collecter plus de données pour mieux comprendre leurs clients

9. SuzyQ

Le dernier exemple de boutique Shopify est aussi beau qu’il en a l’air, un créateur de boîte de donuts idéale, très simple d’utilisation. Jetez un œil à ce GIF :

J’espère que cette liste vous a plus, et qu’elle vous a permis de trouver quelques idées utiles que vous pourrez utiliser afin d’améliorer vos taux de conversion.