Renouveler le bouton CTA d'abonnement
notre application web saas a un modèle d'abonnement de 30 jours. nous n'utilisons pas l'abonnement à renouvellement automatique puisque l'utilisateur peut terminer sa mission dans ces jours et sinon prolonger manuellement l'abonnement.
Je travaille maintenant sur cette fonctionnalité, où l'utilisateur peut renouveler son abonnement. l'option de renouvellement est disponible à partir des 7 derniers jours, avant la dernière semaine, il ne verra pas l'option.
J'ai créé une maquette dont je ne suis pas vraiment convaincue qu'elle donne l'impression de "cliquer sur moi" pour renouveler l'abonnement.
le flux pour renouveler l'abonnement est un modal, donc une fois que l'utilisateur clique sur Renouveler, un pop avec 2 étapes sera ouvert.
c'est la disposition de l'écran, je ne sais rien des autres possibilités sur lesquelles je peux mettre le bouton Renouveler. L'emplacement actuel est l'emplacement logique incontournable auquel je pouvais penser.
Je suppose que j'essaie de vérifier deux choses:
- pensez-vous que l'utilisateur comprendra que le renouvellement est cliquable et ouvrira un nouveau flux
- avez-vous d'autres idées sur où/comment le bouton devrait être?
Merci beaucoup
[~ # ~] mise à jour [~ # ~] Ok, donc je repense. puisqu'il s'agit soit de terminer la mission soit de renouveler l'abonnement (dans le cas d'utilisation des 7 derniers jours restants à l'abonnement), j'ai pensé à cette option: 
quelques commentaires:
- Je voulais utiliser une couleur différente pour l'option de renouvellement, mais j'ai le guide de style comme contrainte, car nous n'avons pas d'autres couleurs qui représentent un bouton. nous utilisons le vert ou le bleu
- nous utilisons des boutons plats également dans d'autres endroits de l'application qui ouvrent également de nouveaux flux sur popup
- Je pense que ces deux actions sont liées donc il vaut mieux les rapprocher l'une de l'autre.
OK, c'est donc la solution finale. c'est une combinaison des entrées @Alveros, de la conception matérielle et du langage et de la conception de notre application
À propos de la question mise à jour:
Placer les deux boutons l'un sur l'autre peut créer de la confusion. L'utilisateur pourrait penser que l'un est dédaigneux de l'autre, alors que ce n'est pas le cas. Vous pouvez mettre davantage l'accent sur l'action Renouveler, mais je la laisserais dans une section Renouveler spécifique. Au lieu d'utiliser le même libellé (jours restants) pour l'abonnement, je suggère d'utiliser quelque chose de différent.
Cette image est une suggestion des points précédents au cas où cela aiderait.
Le problème que je vois est que vous utilisez un bouton plat entre plusieurs éléments de texte, il n'est donc pas identifié comme un bouton. Vous pouvez placer le bouton de la même taille/forme que celui de "Soumettre les résultats" que vous avez dans l'image, un peu à droite de l'endroit où il se trouve actuellement. Vous devrez peut-être utiliser deux lignes pour "Jours d'abonnement restants".
5 _______
SUBSCRIPTION | Renew |
DAYS LEFT -------
Essayez également de placer le compte à rebours lié au contenu (à droite maintenant) à côté du titre, afin qu'il soit mieux compris et non mélangé avec le compte à rebours du paiement.
Conception matérielle - Boutons surélevés
Oui.
Les boutons en relief ressortent plus que les boutons plats.
Non.
N'utilisez pas de boutons plats dans les interfaces utilisateur où ils seraient difficiles à voir.
Votre dilemme est juste, le "bouton Renouveler" actuel ne donne pas vraiment l'impression de "cliquer sur moi" pour renouveler l'abonnement.
Le problème ici est la planéité du bouton, sa couleur moins accrocheuse et ses informations. Avez-vous envisagé de le remplacer par une couleur plus attrayante par du CTA réel?
Ici, j'ai trouvé une solution comprenant une petite modification dans votre maquette actuelle.
