portaldacalheta.pt
  • Principal
  • Science Des Données Et Bases De Données
  • Conception Mobile
  • Design De Marque
  • Personnes Et Équipes Produit
Conception Ux

E-commerce UX pour l'expérience mobile



Le terme «commerce mobile» a été introduit il y a 20 ans par Kevin Duffey lorsqu'il a suggéré qu'un appareil mobile pouvait fonctionner comme un point de vente au détail dans la poche d'un client. Compte tenu des limites technologiques de l'époque, qui aurait pensé qu'un jour nous pourrions facilement parcourir, examiner et acheter des produits dans un petit appareil de poche?

Je ne peux pas surestimer à quel point les appareils mobiles changent la façon dont nous interagissons avec nos consommateurs; nous devons accepter ces changements.



- Joel Anderson, PDG de Walmart



La croissance fulgurante du commerce électronique a également alimenté la croissance du e-commerce mobile , vaut désormais près de 700 milliards. Le commerce électronique mobile est actuellement la plus grande partie du gigantesque marché en ligne. Plus de 80% des Américains ont effectué un achat en ligne le mois dernier —Il y a trois ans, ce chiffre n'était que de 11,6%. Un rapport de Business Insider Intelligence a suggéré que le commerce mobile augmentera jusqu'à 45% en 2020. Selon un Recherche ComScore En 2016, les dépenses via les appareils mobiles ont augmenté de 44% par rapport à 2015. flux d



Aspects des statistiques d'achat de smartphones par Statista

Malgré le nombre élevé de ventes, plus de 60% des utilisateurs se sentent toujours préoccupés par avoir vos informations financières piraté lors de l'utilisation d'un téléphone mobile. Cependant, la satisfaction des clients est toujours assez élevée avec les géants de la vente au détail mobile comme Amazon et Apple, tous deux bénéficiant d'un taux de satisfaction supérieur à 80%.

page produit mobile e-commerce ux



Concept de commerce électronique mobile par Alex Khoroshok

Meilleures pratiques UX de commerce électronique mobile pour réussir

Prise en charge du zoom d'image à l'aide des gestes de 'pincement' et de double-clic

Les gens sont familiers avec les gestes comme le double tap et le pincement pour zoomer sur mobile. Lors d'une étude d'utilisabilité du e-commerce mobile, le Baymard Institute il a trouvé que les acheteurs veulent naturellement pouvoir inspecter le produit de manière approfondie et se préoccupent des petits détails. Les utilisateurs qui souhaitaient acheter un produit mais qui ne pouvaient pas l'explorer en zoomant, ne se sentaient pas à l'aise de l'acheter et ne s'engageaient souvent pas dans la vente.

meilleur téléphone pour le développement Android

fonction de sauvegarde du panier dans le commerce électronique mobile ux



Images du produit agrandies à application Overstock.

Il est assez surprenant que sur les 50 applications de commerce électronique mobile les plus rentables, plus de 40% ne prend pas en charge les gestes de zoom .

Même les sites proposant des versions d'images en gros plan ont connu des taux de rebond similaires, ce qui suggère que la prise en charge des gestes de zoom d'image de produit dans une application mobile de commerce électronique est essentielle.



Compte tenu de la petite taille de l'écran des appareils mobiles, il s'agit d'un problème spécifique à la plate-forme. La prise en charge d'au moins une de ces fonctionnalités placera une application en compagnie des 50% des meilleures applications de commerce électronique - la liste la plus rentable.

Quelques facteurs à considérer:



  • Les images basse résolution sont l'équivalent d'images sans zoom. Les utilisateurs souhaitent voir clairement les détails d'un produit et ont besoin d'images haute résolution pour ce faire. L'option d'agrandir une image de faible qualité est tout à fait inutile car elle ne permet pas à l'utilisateur de voir les détails.

  • L'Institut Baymard a constaté que 50% des applications ne disent pas aux utilisateurs de pincer ou de double-cliquer sur les images des produits. Il est important d'indiquer la disponibilité du zoom d'image. Bien que ces gestes soient généralement connus des utilisateurs d'appareils mobiles, ils doivent toujours être montrés comme étant disponibles. L'utilisation d'icônes ou de visuels est recommandée pour ce faire.



