web-dev-qa-db-fra.com

Page Paramètres - Boutons Enregistrer et Annuler

veuillez voir un filaire joint qui explique grossièrement ma question.

Je travaille sur une page de paramètres - voir "Mes paramètres" sélectionné dans la navigation secondaire imbriquée sous une autre rubrique.

Sur cette page, l'utilisateur peut modifier ses photos ainsi que d'autres paramètres. Je prévoyais de désactiver le bouton `` Enregistrer '' lorsque l'utilisateur atterrit sur la page, puis de l'activer une fois que l'utilisateur a modifié une photo ou l'un des autres paramètres - Le bouton `` Enregistrer '' sera ensuite désactivé à nouveau une fois que l'utilisateur clique dessus. Le bouton "Enregistrer" gardera l'utilisateur sur cette page, la seule façon dont il dispose de quitter cette page est de cliquer de nouveau dans le navigateur ou sur l'une des rubriques principales/secondaires en haut de la page.

Je ne suis pas certain de ce que le bouton `` Annuler '' devrait faire, ou s'il est même nécessaire, mais j'y travaille en ce moment en fonction de ce qui était auparavant avant de commencer à travailler - À quoi vous attendriez-vous du comportement de le bouton "Annuler" pour être si vous étiez un utilisateur sur la page affichée? (Avant et après la modification des paramètres).

Si vous ne pensez pas que le bouton "Annuler" devrait être là, ce serait formidable d'entendre vos pensées.

Settings Page Wireframe

3
Richard

Je pense que l'utilisation d'un bouton Annuler devrait éloigner l'utilisateur de la page et supprimer toutes les modifications apportées.

n bouton d'annulation est une "sortie" utile d'une page de paramètres.

Sans cela, le seul moyen pour un utilisateur de s'en aller et de ne pas modifier les paramètres est de cliquer sur un lien de page. L'utilisateur n'est pas intéressé par le lien sur lequel il clique, mais l'utilise plutôt comme bouton Annuler.

Où doit-il rediriger l'utilisateur?

Probablement vers une page principale, si cette page de paramètres se trouve dans un tableau de bord ou une page de profil, il s'agit probablement d'une bonne page de redirection. Sinon, peut-être la page d'accueil.

1
Alvaro

Je pense que votre approche avec le bouton Enregistrer et votre comportement est bien. Cependant, lorsqu'il s'agit d'annuler ou de réinitialiser toutes les valeurs ou mises à jour sur un formulaire de profil tel que celui-ci, faire défiler jusqu'en bas pour quitter la page ou réinitialiser les valeurs à leur état d'origine, peut être considéré comme un manière inefficace pour l'utilisateur de le faire.

Ma suggestion serait de diviser les informations en morceaux. Ayez une chose enregistrée une fois terminée. Par exemple, le modèle mental pour la plupart des utilisateurs qui mettent à jour une photo de profil, est de la télécharger et de la sauvegarder, puis de passer à la prochaine information et de compléter les petits morceaux d'informations comme apposés sur tout et ensuite tout sauvegarder.

Non seulement cela répondra à votre question pour l'annulation, mais cela limitera également vos risques d'erreurs. Demander à l'utilisateur de tout terminer, mais vous obtenez une erreur de serveur et il doit tout recommencer. Guidez-les pour obtenir des gains rapides et limiter la recapture des données en cas de problème.

J'espère que c'est utile

0

Généralement , "Annuler" est défini comme:

décider ou annoncer qu'un événement prévu n'aura pas lieu; raccroche:

Par conséquent, la [Action]|Cancel la combinaison est appropriée pour un processus distinctif. Un exemple courant est le Ok|Cancel pour les cases de confirmation. L'utilisateur a démarré un processus et le bouton Cancel lui permet d'arrêter le processus qu'il a démarré et de conserver l'ancien état.

enter image description here

La façon dont l'utilisateur arrive sur un écran définit la portée et les actions attendues qu'il peut effectuer sur cet écran. Dans le cas de la boîte de dialogue ci-dessus, l'utilisateur est présenté avec cet "écran" après avoir cliqué sur un bouton Approve. Le chemin est donc:

Approve  >  Read confirm message  >  Respond with: Cancel|Ok

~~~

Dans votre cas , comparez "Mes paramètres" et "Changer la photo":

Qu'espérez-vous voir et pouvoir faire si vous cliquez sur "Mes paramètres". Quels champs et boutons vous viennent à l'esprit? Que diriez-vous de "Changer la photo"?

Affinez cela un peu. Si vous cliquez sur "Mes paramètres", Cancel est-il une réponse appropriée? Si vous cliquez sur "Modifier la photo", Cancel est-il une réponse appropriée?

~~~

Donc, bien sûr, le contexte détermine les attentes des utilisateurs.

Une autre chose à considérer est Cancel vs Undo. Les deux reviennent à l'état précédent. La différence est Cancel est pour interrompre un processus en cours et Undo est pour annuler un processus terminé.

~~~

Revenons au scénario que vous avez décrit: l'utilisateur est présenté avec la page "Mes paramètres" avec le bouton Save désactivé. L'utilisateur effectue une modification et le bouton active. Elle clique sur Save, reste sur la page et le bouton Save est désactivé.

Quelle est la contre-réponse appropriée: Cancel ou Undo?

.

Idéalement , à mon avis, lorsque l'utilisateur clique sur "Mes paramètres", on lui présente tous les champs de paramètres et les boutons Save et Undo. Lorsque vous cliquez sur l'un des boutons, l'utilisateur reste sur la page des paramètres. Pour s'éloigner de cette page, elle utilise la barre de navigation.

Cependant, lorsque l'utilisateur clique sur "Modifier la photo", seuls les champs de modification de la photo et Change photo et Cancel, éventuellement dans un contexte modal. En cliquant sur l'un des boutons, l'utilisateur revient à la page où il a cliqué sur "Changer la photo".

0
bloodyKnuckles