Quels sont les avantages et les inconvénients de la conception skeuomorphique dans les transactions de paiement?
Le processus de paiement ou de paiement dans une application est essentiel et doit fonctionner correctement pour que les utilisateurs inexpérimentés sentent qu'ils remplissent les formulaires correctement. J'ai vu de nombreux exemples où un utilisateur prend une carte de crédit et essaie de lire le formulaire et ce qui se passe où. Les utilisateurs expérimentés ne rencontrent pas ce problème car ils l'ont souvent fait et trouvent le numéro de carte de crédit, la date valide, le nom et le code CVC. Mais pour aider les utilisateurs inexpérimentés, je pourrais mettre en œuvre une conception d'interface graphique skeuomorphique pour surmonter ce problème et leur faire comprendre visuellement ce qui se passe où. Je crains qu'un utilisateur expérimenté ne fasse pas confiance à un processus de paiement trop proche du monde réel. Cela résume quels sont les avantages et les inconvénients de la conception skeuomorphique dans les transactions de paiement?
Un formulaire de paiement habituel ressemble à ceci:
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
La forme équivalente skeuomorphique ressemblerait à ceci:
Design intéressant, je ne l'avais jamais vu auparavant. Je pense que les formulaires de carte de crédit sont si courants que la plupart des gens ont peu de problèmes avec eux, mais si vous avez l'espace supplémentaire pour un formulaire comme celui-ci, je ne vois pas pourquoi vous ne devriez pas l'utiliser.
Une chose cependant, je resterais avec un seul champ de saisie de texte pour le numéro de carte, plutôt qu'un groupe segmenté de quatre. Le champ segmenté peut sembler plus facile, mais introduit une complexité supplémentaire lors de la saisie ou lors des corrections (les utilisateurs devront soit passer manuellement au champ de saisie suivant, soit combattre le comportement automatique que vous introduisez en cas d'erreur). Avec JavaScript et CSS, vous pouvez facilement styliser un champ de saisie de texte unique afin qu'il affiche son contenu segmenté en blocs de quatre.
Je pense que les avantages l'emportent largement sur les inconvénients (le cas échéant). L'utilisation d'une carte de crédit est à la fois visuelle et conviviale. Je vois que cela gagne beaucoup de traction dans la communauté du design, consultez ce lien qui montre un design de ce dont vous parlez sur dribbble.com:
Si la mise en page sur la plupart des cartes est cohérente (je pense que c'est le cas mais que je n'ai fait aucune recherche), je pourrais voir que cela a été particulièrement utile pour les utilisateurs qui ne connaissent pas le processus. S'il est conçu et mis en œuvre de la bonne manière, je ne pense pas que cela ait un effet négatif sur la perception des utilisateurs de la sécurité du site.
Un inconvénient potentiel serait que la mise en page "du monde réel" n'est pas aussi facile à numériser qu'elle manque d'alignement et de proximité.
Si cela est pratique, j'opterais pour un formulaire standard avec une illustration de la disposition de la carte pour la complimenter, car cela semble un juste milieu qui convient aux utilisateurs experts et novices.
Je suis d'accord que c'est un concept intéressant. D'un point de vue pratique, plutôt que de conception visuelle, d'expérience utilisateur, etc., n'oubliez pas que toutes les cartes ne suivent pas le format ci-dessus. Amex pour un n'a pas le format habituel de 4 x 4, plus son numéro CVC est de 4 chiffres et sur le devant de la carte. Vous devez donc probablement demander le type de carte avant de montrer la conception appropriée pour entrer les détails.
De plus, la plupart des cartes ont plus d'informations sur le devant, que vous avez détaillées dans votre conception, telles que la date de début, le numéro de problème, etc. à ajouter, par exemple date de début au lieu de valide jusqu'à la date. Cela pourrait être plus probable avec des utilisateurs inexpérimentés qui s'appuieront trop sur la disposition visuelle de votre conception, lorsque ce sont les personnes que vous vous efforcez d'aider.
Je suggère que vous ayez un lien vers une mise en page Web plus traditionnelle pour les utilisateurs qui ne ressentent aucun avantage de votre nouveau design. (D'autres détails tels que l'adresse de facturation devront encore être saisis sous une forme standard car ils ne figurent pas sur la carte physique.)
La dernière chose à souligner est que je suis basé au Royaume-Uni, donc ce que j'ai dit ci-dessus à propos d'Amex et d'autres détails de carte pourrait ne pas être vrai ailleurs. Ce qui pose la question des considérations internationales et localisées ...
Quoi qu'il en soit, bonne chance et fair-play pour avoir essayé quelque chose de nouveau!