Fournir une fonction 'Enregistrer' pour le panier

Comme mentionné ci-dessus, la petite taille de l'écran des appareils mobiles est un obstacle majeur en matière de commerce électronique mobile. L'Institut Baymard a observé que plus de 61% des utilisateurs d'appareils mobiles vous utiliserez souvent vos bureaux pour finaliser votre achat au lieu de votre téléphone.

Formulaires d

Caddies `` stockables '' dans le Applications Nordstrom Oui Overstock.

La fonction «Enregistrer le panier» réduit le nombre d'abandons de panier et permet aux acheteurs de sauvegarder des articles pour un achat ultérieur. Paniers persistants permettre aux clients de continuer leurs achats sans avoir à rechercher le produit souhaité lors du retour - une fonctionnalité qui 55% des acheteurs voudrais utiliser.

Voici comment fidéliser ces clients:

en-tête c++ et fichiers source
  1. Faites fonctionner le panier comme une liste de souhaits en enregistrant les articles ajoutés au panier.
  2. Créez une option pour permettre aux acheteurs de recevoir des e-mails contenant des articles enregistrés. Affiche des rappels qu'ils peuvent utiliser leur bureau pour payer.

Utilisez des formulaires descriptifs et bien étiquetés

L'application des meilleures pratiques pour les formulaires mobiles est une autre considération. Il est important que la conception UX d'une application ou d'un site de commerce électronique, tout en éliminant toute confusion, permette aux utilisateurs de remplir des formulaires le plus rapidement possible.

Voici les meilleures pratiques pour la convivialité du formulaire mobile:

  • Placez les étiquettes de formulaire sur le dessus du formulaire pour améliorer la lisibilité, la facilité d'utilisation et la clarté. Expliquer pourquoi certaines informations sont nécessaires réduira l'anxiété des utilisateurs lorsqu'ils remplissent des formulaires sur l'appareil mobile.
  • Faites correspondre les entrées de texte avec le clavier approprié. Affichez un pavé numérique lors de la saisie de numéros de téléphone et de chiffres de carte de crédit et un panneau de texte lors de la saisie d'adresses et de texte. Cela réduira les erreurs des utilisateurs et accélérera le remplissage du formulaire.
  • Limitez le nombre de champs de saisie pour réduire l'effort de saisie. Moins de champs d'entrée entraîneront un formulaire moins chargé et amélioreront le flux de sortie UX.
  • Fait avancer automatiquement chaque champ à l'écran une fois terminé. Cela n'obstruera aucune vue des champs incomplets.
  • Les usages steppers au lieu de menus déroulants pour réduire les efforts des acheteurs. Les steppers Ils sont utilisés pour augmenter ou diminuer la valeur d'une quantité constante et constituent une solution plus rapide et plus attrayante à utiliser.

recherche suggestive e-commerce mobile ux

Formes clairement identifiées dans la page mobile de Sears.

Fournir une autosuggestion intelligente, une détection automatique, une recherche d'adresse et des erreurs

L'objectif principal de l'autosuggestion est de faciliter et d'accélérer le remplissage des formulaires par les utilisateurs. La suggestion automatique prédit les requêtes de recherche courantes et aide les acheteurs à trouver des produits plus facilement. La convivialité mobile peut être encore améliorée en utilisant la détection automatique du type de carte de crédit. Détection automatique Rationalise le processus d'achat en fournissant une rétroaction immédiate sur les types de cartes pris en charge. Automatiser autant de processus de saisie de données que possible - de préférence avec des images - améliore l'expérience utilisateur et affectera positivement les taux de conversion.

Micro-interactions de commerce électronique UX

Rechercher avec autosuggestion dans applications de Epsy Oui Toys r us

La recherche d'adresse et la validation accélèrent le processus de paiement - diverses API (telles que Google Adresses Oui USPS ) permet une implémentation facile de cette fonctionnalité. Fournir une validation d'entrée en ligne pour les erreurs est également une bonne pratique dans la conception UX mobile. Le manque de performances rapides est une énorme frustration pour les acheteurs de commerce électronique. Cela peut être amélioré en fournissant aux utilisateurs des commentaires en direct sur leurs progrès (lors du paiement, par exemple), en particulier lorsqu'ils font une erreur par inadvertance. Cela permet aux utilisateurs de corriger leurs erreurs immédiatement, ce qui affecte la convivialité de manière positive.

Utilisez les micro-interactions pour améliorer UX Mobile Shopping

Micro-interactions ce sont des détails dans l'interface d'un produit destinés à effectuer une seule tâche tout en améliorant l'écoulement naturel du produit. Aimez et évaluez un produit, choisissez une couleur et une taille, et faites glisser vers le bas pour mettre à jour les données sont des exemples de micro-interactions.

Mise en page ux du commerce électronique mobile orientée pouce

Micro-interaction de la sélection des couleurs des produits dans le commerce électronique mobile par Mykolas Puodziunas

Compte tenu de leur fréquence, les micro-interactions peuvent aider ou nuire à l'UX d'une application de commerce électronique mobile.

Les micro-interactions peuvent être utilisées pour:

comment commencer avec bootstrap
  • Guider l'utilisateur à travers l'application de manière plus intuitive;
  • Transmettre un meilleur sentiment de confiance, réduire l'anxiété du client et augmenter le confort psychologique global grâce à des interactions plus naturelles et fluides;
  • Prévenir les erreurs futures et fournir une rétroaction immédiate aux utilisateurs en fonction des activités qu'ils ont accomplies; je
  • Améliorez l'interaction de l'utilisateur avec l'application en répondant aux notifications.

Fournit une interaction facile et orientée vers le pouce

Comprendre les façons les plus courantes dont les acheteurs utilisent leurs appareils mobiles améliore l'expérience utilisateur et la convivialité du commerce électronique mobile. En 2013, Steven Hoober a demandé 'Comment les utilisateurs ont-ils vraiment des appareils mobiles?' et ont observé comment les gens interagissent et tiennent leur smartphone, et ils ont remarqué trois principaux modèles de comportement qui devrait guider la conception de l'UX mobile.

fournir un sentiment de sécurité dans le commerce électronique mobile avec des badges de confiance

Où les mains et les pouces se posent-ils sur l'appareil? UX orienté vers le pouce

L'adaptation des interfaces à la manière naturelle dont les gens utilisent les téléphones portables augmentera le confort de l'utilisateur et réduira l'anxiété des acheteurs. Les appareils mobiles et les tailles d'écran varient, mais la «zone du pouce» est un aspect critique de la conception et l'expérience utilisateur reste la même.

Conception autour de la 'zone du pouce'

  • Résout les problèmes potentiels de navigation et d'exploration
  • Améliorez l'interaction en adaptant les gestes et en atteignant avec un seul doigt
  • Convertit mieux et augmente la convivialité en plaçant les éléments importants dans des zones «faciles à atteindre»

Considérations pour la conception de commerce électronique mobile orientée vers la conversion

Démontrer un sentiment de sécurité dans les applications de commerce électronique mobile

La Sécurité C'est l'une des plus grandes préoccupations des utilisateurs lorsqu'ils achètent sur des appareils mobiles. Communiquer que leurs transactions sont sécurisées ajoute beaucoup de valeur à la perception positive que les acheteurs ont d'un magasin.

Conception de boutons suggestifs pour le commerce électronique mobile UX

Utilisation des badges de confiance dans Applications Walmart Oui Walgreens

Voici quelques techniques de conception UX qui communiquent la sécurité aux utilisateurs et réduire l'anxiété des utilisateurs :

  • Faites en sorte que les étiquettes des boutons soient suggestives et claires sur la destination des acheteurs. Des mots comme «procéder», «sécurisé» et «chiffré» renforceront le confort psychologique des utilisateurs.
  • Utilisez des symboles de verrouillage pour garantir aux acheteurs que leurs transactions sont sécurisées.
  • Utilisez les informations d'identification de confiance de fournisseurs de sécurité tels que McAfee Secure et Norton. Cela aide les utilisateurs à percevoir positivement un site Web (étude de l'Institut Baymard).
  • Appliquer les principes de psychologie des couleurs dans la conception pour une meilleure perception de la confiance par les acheteurs. Certains de ces principes incluent des couleurs adaptées au public et propres au genre.

Recherche de commerce électronique mobile

Conception de bouton suggestive sur Applications Dell

Priorisez votre recherche (et gardez-la au-dessus du pli)

Les acheteurs utilisent une application mobile ou un site de commerce électronique pour parcourir les produits ou acheter un produit particulier; par conséquent, une recherche bien conçue devient essentielle pour une application mobile de commerce électronique. eBay pense que la recherche de votre site est l'un des plus importants fonctionnalités pour les acheteurs mobiles et le met en valeur en le plaçant au centre et au-dessus de l'interface.

Flux de paiement UX du commerce électronique mobile

Rechercher dans application mobile American Eagle Outfitters Oui L.L.Bean

Considérations importantes pour la recherche mobile:

  • Assurez-vous qu'il est visible! Garder la barre de recherche facilement accessible et au-dessus du pli offre aux acheteurs un moyen sans effort de rechercher des produits.
  • Fournissez une recherche anticipée en utilisant les données acquises à partir de modèles de recherche courants et en affichant les produits associés sur les pages de résultats de recherche.
  • Offrez des options de filtrage avancées qui permettent aux clients de trouver les produits souhaités rapidement et sans effort.

Un aspect important à prendre en compte lors de l'affichage des formulaires de recherche est qu'ils ne sont utiles Dans les premiers stades de l'interaction d'un utilisateur avec l'application. Les utilisateurs recherchent souvent l'application au début de leur parcours d'achat, et il peut y avoir des cas où l'affichage d'un formulaire de recherche plus tard sur la route peut endommager l'UX.

Par exemple, pendant le processus de paiement, la recherche n'est plus utile et ne sera que distrayante car elle pourrait amener les utilisateurs à perdre leur concentration et à renoncer à leur engagement d'achat.

Fournit un paiement rapide, facile et pacifique

Des études ont montré que le processus de paiement est la partie la plus stressante de la réalisation d'un achat en ligne. L'Institut Baymard rapporte un taux de 35% pour abandon de panier en raison de la nécessité de créer un compte avant d'acheter. Pour réduire les taux d'abandon de panier, il est important de concevoir un processus de paiement rapide et facile qui ne demande pas aux acheteurs de s'inscrire en premier.

Sortie UX du commerce électronique mobile

Flux dans le processus d'achat Applications mobiles Etsy Oui Ann Taylor

Études convivialité a constaté que plus de 60% des utilisateurs avaient du mal à trouver l'option de paiement des clients; par conséquent, l'option de paiement du client doit être clairement visible et facilement accessible.

Expérience d

Designs Web animés de flux de trésorerie de commerce électronique mobile par Michael Pons

Voici quelques suggestions pour un meilleur flux de trésorerie du commerce électronique:

réalité augmentée vs réalité mixte
  • Pour promouvoir l'engagement des utilisateurs, étiquetez chaque étape du processus de paiement en numérotant et en affichant l'étape actuellement active.
  • Utilisez des éléments visuels tels que des barres de progression pour afficher et vous déplacer dans le processus de paiement.
  • Fournissez une option pour vous inscrire et vous connecter pendant le processus de paiement, mais faites un choix.
  • Pour réduire l'anxiété et les taux de rebond, suggérez aux utilisateurs de se connecter ou de s'inscrire après le paiement s'ils se sont inscrits en tant qu'invités.
  • Appliquer techniques de divulgation progressive pour améliorer la concentration de l'utilisateur et charger le contenu 30% plus rapidement.

Bottom line: Quelles sont les principales caractéristiques d'une conception réussie de commerce électronique mobile?

  • Fournit des flux de paiement et d'inscription rapides et faciles
  • Insufflez un sentiment de sécurité et de confiance en affichant des icônes, des badges, des critiques et des témoignages appropriés
  • Fournit une interaction conçue autour de zones adaptées aux pouces
  • Utilisez une navigation cohérente et condensée
  • Intègre une recherche rapide et un filtrage facile des produits
  • Comprendre le lien direct entre le stress des utilisateurs, l'anxiété et les taux de conversion des applications mobiles
  • Fournit des expériences de site mobile rapides et réactives
  • Prend en charge les gestes pour le zoom de l'image du produit

L'espace de commerce électronique mobile ne fera que s'agrandir

Tendances du commerce électronique mobile montrent que le marché du commerce électronique mobile connaît une croissance exponentielle et que la croissance de l'industrie a créé une multitude d'avantages pour les spécialistes du marketing. Cependant, cela a entraîné de nombreuses meilleures pratiques et normes pour la conception de commerce électronique mobile que les spécialistes du marketing doivent suivre pour réussir.

Application de magasin de vêtements par Vitaly Rubtsov

Les acheteurs attendent une application mobile qui fonctionne bien, qui soit belle et qui s'adapte à leurs comportements. Bien que chaque application soit différente avec ses propres limites et objectifs, suivre les principes fondamentaux décrits dans cet article vous aidera à créer des applications de commerce électronique mobiles réussies.

Téléchargez une aide-mémoire sur l'amélioration du commerce électronique Mobile UX

•••

Articles sur l'e-commerce mobile pour en savoir plus:

50 avis sur le site de commerce électronique mobile 10 des meilleurs sites de commerce électronique mobile Commerce mobile - Terrible UX

Considérations pour lever votre propre fonds de capital-investissement

Processus Financiers

Considérations pour lever votre propre fonds de capital-investissement
Industrie de la rencontre en ligne: l'entreprise de l'amour

Industrie de la rencontre en ligne: l'entreprise de l'amour

Processus Financiers

Articles Populaires
Explorer la fonctionnalité Get & Transform d'Excel
Explorer la fonctionnalité Get & Transform d'Excel
Comment aborder les wrappers pour les propriétés Swift
Comment aborder les wrappers pour les propriétés Swift
ApeeScape s'associe à Guidant Global pour offrir un accès à la demande au réseau Elite de pigistes
ApeeScape s'associe à Guidant Global pour offrir un accès à la demande au réseau Elite de pigistes
Tutoriel Apache Spark Streaming: Identifier les hashtags Twitter tendances
Tutoriel Apache Spark Streaming: Identifier les hashtags Twitter tendances
Conception accessible vs conception inclusive (avec infographie)
Conception accessible vs conception inclusive (avec infographie)
 
L'intégration continue d'iOS avec le serveur Xcode expliquée
L'intégration continue d'iOS avec le serveur Xcode expliquée
Meilleurs éditeurs de programmation? Une bataille sans fin sans vainqueur clair
Meilleurs éditeurs de programmation? Une bataille sans fin sans vainqueur clair
Comment GWT déverrouille la réalité augmentée dans votre navigateur
Comment GWT déverrouille la réalité augmentée dans votre navigateur
Webpack ou Browserify & Gulp: quel est le meilleur?
Webpack ou Browserify & Gulp: quel est le meilleur?
Business Analyst - Stratégie & Analytics
Business Analyst - Stratégie & Analytics
Articles Populaires
  • angularjs 2 étape par étape
  • comment concevoir un prototype
  • intelligence économique et intelligence artificielle
  • différence entre scala et java
  • différence entre scala et java
  • meilleurs langages de programmation pour la robotique
Catégories
  • Science Des Données Et Bases De Données
  • Conception Mobile
  • Design De Marque
  • Personnes Et Équipes Produit
  • © 2022 | Tous Les Droits Sont Réservés

    portaldacalheta.pt